Skip to content

Commit 2344e2a

Browse files
committed
Merge pull request eligrey#68 from XhmikosR/master
Minor tweaks
2 parents f12e28d + 702cd2e commit 2344e2a

File tree

6 files changed

+123
-123
lines changed

6 files changed

+123
-123
lines changed

FileSaver.js

Lines changed: 17 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
1-
/* FileSaver.js
2-
* A saveAs() FileSaver implementation.
3-
* 2014-01-24
1+
/*! FileSaver.js
2+
* A saveAs() FileSaver implementation.
3+
* 2014-01-24
44
*
5-
* By Eli Grey, http://eligrey.com
6-
* License: X11/MIT
7-
* See LICENSE.md
5+
* By Eli Grey, http://eligrey.com
6+
* License: X11/MIT
7+
* See LICENSE.md
88
*/
99

1010
/*global self */
11-
/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true,
12-
plusplus: true */
11+
/*jslint bitwise: true, indent: 4, laxbreak: true, laxcomma: true, smarttabs: true, plusplus: true */
1312

1413
/*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */
1514

@@ -31,7 +30,7 @@ var saveAs = saveAs
3130
}
3231
, URL = view.URL || view.webkitURL || view
3332
, save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a")
34-
, can_use_save_link = !view.externalHost && "download" in save_link
33+
, can_use_save_link = !view.externalHost && "download" in save_link
3534
, click = function(node) {
3635
var event = doc.createEvent("MouseEvents");
3736
event.initMouseEvent(
@@ -42,7 +41,7 @@ var saveAs = saveAs
4241
}
4342
, webkit_req_fs = view.webkitRequestFileSystem
4443
, req_fs = view.requestFileSystem || webkit_req_fs || view.mozRequestFileSystem
45-
, throw_outside = function (ex) {
44+
, throw_outside = function(ex) {
4645
(view.setImmediate || view.setTimeout)(function() {
4746
throw ex;
4847
}, 0);
@@ -101,8 +100,8 @@ var saveAs = saveAs
101100
if (target_view) {
102101
target_view.location.href = object_url;
103102
} else {
104-
window.open(object_url, "_blank");
105-
}
103+
window.open(object_url, "_blank");
104+
}
106105
filesaver.readyState = filesaver.DONE;
107106
dispatch_all();
108107
}
@@ -220,12 +219,12 @@ var saveAs = saveAs
220219
FS_proto.DONE = 2;
221220

222221
FS_proto.error =
223-
FS_proto.onwritestart =
224-
FS_proto.onprogress =
225-
FS_proto.onwrite =
226-
FS_proto.onabort =
227-
FS_proto.onerror =
228-
FS_proto.onwriteend =
222+
FS_proto.onwritestart =
223+
FS_proto.onprogress =
224+
FS_proto.onwrite =
225+
FS_proto.onabort =
226+
FS_proto.onerror =
227+
FS_proto.onwriteend =
229228
null;
230229

231230
view.addEventListener("unload", process_deletion_queue, false);

README.md

Lines changed: 23 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
FileSaver.js
2-
============
1+
# FileSaver.js
32

43
FileSaver.js implements the HTML5 W3C `saveAs()` [FileSaver][1] interface in browsers that do
54
not natively support it. There is a [FileSaver.js demo][2] that demonstrates saving
@@ -12,8 +11,7 @@ sent to an external server.
1211
Looking for `canvas.toBlob()` for saving canvases? Check out
1312
[canvas-toBlob.js](https://github.com/eligrey/canvas-toBlob.js) for a cross-browser implementation.
1413

15-
Supported Browsers
16-
------------------
14+
## Supported Browsers
1715

1816
| Browser | Constructs as | Filenames | Max Blob Size | Dependencies |
1917
| -------------- | ------------- | ------------ | ------------- | ------------ |
@@ -29,8 +27,11 @@ Supported Browsers
2927

3028
Feature detection is possible:
3129

32-
try { var isFileSaverSupported = !!new Blob(); } catch(e){}
33-
30+
```js
31+
try {
32+
var isFileSaverSupported = !!new Blob();
33+
} catch (e) {}
34+
```
3435

3536
### IE < 10
3637

@@ -44,29 +45,33 @@ Blobs may be opened instead of saved sometimes—you may have to direct your Saf
4445
press <kbd>⌘</kbd>+<kbd>S</kbd> to save the file after it is opened. Further information is available
4546
[on the issue tracker](https://github.com/eligrey/FileSaver.js/issues/12).
4647

47-
Syntax
48-
------
48+
## Syntax
4949

50-
FileSaver saveAs(in Blob data, in DOMString filename)
50+
```js
51+
FileSaver saveAs(in Blob data, in DOMString filename)
52+
```
5153

52-
Examples
53-
--------
54+
## Examples
5455

5556
### Saving text
5657

57-
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
58-
saveAs(blob, "hello world.txt");
58+
```js
59+
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
60+
saveAs(blob, "hello world.txt");
61+
```
5962

6063
The standard W3C File API [`Blob`][3] interface is not available in all browsers.
6164
[Blob.js][4] is a cross-browser `Blob` implementation that solves this.
6265

6366
### Saving a canvas
6467

65-
var canvas = document.getElementById("my-canvas"), ctx = canvas.getContext("2d");
66-
// draw to canvas...
67-
canvas.toBlob(function(blob) {
68-
saveAs(blob, "pretty image.png");
69-
});
68+
```js
69+
var canvas = document.getElementById("my-canvas"), ctx = canvas.getContext("2d");
70+
// draw to canvas...
71+
canvas.toBlob(function(blob) {
72+
saveAs(blob, "pretty image.png");
73+
});
74+
```
7075

7176
Note: The standard HTML5 `canvas.toBlob()` method is not available in all browsers.
7277
[canvas-toBlob.js][5] is a cross-browser `canvas.toBlob()` that polyfills this.

demo/demo.css

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,14 @@ html {
22
background-color: #DDD;
33
}
44
body {
5+
-webkit-box-sizing: content-box;
6+
-moz-box-sizing: content-box;
7+
box-sizing: content-box;
58
width: 900px;
69
margin: 0 auto;
710
font-family: Verdana, Helvetica, Arial, sans-serif;
8-
box-shadow: 0 0 5px #000;
11+
-webkit-box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5);
12+
-moz-box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5);
913
box-shadow: 0 0 10px 2px rgba(0, 0, 0, .5);
1014
padding: 7px 25px 70px;
1115
background-color: #FFF;
@@ -28,28 +32,19 @@ form {
2832
section {
2933
margin-top: 40px;
3034
}
31-
dt {
32-
font-weight: bold;
33-
font-size: larger;
34-
}
3535
#canvas {
3636
cursor: crosshair;
3737
}
3838
#canvas, #html {
39-
border: 1px solid black;
39+
border: 1px solid #000;
4040
}
4141
.filename {
4242
text-align: right;
4343
}
4444
#html {
45-
box-sizing: border-box;
46-
ms-box-sizing: border-box;
47-
webkit-box-sizing: border-box;
48-
moz-box-sizing: border-box;
45+
-webkit-box-sizing: border-box;
46+
-moz-box-sizing: border-box;
47+
box-sizing: border-box;
4948
overflow: auto;
5049
padding: 1em;
5150
}
52-
dt:target {
53-
background-color: Highlight;
54-
color: HighlightText;
55-
}

