Jump to content


  • Content Count

  • Joined

  • Last visited

  • Days Won


Everything posted by lynkfs

  1. lynkfs


    A quick solution : have a form with a panel and a button in the custom template add these lines <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.css" integrity="sha384-bsHo4/LA+lkZv61JspMDQB9QP1TtO4IgOf2yYS+J6VdAYLVyx1c3XKcsHh0Vy8Ws" crossorigin="anonymous"> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.js" integrity="sha384-4z8mjH4yIpuK9dIQGR1JwbrfYsStrNK6MP+2Enhue4eyo0XlBDXOIPc8b6ZU0ajz" crossorigin="anonymous"></script> in the onclick handler of the button add this code procedure TForm1.
  2. A bit of a weird topic name for a product which elevates Object Pascal using javascript. I could have named it 'Web Components' (as I did a while ago) or maybe better 'Api Programming'. There are a number of organisations which look after the web api's. W3C is the most known one, but there are others looking after specific parts (WhatWG, Khronos etc.). What they have in common is that they publish the web api's they're looking after in a specific formal format (WebIDL). Smart has transformed these specifications in corresponding pascal classes, contained in the APIs directory in th
  3. Basically the <select> element where the combobox is based on, is under control of the browser. And can't be manipulated from pascal/js. There is a hack (there is a hack for everything) to fake it : procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var W3ComboBox1 : Tw3ComboBox := TW3ComboBox.Create(self); W3ComboBox1.SetBounds(50,70,250,30); W3ComboBox1.Add('line 1'); W3ComboBox1.Add('line 2'); W3ComboBox1.Add('line 3'); W3ComboBox1.handle.style['opacity'] := 0; var W3Panel1 : TW3Panel := TW3Panel.Create(self)
  4. This link is from feb 2019 (nasa related), so may work : https://www.jakenherman.com/articles/2019-02/push-notifi-cordova-firebase (there are more links as a result of googling 'cordova push notifications plugin 2019', which may be of relevance)
  5. could the 'readyexecute' method be repurposed so that code changes to existing projects could be avoided ?
  6. lynkfs


    For this app I used the HOP-H58 bluetooth printer. It comes with bluetooth and usb connectivity, and even a socket for a cash drawer. At an unbeatable price of $26 USD delivered (!), this gives me a mobile POS (invoice print) solution, where only the printer and a mobile phone is needed. Amazing.
  7. lynkfs


    How to connect webapp to a bluetooth enabled printer. Basically there are 2 avenues to do that : a) going native and b) the web bluetooth api Going native This involves using PhoneGap or Cordova, plus installing a plugin to make the bluetooth capacities of the mobile target platform available in the js world. I found this plugin on github, a cordova plugin, so used cordova rather than phonegap. The install sequence for a clean install of everything looks something like see https://cordova.apache.org/docs/en/latest/guide/cli/ install node install npm install c
  8. lynkfs

    kodi grid

    @lennart posted a reference to a scrollable grid in Delphi Developer. See post here. Since he produced this grid in Smart Pascal, it might be of interest to forum members. This grid basically takes items of irregular dimensions and determines how to best fit those items in rows/columns. The code he posted doesn't work in my (latest) version of Smart, but with a few tweaks here and there I got it going. At least for strings that is. Icons/images are not fully implemented in the source he posted, but I'll take another look. Won't be too difficult. I like the marc
  9. don't use the items object : procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components W3ComboBox1.add('Line 1'); W3ComboBox1.add('Line 2'); W3ComboBox1.add('Line 3'); end; procedure TForm1.W3Button1Click(Sender: TObject); begin W3ComboBox1.Clear; end;
  10. lynkfs


    it is a bit slow timing for this example : start: 0.0849609375ms init tensorflow : 0.936767578125ms tensorflow loaded : 1017.56591796875ms init coco-ssd : 1017.623779296875ms coco-ssd loaded : 1421.75390625ms get image : 1422.751708984375ms Predictions: 45869.56982421875ms Firefox has the same sort of response times, Edge doesn't support console timers. It is basically the time to load the mobilenet model itself from the google servers, which is responsible for the large timegap between get image and the resulting predictions. GET "
  11. lynkfs


    edited Been a while since I had a look at Googles Tensorflow deep learning library (js version) In the meantime this library has expanded quite a bit, most notably it enables using pre-built models for a variety of tasks. This one takes any image and detects up to 90 categories of objects in the image (persons, dogs, traffic lights etc) The library correctly identifies 2 objects of type "person" in the above image (image 620*408 pixels, bbox coordinates x,y,width,height) Usage is incredibly simple : load the libraries, display an image in the browser and issue a
  12. lynkfs


    I recently revisited the console object, available in all browsers, and discovered some newbies I didn't know about. The methods and properties below may be sometimes useful for debugging purposes. The console object is tied to the global window object, so access either by browserapi.window.console.log('whatever'); or define a reference to the window object : var window external 'window': variant; and call like window.console.dirxml(self); Some console methods are wrapped in SmartCL.System (like writeln ea) and SmartCL.Console The console.dirxml() above gives an xm
  13. Some interesting decisions to be made. side note : the native/shoestring rtl uses MutationObservers exclusively, which worked well for me. Interested to see what the speed difference is
  14. To make this work using MutationObservers I would probably do something like this: demo, project Essentially the TestPanel is put here under the surveillance of a MutationObserver, which triggers when all changes to the panel have been applied (including the original sizing). After that it is ready to accept the label etc. procedure TTestPanel.InitializeObject; begin inherited; WriteLn('InitializeObject called -> Creating Label'); self.observe; self.handle.addEventListener('readytogo', procedure(e:variant) begin writeln('heard readytogo'); var Lab:=TW3Label.Create
  15. lynkfs

    file system

    Scripts need to be loaded once only. I usually do that in the Form.InitializeForm section, but you can do it anywhere (as long as the script is loaded before use) procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var Script := browserapi.document.createElement('script'); Script.src := 'res/filer.js'; browserapi.document.head.appendChild(Script); Script.onload := procedure begin writeln('script loaded'); ... the asynchronous onload event triggers after the script has loaded Alternatively you can use the $R
  16. lynkfs

    file system

    last one. It becomes even better when stacking 'nohost' on top of it all. This demo shows that it is possible to fire up a clientside file server in the browser ! (you might have to refresh once, check console ctr-shift-i)
  17. lynkfs

    file system

    And here is a quick File Explorer like project for a client side file system Note : uploaded the first 2 files of the smart directory "Projects/Contest Demos/Afternoon Walk" Just click on treeview until you get there
  18. lynkfs

    file system

    A quick test on persistence : indexedDB (and hence the client file system) is persistent per device. Which means that once a filesystem is created, it will be there the next time the app is activated. Some caveats though it is pretty safe, but not 100% so. Browsers may delete a database if there is not enough diskspace. Why and when differs between browsers somewhat too. storage access is regulated by 'same origin'. In the demo above the file system is accessible in the lynkfs.com domain, but not in ibm.com Which is ok. firing up multiple instances of chrome does
  19. Look at Primož Gabrijelčič's book on SMS, available on https://leanpub.com/asmartbook Very valuable and I still consult it on a regular basis There is some info on http://www.pp4s.co.uk/main/smart-gettingstarted.html as well
  20. lynkfs

    file system

    This code works (File system in the browser) create and mount a FileSystem create a directory write a file with some contents read the stats of this file read the contents of this file write another file list the directory contents in a memo Demo procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var Script := browserapi.document.createElement('script'); Script.src := 'res/filer.js'; //https://raw.githubusercontent.com/filerjs/filer/develop/dist/filer.js browserapi.document.he
  21. lynkfs

    file system

    The original html5 spec had a file api which allowed to read and write files clientside (the File Directories and System Api). This was only fully implemented by Chrome at one point, but even then Chrome needed to be started with a switch (-allow-file-access-from-files). Today clientside storage is limited to cookies, local/session storage, indexedDB and the Cache API. While I understand the reasons for limiting file handling on the client, it is sometimes annoying. Fortunately some pretty creative solutions have emerged. One of them is Filer. This is a nodejs fs filesystem look
  22. lynkfs


    The standard generated index file in smart doesn't contain a link tag for a favicon (something like <link id="favicon" rel="icon" href="res/favicon.png" type="image/png" sizes="16x16"> However this can be added in code (or add it manually to the default.html file in the template directory, or add it to a Custom Template in the ide) In code : procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var link := w3_createHtmlElement('link'); link.id := 'favicon'; link.href := 'res/favicon.png'; link.rel := 'icon'
  23. If this shortcut approach (providing html code directly in smart code) works for you, then adding event handlers has to be done in html too. Just add an ID to the img element so you can find the image element in the dom, and add an eventlistener to it : <!-- Photo by Drew Farwell on Unsplash --> <img id="mypic01" src="https://images.unsplash.com/photo-1513309914637-65c20a5962e1?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3450&q=80" alt="Several friends doing a toast"> <figcaption><h3>Drak
  24. lynkfs


    Edited. The final piece of the puzzle is to find out if it is possible to use IPP printing directly from the browser, bypassing the need for a node server. The answer, surprisingly, is that it is possible. There are some caveats, but essentially it can be done. First thing is to get the node.js project and transform it into something a browser understands. The way to do this is to use Browserify, which will bundle the project file, the ipp library and all of its dependencies : install browserify (npm install browserify) Save the first node.js code example of the previous
  25. lynkfs


    Edited. And then there is IPP : Internet Printing Protocol This protocol allows direct access to networked printers, ask for their capabilities, prepare print jobs, manage print queues, execute print jobs and get results. Exactly what I was after. I read through the documentation on the website of "The Printer Working Group", which looks after the standardisation of this protocol. (http://www.pwg.org/ipp/ippguide.html). To actually use this protocol, there are various IPP client libraries available (C, Java, Python). Fortunately there is a node.js variant as well (https:
  • Create New...