do nothing; unsupported
+ }
+
buttons.$sprite.attr("href", sprite).removeClass("disabled");
buttons.$stylesheet.attr("href", stylesheet).removeClass("disabled");
});
},
-
+
_noop: function (e) {
e.preventDefault();
e.stopPropagation();
},
-
Bind all of the event listeners for drag and drop
bindDragAndDrop: function () {
@@ -139,7 +151,7 @@
dropbox.addEventListener("drop", S.Page._drop, false);
},
-
+
_dragStart: function (e) {
S.Page.$dropbox.addClass("dropping");
},
@@ -162,7 +174,7 @@
}
},
-
Bind all of the event listeners for buttons
bindButtons: function () {
@@ -173,7 +185,7 @@
$elem.delegate("a.clear", "click", S.Page._removeAllFiles);
},
-
Bind all of the event listeners for the cabinet
bindCabinet: function () {
@@ -184,14 +196,14 @@
var $cabinet = $("form.cabinet", $drawer);
var $input = $("input.files", $drawer);
-
show file input on hover
+
show file input on hover
$stitches.hover(function () {
$drawer.stop().animate({left: "-5px"}, 250);
}, function () {
$drawer.stop().animate({left: "-125px"}, 250);
});
-
on change event, use the drop event to handle files
+
on change event, use the drop event to handle files
$input.bind("change", function () {
if (this.files.length) {
S.pub("page.drop.done", this.files);
@@ -199,13 +211,13 @@
$cabinet.trigger("reset");
});
-
open options
+
open options
$drawer.delegate("a.open-options", "click", function () {
$options.fadeIn();
});
},
-
Bind all of the event listeners for the options panel
bindOptions: function () {
@@ -237,7 +249,7 @@
});
},
-
+
_generate: function (e) {
/* [].concat to copy array */
S.pub("sprite.generate", [].concat(S.iconQueue));
@@ -252,7 +264,7 @@
S.pub("file.unqueue.all");
},
-
Add an icon to the file list @param {Icon} icon
@@ -263,7 +275,7 @@
.fadeIn("fast");
},
-
Remove an icon from the file list @param {Icon} icon
@@ -276,7 +288,7 @@
.remove();
},
-
Update icon dimensions after changing padding setting
updateIconDimensions: function () {
diff --git a/docs/stitches.html b/docs/stitches.html
index 5df91f13..da0492fa 100644
--- a/docs/stitches.html
+++ b/docs/stitches.html
@@ -203,7 +203,7 @@
});
/* create image link */
- data = S.canvas.toDataURL();
+ data = S.canvas.toDataURL("image/png");
} catch (e) {
S.pub("page.error", e);
}
@@ -253,11 +253,81 @@
});
/* create stylesheet link */
- var data = "data:," + encodeURIComponent(css.join("\n"));
+ var data = "data:text/plain," + encodeURIComponent(css.join("\n"));
/* notify and return */
S.pub("sprite.stylesheet.done", data);
return data;
+ },
+
+
Convert base64 data or raw binary data to an object URL +See: http://stackoverflow.com/a/5100158/230483
+ +@param {String} dataURI
+@return {String} The object URL
+
+ dataToObjectURL: function (dataURI) {
+ var dataParts = dataURI.split(',');
+ var byteString;
+
+
convert base64 to raw binary data held in a string
+ if (dataParts[0].indexOf('base64') >= 0) {
+ byteString = atob(dataParts[1]);
+ } else {
+ byteString = unescape(dataParts[1]);
+ }
+
+
separate out the mime component
+ var mimeString = dataParts[0].split(':')[1].split(';')[0];
+
+
write the bytes of the string to an ArrayBuffer
+ var bl = byteString.length;
+ var ab = new ArrayBuffer(bl);
+ var ia = new Uint8Array(ab);
+ var i;
+ for (i = 0; i < bl; i++) {
+ ia[i] = byteString.charCodeAt(i);
+ }
+
+
get the blob and create an object URL
+ var blob = S.createBlob(ab, mimeString);
+ var url = S.createObjectURL(blob);
+
+ return url;
+ },
+
+
Polyfill
+ createBlob: function (arrayBuffer, mimeString) {
+ var BlobBuilder = BlobBuilder || WebKitBlobBuilder;
+
+ if (!BlobBuilder) {
+ throw new Error("BlobBuilder is unsupported.")
+ }
+
+ var bb = new BlobBuilder();
+ bb.append(arrayBuffer);
+
+ return bb.getBlob(mimeString);
+ },
+
+
Polyfill
+ createObjectURL: function (file) {
+ if (window.URL && window.URL.createObjectURL) {
+ return window.URL.createObjectURL(file);
+ }
+
+ if (window.webkitURL && window.webkitURL.createObjectURL) {
+ return window.webkitURL.createObjectURL(file);
+ }
+
+ /* if we reached here, it's unsupported */
+ throw new Error("createObjectURL is unsupported.")
}
};
})();
diff --git a/src/page.js b/src/page.js
index 0c01ba37..5354038c 100644
--- a/src/page.js
+++ b/src/page.js
@@ -117,6 +117,18 @@
/* handle sprite and stylesheet generation */
S.sub("sprite.generate.done", function (sprite, stylesheet) {
+ var spriteURL;
+ var stylesheetURL;
+
+ try {
+ spriteURL = S.dataToObjectURL(sprite);
+ stylesheetURL = S.dataToObjectURL(stylesheet);
+ sprite = spriteURL;
+ stylesheet = stylesheetURL;
+ } catch (e) {
+ // do nothing; unsupported
+ }
+
buttons.$sprite.attr("href", sprite).removeClass("disabled");
buttons.$stylesheet.attr("href", stylesheet).removeClass("disabled");
});
diff --git a/src/stitches.js b/src/stitches.js
index 0d84a269..8650f4ec 100644
--- a/src/stitches.js
+++ b/src/stitches.js
@@ -198,7 +198,7 @@
});
/* create image link */
- data = S.canvas.toDataURL();
+ data = S.canvas.toDataURL("image/png");
} catch (e) {
S.pub("page.error", e);
}
@@ -247,11 +247,80 @@
});
/* create stylesheet link */
- var data = "data:," + encodeURIComponent(css.join("\n"));
+ var data = "data:text/plain," + encodeURIComponent(css.join("\n"));
/* notify and return */
S.pub("sprite.stylesheet.done", data);
return data;
+ },
+
+ // ### dataToObjectURL
+ //
+ // Convert base64 data or raw binary data to an object URL
+ // See: http://stackoverflow.com/a/5100158/230483
+ //
+ // @param {String} dataURI
+ // @return {String} The object URL
+ dataToObjectURL: function (dataURI) {
+ var dataParts = dataURI.split(',');
+ var byteString;
+
+ // convert base64 to raw binary data held in a string
+ if (dataParts[0].indexOf('base64') >= 0) {
+ byteString = atob(dataParts[1]);
+ } else {
+ byteString = unescape(dataParts[1]);
+ }
+
+ // separate out the mime component
+ var mimeString = dataParts[0].split(':')[1].split(';')[0];
+
+ // write the bytes of the string to an ArrayBuffer
+ var bl = byteString.length;
+ var ab = new ArrayBuffer(bl);
+ var ia = new Uint8Array(ab);
+ var i;
+ for (i = 0; i < bl; i++) {
+ ia[i] = byteString.charCodeAt(i);
+ }
+
+ // get the blob and create an object URL
+ var blob = S.createBlob(ab, mimeString);
+ var url = S.createObjectURL(blob);
+
+ return url;
+ },
+
+ // ### createBlob
+ //
+ // Polyfill
+ createBlob: function (arrayBuffer, mimeString) {
+ var BlobBuilder = BlobBuilder || WebKitBlobBuilder;
+
+ if (!BlobBuilder) {
+ throw new Error("BlobBuilder is unsupported.")
+ }
+
+ var bb = new BlobBuilder();
+ bb.append(arrayBuffer);
+
+ return bb.getBlob(mimeString);
+ },
+
+ // ### createObjectURL
+ //
+ // Polyfill
+ createObjectURL: function (file) {
+ if (window.URL && window.URL.createObjectURL) {
+ return window.URL.createObjectURL(file);
+ }
+
+ if (window.webkitURL && window.webkitURL.createObjectURL) {
+ return window.webkitURL.createObjectURL(file);
+ }
+
+ /* if we reached here, it's unsupported */
+ throw new Error("createObjectURL is unsupported.")
}
};
})();