From 054378f8226847bba7b432b603f29a0973864afc Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 9 Feb 2014 13:13:00 +0200 Subject: [PATCH 1/4] Normalize package.json. Fix version info, add missing properties. --- package.json | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 3ddf184..d41f592 100644 --- a/package.json +++ b/package.json @@ -1,23 +1,21 @@ { "name": "filesaver.js", - "version": "2013.1.23", + "version": "2013.1.24", "description": "A saveAs() FileSaver implementation", + "author": "Eli Grey", + "license": "MIT/X11", "main": "FileSaver.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, "repository": { "type": "git", "url": "https://github.com/eligrey/FileSaver.js.git" }, + "bugs": { + "url": "https://github.com/eligrey/FileSaver.js/issues" + }, + "homepage": "https://github.com/eligrey/FileSaver.js", "keywords": [ "filesaver", "saveas", "blob" - ], - "author": "Eli Grey", - "license": "MIT/X11", - "bugs": { - "url": "https://github.com/eligrey/FileSaver.js/issues" - } + ] } From 554f6cc11bb2a9328fd32aa32961a2ff14147e14 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 9 Feb 2014 13:34:09 +0200 Subject: [PATCH 2/4] Update FileSaver.js. * update JSHint config options to match the current coding style * use the important comment for the license header --- FileSaver.js | 35 +++++++++++++++++------------------ 1 file changed, 17 insertions(+), 18 deletions(-) diff --git a/FileSaver.js b/FileSaver.js index 8a61f98..5f54671 100644 --- a/FileSaver.js +++ b/FileSaver.js @@ -1,15 +1,14 @@ -/* FileSaver.js - * A saveAs() FileSaver implementation. - * 2014-01-24 +/*! FileSaver.js + * A saveAs() FileSaver implementation. + * 2014-01-24 * - * By Eli Grey, http://eligrey.com - * License: X11/MIT - * See LICENSE.md + * By Eli Grey, http://eligrey.com + * License: X11/MIT + * See LICENSE.md */ /*global self */ -/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true, - plusplus: true */ +/*jslint bitwise: true, indent: 4, laxbreak: true, laxcomma: true, smarttabs: true, plusplus: true */ /*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */ @@ -31,7 +30,7 @@ var saveAs = saveAs } , URL = view.URL || view.webkitURL || view , save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a") - , can_use_save_link = !view.externalHost && "download" in save_link + , can_use_save_link = !view.externalHost && "download" in save_link , click = function(node) { var event = doc.createEvent("MouseEvents"); event.initMouseEvent( @@ -42,7 +41,7 @@ var saveAs = saveAs } , webkit_req_fs = view.webkitRequestFileSystem , req_fs = view.requestFileSystem || webkit_req_fs || view.mozRequestFileSystem - , throw_outside = function (ex) { + , throw_outside = function(ex) { (view.setImmediate || view.setTimeout)(function() { throw ex; }, 0); @@ -101,8 +100,8 @@ var saveAs = saveAs if (target_view) { target_view.location.href = object_url; } else { - window.open(object_url, "_blank"); - } + window.open(object_url, "_blank"); + } filesaver.readyState = filesaver.DONE; dispatch_all(); } @@ -220,12 +219,12 @@ var saveAs = saveAs FS_proto.DONE = 2; FS_proto.error = - FS_proto.onwritestart = - FS_proto.onprogress = - FS_proto.onwrite = - FS_proto.onabort = - FS_proto.onerror = - FS_proto.onwriteend = + FS_proto.onwritestart = + FS_proto.onprogress = + FS_proto.onwrite = + FS_proto.onabort = + FS_proto.onerror = + FS_proto.onwriteend = null; view.addEventListener("unload", process_deletion_queue, false); From 8691eae14e41844e33f0f2b27eb18742650a7c0b Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 9 Feb 2014 13:39:09 +0200 Subject: [PATCH 3/4] Improve README.md. Use code syntax when possible and be consistent with the headers syntax. --- README.md | 41 +++++++++++++++++++++++------------------ 1 file changed, 23 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index e804577..368cfbc 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,4 @@ -FileSaver.js -============ +# FileSaver.js FileSaver.js implements the HTML5 W3C `saveAs()` [FileSaver][1] interface in browsers that do not natively support it. There is a [FileSaver.js demo][2] that demonstrates saving @@ -12,8 +11,7 @@ sent to an external server. Looking for `canvas.toBlob()` for saving canvases? Check out [canvas-toBlob.js](https://github.com/eligrey/canvas-toBlob.js) for a cross-browser implementation. -Supported Browsers ------------------- +## Supported Browsers | Browser | Constructs as | Filenames | Max Blob Size | Dependencies | | -------------- | ------------- | ------------ | ------------- | ------------ | @@ -29,8 +27,11 @@ Supported Browsers Feature detection is possible: - try { var isFileSaverSupported = !!new Blob(); } catch(e){} - +```js +try { + var isFileSaverSupported = !!new Blob(); +} catch (e) {} +``` ### IE < 10 @@ -44,29 +45,33 @@ Blobs may be opened instead of saved sometimes—you may have to direct your Saf press ⌘+S to save the file after it is opened. Further information is available [on the issue tracker](https://github.com/eligrey/FileSaver.js/issues/12). -Syntax ------- +## Syntax - FileSaver saveAs(in Blob data, in DOMString filename) +```js +FileSaver saveAs(in Blob data, in DOMString filename) +``` -Examples --------- +## Examples ### Saving text - var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"}); - saveAs(blob, "hello world.txt"); +```js +var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"}); +saveAs(blob, "hello world.txt"); +``` The standard W3C File API [`Blob`][3] interface is not available in all browsers. [Blob.js][4] is a cross-browser `Blob` implementation that solves this. ### Saving a canvas - var canvas = document.getElementById("my-canvas"), ctx = canvas.getContext("2d"); - // draw to canvas... - canvas.toBlob(function(blob) { - saveAs(blob, "pretty image.png"); - }); +```js +var canvas = document.getElementById("my-canvas"), ctx = canvas.getContext("2d"); +// draw to canvas... +canvas.toBlob(function(blob) { + saveAs(blob, "pretty image.png"); +}); +``` Note: The standard HTML5 `canvas.toBlob()` method is not available in all browsers. [canvas-toBlob.js][5] is a cross-browser `canvas.toBlob()` that polyfills this. From 702cd2e820b680f88a0f299e33085c196806fc52 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sun, 9 Feb 2014 17:43:00 +0200 Subject: [PATCH 4/4] Tweak demo files. --- demo/demo.css | 23 +++++------ demo/demo.js | 29 ++++++++------ demo/index.xhtml | 100 +++++++++++++++++++++++------------------------ 3 files changed, 75 insertions(+), 77 deletions(-) diff --git a/demo/demo.css b/demo/demo.css index fe03ca5..de4a78d 100644 --- a/demo/demo.css +++ b/demo/demo.css @@ -2,10 +2,14 @@ html { background-color: #DDD; } body { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; width: 900px; margin: 0 auto; font-family: Verdana, Helvetica, Arial, sans-serif; - box-shadow: 0 0 5px #000; + -webkit-box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5); + -moz-box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5); box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5); padding: 7px 25px 70px; background-color: #FFF; @@ -28,28 +32,19 @@ form { section { margin-top: 40px; } -dt { - font-weight: bold; - font-size: larger; -} #canvas { cursor: crosshair; } #canvas, #html { - border: 1px solid black; + border: 1px solid #000; } .filename { text-align: right; } #html { - box-sizing: border-box; - ms-box-sizing: border-box; - webkit-box-sizing: border-box; - moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; overflow: auto; padding: 1em; } -dt:target { - background-color: Highlight; - color: HighlightText; -} diff --git a/demo/demo.js b/demo/demo.js index e08497b..009ab93 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -1,13 +1,16 @@ -/* FileSaver.js demo script - * 2012-01-23 - * - * By Eli Grey, http://eligrey.com - * License: X11/MIT - * See LICENSE.md +/*! FileSaver.js demo script + * 2012-01-23 + * + * By Eli Grey, http://eligrey.com + * License: X11/MIT + * See LICENSE.md */ /*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/demo/demo.js */ +/*jshint laxbreak: true, laxcomma: true, smarttabs: true*/ +/*global saveAs, self*/ + (function(view) { "use strict"; // The canvas drawing portion of the demo is based off the demo at @@ -27,15 +30,15 @@ var , canvas_options_form = $("canvas-options") , canvas_filename = $("canvas-filename") , canvas_clear_button = $("canvas-clear") - + , text = $("text") , text_options_form = $("text-options") , text_filename = $("text-filename") - + , html = $("html") , html_options_form = $("html-options") , html_filename = $("html-filename") - + , ctx = canvas.getContext("2d") , drawing = false , x_points = session.x_points || [] @@ -70,7 +73,7 @@ var , stop_drawing = function() { drawing = false; } - + // Title guesser and document creator available at https://gist.github.com/1059648 , guess_title = function(doc) { var @@ -186,7 +189,7 @@ html_options_form.addEventListener("submit", function(event) { event.preventDefault(); var BB = get_blob() - , xml_serializer = new XMLSerializer + , xml_serializer = new XMLSerializer() , doc = create_html_doc(html) ; saveAs( @@ -203,10 +206,10 @@ view.addEventListener("unload", function() { session.y_points = JSON.stringify(y_points); session.drag_points = JSON.stringify(drag_points); session.canvas_filename = canvas_filename.value; - + session.text = text.value; session.text_filename = text_filename.value; - + session.html = html.innerHTML; session.html_filename = html_filename.value; }, false); diff --git a/demo/index.xhtml b/demo/index.xhtml index abc8813..d6d8d0e 100644 --- a/demo/index.xhtml +++ b/demo/index.xhtml @@ -1,57 +1,57 @@  - -FileSaver.js demo - + + FileSaver.js demo + -

FileSaver.js demo

-

-The following examples demonstrate how it is possible to generate and save any type of data right in the browser using the W3C saveAs() FileSaver interface, without contacting any servers. -

-
-

Saving an image

- -
- - - -
-
-
-

Saving text

- +
+ + +
+
+
+

Saving rich text

+
+

Some example rich text

+
    +
  • Plain Boring text.
    • +
  • Emphasized text!
    • +
  • Strong text!
    • +
  • + + + image + +
    • +
  • A link.
    • +
+
+
+ + +
+
+ + + +