The library and the api-doc is included in the stack, so that an offline usage is possible.

I added a javaScriptHandler that yields a notebook-like interface for close to no javaScript knowledge.

I added also functions "factorial" and "factors", so you can compute for example the prime factors of factorial(77) = 77*76*...*3*2*1 = 145183092028285869634070784086308284983740379224208358846781574688061991349156420080065207861248000000000000000000 = (2^73)*(3^35)*(5^18)*(7^12)*(11^7)*(13^5)*(17^4)*(19^4)*(23^3)*(29^2)*(31^2)*(37^2)*41*43*47*53*59*61*67*71*73
which is, for example, the number of different orders of 77 queued objects.

HTMLtoIMAGE makes an image of the *whole* HTML content of a browser widget (while waiting for printToPdf from the browser widget in 9.x). The image may become a height of several thousands pixels.

The stack is based on the library from https://html2canvas.hertzen.com (MIT licensed).
This javaScript library takes "screenshots" of webpages based on the DOM, and as such may not be 100% accurate to the real representation as it does not make an actual screenshot, but builds the screenshot based on the information available on the page.
Then it saves the data to a canvas. ["Overlayed" (with movies) pages as livecode.com are only partially saved, just try.]

We don't display this HTML5-canvas in a browser but catch the imagedata from it and save it to a local image in the folder where the stack resides.
You can set options:

the image format: JPEG with quality level or PNG,

an image scale (percentage)

The javaScript library is included in the stack (please watch the license).
For the use in your own stacks see the help of the stack.

BrowserSnapshot makes an image of the *whole* HTML content of a browser widget (while waiting for printToPdf from the browser widget in 9.x). The image may get a height of several thousands pixels.

It works now for both: pages that are clipped horizontally and/or vertically by the viewport.

This is a pure LC Script solution: The widget is scrolled down appropriate portions of the whole HTML page and a snapshot is made.
Then the snapshots are merged (optionally scaled) into ONE image of format PNG or JPEG.

• This is from the image-puzzle part the same as the pure LC-Script version "JigsawPuzzle2d" here on "Sample Stacks" (which runs on LC 6/7/8/9 an desktop (and even Raspi), see viewtopic.php?p=149831#p149831

• For the video-puzzle part you can choose the server (with videos from the server) and get an installation instruction for use with your local server (and local videos). The page (URL) can use videos from the same server only.

[Edit May 16, 2019. This memory leak of the browser widget has been removed with LC 9.0.5:WARNING. This runs with a memory leaking of up to 5 MByte per second while a video is playing. You have to quit LiveCode after a while for releasing the memory (closing the stack and removing it from memory is not enough).]

The increase in speed and the more smooth display is due to the difference between LC-Emscripten (HTML5 standalone) and the LC-IDE for drawing the backpattern of the puzzle graphics.
The speed from the hard work javaScript (your browser vs. the browser widget) is at about the same and depends on your graphic card (GPU).

Attachments

The video runs in the pieces that are (for each new chosen pieceSize)generated on the fly using linear and cubic bezier curves.

jigsaw2d-video.png (60.98 KiB) Viewed 2782 times

Last edited by [-hh] on Thu May 16, 2019 4:51 pm, edited 2 times in total.

Widget usage example #23: IndyCam2 v_102(v102 removes a display bug on windows where I could not make two cams visible at the same time. So, if you have two cameras attached then you see on MacOS the display of both and on Windows10 only the selected one.)Tested to work on MacOS 10.14 and Windows 10.

*** The stack does NOT run with LC Community ***
(Because it uses the cameraControl that is available in the Indy or Business versions of LC only.)

Uses a browser widget as "text field" extending by that LC's htmltext of fields to a larger set of text styling (e.g. justified textAlign), transforms/3D-rotations and filters (blur, sepia etc.).
Of course you can edit the transformed/rotated/filtered text _while_ it is transformed/rotated/filtered -- a funny training for your imagination ...

Dear hh,
how can I use hhTextEditBasic in my programs? I don't understand how set the text using code.
I didn't find any setprop handler, and htmltext property don't seem to affect it.

Widget usage example #15b: ImageStatistics_v165
[Updated! Version 160 had an error in the javascript for listing the (R,G,B)-triplets]

Added optional computation of the frequencies of the used (R,G,B)-triplets.
You can also put the (R,G,B)-triplets into the x^3 bins (ranges combinations) that are given by dividing the 0-255 range into x=4,8,16,32,64,128 bins for each channel.

****If you wish to have low/high ranges (0-127 and 128-255) simply add 2 to the "bins" menus.****