demo/demo.js

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
1-
/* FileSaver.js demo script
2-
* 2012-01-23
3-
*
4-
* By Eli Grey, http://eligrey.com
5-
* License: X11/MIT
6-
* See LICENSE.md
1+
/*! FileSaver.js demo script
2+
* 2012-01-23
3+
*
4+
* By Eli Grey, http://eligrey.com
5+
* License: X11/MIT
6+
* See LICENSE.md
77
*/
88

99
/*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/demo/demo.js */
1010

11+
/*jshint laxbreak: true, laxcomma: true, smarttabs: true*/
12+
/*global saveAs, self*/
13+
1114
(function(view) {
1215
"use strict";
1316
// The canvas drawing portion of the demo is based off the demo at
@@ -27,15 +30,15 @@ var
2730
, canvas_options_form = $("canvas-options")
2831
, canvas_filename = $("canvas-filename")
2932
, canvas_clear_button = $("canvas-clear")
30-
33+
3134
, text = $("text")
3235
, text_options_form = $("text-options")
3336
, text_filename = $("text-filename")
34-
37+
3538
, html = $("html")
3639
, html_options_form = $("html-options")
3740
, html_filename = $("html-filename")
38-
41+
3942
, ctx = canvas.getContext("2d")
4043
, drawing = false
4144
, x_points = session.x_points || []
@@ -70,7 +73,7 @@ var
7073
, stop_drawing = function() {
7174
drawing = false;
7275
}
73-
76+
7477
// Title guesser and document creator available at https://gist.github.com/1059648
7578
, guess_title = function(doc) {
7679
var
@@ -186,7 +189,7 @@ html_options_form.addEventListener("submit", function(event) {
186189
event.preventDefault();
187190
var
188191
BB = get_blob()
189-
, xml_serializer = new XMLSerializer
192+
, xml_serializer = new XMLSerializer()
190193
, doc = create_html_doc(html)
191194
;
192195
saveAs(
@@ -203,10 +206,10 @@ view.addEventListener("unload", function() {
203206
session.y_points = JSON.stringify(y_points);
204207
session.drag_points = JSON.stringify(drag_points);
205208
session.canvas_filename = canvas_filename.value;
206-
209+
207210
session.text = text.value;
208211
session.text_filename = text_filename.value;
209-
212+
210213
session.html = html.innerHTML;
211214
session.html_filename = html_filename.value;
212215
}, false);

demo/index.xhtml

Lines changed: 50 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,57 @@
11
<!DOCTYPE html>
22
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US-x-Hixie">
33
<head>
4-
<meta charset="utf-8"/>
5-
<title>FileSaver.js demo</title>
6-
<link rel="stylesheet" type="text/css" href="demo.css"/>
4+
<meta charset="utf-8"/>
5+
<title>FileSaver.js demo</title>
6+
<link rel="stylesheet" type="text/css" href="demo.css"/>
77
</head>
88
<body>
9-
<h1><a href="https://github.com/eligrey/FileSaver.js">FileSaver.js</a> demo</h1>
10-
<p>
11-
The following examples demonstrate how it is possible to generate and save any type of data right in the browser using the W3C <code>saveAs()</code> <a href="http://www.w3.org/TR/file-writer-api/#the-filesaver-interface">FileSaver</a> interface, without contacting any servers.
12-
</p>
13-
<section id="image-demo">
14-
<h2>Saving an image</h2>
15-
<canvas class="input" id="canvas" width="500" height="300"/>
16-
<form id="canvas-options">
17-
<label>Filename: <input type="text" class="filename" id="canvas-filename" placeholder="doodle"/>.png</label>
18-
<input type="submit" value="Save"/>
19-
<input type="button" id="canvas-clear" value="Clear"/>
20-
</form>
21-
</section>
22-
<section id="text-demo">
23-
<h2>Saving text</h2>
24-
<textarea class="input" id="text" placeholder="Once upon a time..."/>
25-
<form id="text-options">
26-
<label>Filename: <input type="text" class="filename" id="text-filename" placeholder="a plain document"/>.txt</label>
27-
<input type="submit" value="Save"/>
28-
</form>
29-
</section>
30-
<section id="html-demo">
31-
<h2>Saving rich text</h2>
32-
<div class="input" id="html" contenteditable="">
33-
<h3>Some example rich text</h3>
34-
<ul>
35-
<li><del>Plain</del> <ins>Boring</ins> text.</li>
36-
<li><em>Emphasized text!</em></li>
37-
<li><strong>Strong text!</strong></li>
38-
<li>
39-
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="70" height="70">
40-
<circle cx="35" cy="35" r="35" fill="red"/>
41-
<text x="10" y="40">image</text>
42-
</svg>
43-
</li>
44-
<li><a href="https://github.com/eligrey/FileSaver.js">A link.</a></li>
45-
</ul>
46-
</div>
47-
<form id="html-options">
48-
<label>Filename: <input type="text" class="filename" id="html-filename" placeholder="a rich document"/>.xhtml</label>
49-
<input type="submit" value="Save"/>
50-
</form>
51-
</section>
52-
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/Blob.js/master/Blob.min.js"/>
53-
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/canvas-toBlob.js/master/canvas-toBlob.js"/>
54-
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/FileSaver.js/master/FileSaver.js"/>
55-
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/FileSaver.js/master/demo/demo.js"/>
9+
<h1><a href="https://github.com/eligrey/FileSaver.js">FileSaver.js</a> demo</h1>
10+
<p>
11+
The following examples demonstrate how it is possible to generate and save any type of data right in the browser using the W3C <code>saveAs()</code> <a href="http://www.w3.org/TR/file-writer-api/#the-filesaver-interface">FileSaver</a> interface, without contacting any servers.
12+
</p>
13+
<section id="image-demo">
14+
<h2>Saving an image</h2>
15+
<canvas class="input" id="canvas" width="500" height="300"></canvas>
16+
<form id="canvas-options">
17+
<label>Filename: <input type="text" class="filename" id="canvas-filename" placeholder="doodle"/>.png</label>
18+
<input type="submit" value="Save"/>
19+
<input type="button" id="canvas-clear" value="Clear"/>
20+
</form>
21+
</section>
22+
<section id="text-demo">
23+
<h2>Saving text</h2>
24+
<textarea class="input" id="text" placeholder="Once upon a time..."></textarea>
25+
<form id="text-options">
26+
<label>Filename: <input type="text" class="filename" id="text-filename" placeholder="a plain document"/>.txt</label>
27+
<input type="submit" value="Save"/>
28+
</form>
29+
</section>
30+
<section id="html-demo">
31+
<h2>Saving rich text</h2>
32+
<div class="input" id="html" contenteditable="">
33+
<h3>Some example rich text</h3>
34+
<ul>
35+
<li><del>Plain</del> <ins>Boring</ins> text.</li>
36+
<li><em>Emphasized text!</em></li>
37+
<li><strong>Strong text!</strong></li>
38+
<li>
39+
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="70" height="70">
40+
<circle cx="35" cy="35" r="35" fill="red"/>
41+
<text x="10" y="40">image</text>
42+
</svg>
43+
</li>
44+
<li><a href="https://github.com/eligrey/FileSaver.js">A link.</a></li>
45+
</ul>
46+
</div>
47+
<form id="html-options">
48+
<label>Filename: <input type="text" class="filename" id="html-filename" placeholder="a rich document"/>.xhtml</label>
49+
<input type="submit" value="Save"/>
50+
</form>
51+
</section>
52+
<script src="https://raw.github.com/eligrey/Blob.js/master/Blob.min.js"></script>
53+
<script src="https://raw.github.com/eligrey/canvas-toBlob.js/master/canvas-toBlob.js"></script>
54+
<script src="https://raw.github.com/eligrey/FileSaver.js/master/FileSaver.js"></script>
55+
<script src="https://raw.github.com/eligrey/FileSaver.js/master/demo/demo.js"></script>
5656
</body>
5757
</html>

0 commit comments

Comments
 (0)