Tweak demo files.

This commit is contained in:
XhmikosR
2014-02-09 17:43:54 +02:00
parent 8691eae14e
commit 702cd2e820
3 changed files with 75 additions and 77 deletions
+8 -13
View File
@@ -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 {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
ms-box-sizing: border-box;
webkit-box-sizing: border-box;
moz-box-sizing: border-box;
overflow: auto;
padding: 1em;
}
dt:target {
background-color: Highlight;
color: HighlightText;
}
+5 -2
View File
@@ -1,4 +1,4 @@
/* FileSaver.js demo script
/*! FileSaver.js demo script
* 2012-01-23
*
* By Eli Grey, http://eligrey.com
@@ -8,6 +8,9 @@
/*! @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
@@ -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(
+6 -6
View File
@@ -12,7 +12,7 @@ The following examples demonstrate how it is possible to generate and save any t
</p>
<section id="image-demo">
<h2>Saving an image</h2>
<canvas class="input" id="canvas" width="500" height="300"/>
<canvas class="input" id="canvas" width="500" height="300"></canvas>
<form id="canvas-options">
<label>Filename: <input type="text" class="filename" id="canvas-filename" placeholder="doodle"/>.png</label>
<input type="submit" value="Save"/>
@@ -21,7 +21,7 @@ The following examples demonstrate how it is possible to generate and save any t
</section>
<section id="text-demo">
<h2>Saving text</h2>
<textarea class="input" id="text" placeholder="Once upon a time..."/>
<textarea class="input" id="text" placeholder="Once upon a time..."></textarea>
<form id="text-options">
<label>Filename: <input type="text" class="filename" id="text-filename" placeholder="a plain document"/>.txt</label>
<input type="submit" value="Save"/>
@@ -49,9 +49,9 @@ The following examples demonstrate how it is possible to generate and save any t
<input type="submit" value="Save"/>
</form>
</section>
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/Blob.js/master/Blob.min.js"/>
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/canvas-toBlob.js/master/canvas-toBlob.js"/>
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/FileSaver.js/master/FileSaver.js"/>
<script type="application/ecmascript" async="" src="https://raw.github.com/eligrey/FileSaver.js/master/demo/demo.js"/>
<script src="https://raw.github.com/eligrey/Blob.js/master/Blob.min.js"></script>
<script src="https://raw.github.com/eligrey/canvas-toBlob.js/master/canvas-toBlob.js"></script>
<script src="https://raw.github.com/eligrey/FileSaver.js/master/FileSaver.js"></script>
<script src="https://raw.github.com/eligrey/FileSaver.js/master/demo/demo.js"></script>
</body>
</html>