Hi!
Thanks to the Ludum Dare offer, I am moving my classic jigsaw app (see [1]) to Construct 3. To do so, I'm replacing R0j0H0und's Canvas plugin with the DrawingCanvas plugin included with C3.
And now, the headache.
Remember how my puzzle works. In order to allow the user to change the puzzle image, a grid of overlapping canvases is created below the image. Then the image is pasted on the canvas, and cut using a sprite (this is hardcoded) which makes the "jigsaw" pattern.
Since all DrawingCanvas operations are made in system ticks, I had to rework nested "For..." loops into a loop ruled by "compare variable" conditions that executes one tick at a time. But I'm ending with a Canvas object that has no collision mask.
I need some sort of collision mask to make "drag and drop" work as expected. It is, when you drag over a transparent section of the DrawingCanvas, the piece is not dragged.
I could try to rework it again and use DrawingCanvas.Save events to save the canvas and load it with Sprite.loadFromUrl. But, as DrawingCanvas.Save is an async process and there is no flag to get what image is being saved (as opposite to other async processes such as sound events or ajax events), I don't know how to get further.
[EDIT]
I just managed to load image into a sprite by making all loop variables global and using instance variables in the canvas. The sprite has a fine drag-and-drop mask, but the same image is loaded into all instances of same sprite. :-(
You can see the (partially working) project here:
drive.google.com/file/d/1apJ6KPtmmjR2OkcFWmoFluSRq08u874W/view
[1] construct.net/en/tutorials/making-jigsaw-puzzle-part-two-429