Hi, I’ve got ( probably ) a noob question about html5 and images,
I’m working on this web app ( https://mixit.updog.co ) where you can mix images together.
The app should allow the user to record and download resulting compositions, or at least allow right-clicking in the browser page to download / share / copy etc. - since we’re in a browser that shouldn’t be a problem, was I thinking!
Alas, my openFL html5 output doesn’t seem to permit it.
I’ve even tried the basic example DisplayingABitmap, same result.
I already used FileSaver.js with
That’s gonna be helpful, thanks!
We should probably add support here
Hi @loudo, how did you manage to make FileSaver.js work with your code?
I can’t seem to have FileDialog working in my browser ( Safari 10 )
FileDialog doesn’t work for html5. If anybody works on the feature, the feature should be added there.
I think you have to save from one canvas (using
canvas.toBlob()). If your png isn’t made with your main canvas, you’ll probably need to render your image inside a canvas and then get the blob (I think it’s possible). Or maybe you can create directly a Blob like this.
You can also try to open an url with your png base64-encoded in it (but I think it will not work on IE).
I’ve managed to link FileSaver.js and canvas-toBlob.js in my project, now the problem is don’t know how to access a proper HTMLCanvasElement when i call for instance document.getElementById(‘openfl-content’), it returns an object of type HTMLDivElement ( naturally )
I will look into creating a Blob directly as you mentioned, but it would be simpler to reference a canvas from within my document
Nevermind me, i managed to scan through the nodes within my document, find the canvas i’m interested in, and .toBlob it properly.
Thanks for your help!
FileSaver doesn’t work well on some Safari browsers. It opens blob in new window and renames it to “unknown” without any file format. I had to use php instead and it works great so far.
I have the same issue. It’s not very elegant but the user can still change the name in the file dialog