Fix #1191; Fix #1174 Comment out `Canvas.toBlob()`

This was removed due to instability on the part of browser vendors.
`Canvas.toBlob()` _should_ be the preferred way of exporting a canvas
as an image. Blob URIs are shorter and don't cause Chrome crashes like
the `data:` URI scheme does. They are also faster to encode images, and
don't clog up browser history.

**However**, there are currently issues in browser support which make
it hard to save images generated by blob URIs. Chrome and Firefox both
have different mechanisms of exporting blob images to disk. (In Chrome
you must right click the image, whereas in Firefox you must use the Save Page As command.)

The current solution is this:
* When a script pic is generated, create a large `data:` URI/
* Check if the browser is Chrome and if the length is a problem
* If so, convert the URI to a blob manually.
* Use the `a[download]` attribute to force the browser to save to disk.

Note that the conversion to a manual blob is _much_ slower than a
native method, but as this is an exporting operation it shouldn't cause
too much of a headache for users since it should be a fairly low
occurrence that users hit that code path.
dev
Michael Ball 2016-04-28 10:03:19 -07:00
rodzic bbb5106879
commit 4a2583fde7
1 zmienionych plików z 13 dodań i 9 usunięć

22
gui.js
Wyświetl plik

@ -3811,15 +3811,19 @@ IDE_Morph.prototype.saveFileAs = function (
IDE_Morph.prototype.saveCanvasAs = function (canvas, fileName, newWindow) {
// Export a Canvas object as a PNG image
// cavas.toBlob() is currently only supported in Firefox and IE
var myself = this;
if (canvas.toBlob) {
canvas.toBlob(function (blob) {
myself.saveFileAs(blob, 'image/png', fileName, newWindow);
});
} else {
this.saveFileAs(canvas.toDataURL(), 'image/png', fileName, newWindow);
}
// Note: This commented out due to poor browser support.
// cavas.toBlob() is currently supported in Firefox, IE, Chrome but
// browsers prevent easily saving the generated files.
// Do not re-enable without revisiting issue #1191
// if (canvas.toBlob) {
// var myself = this;
// canvas.toBlob(function (blob) {
// myself.saveFileAs(blob, 'image/png', fileName, newWindow);
// });
// return;
// }
this.saveFileAs(canvas.toDataURL(), 'image/png', fileName, newWindow);
};
IDE_Morph.prototype.saveXMLAs = function(xml, fileName, newWindow) {