diff -r 4732f078d0fe -r adb907bba956 server/php/basic/public_html/static/lib/FileSaver/demo/demo.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/server/php/basic/public_html/static/lib/FileSaver/demo/demo.js Fri May 22 17:48:14 2015 +0200 @@ -0,0 +1,216 @@ +/*! 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 +// http://www.williammalone.com/articles/create-html5-canvas-javascript-drawing-app/ +var + document = view.document + , $ = function(id) { + return document.getElementById(id); + } + , session = view.sessionStorage + // only get URL when necessary in case Blob.js hasn't defined it yet + , get_blob = function() { + return view.Blob; + } + + , canvas = $("canvas") + , 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 || [] + , y_points = session.y_points || [] + , drag_points = session.drag_points || [] + , add_point = function(x, y, dragging) { + x_points.push(x); + y_points.push(y); + drag_points.push(dragging); + } + , draw = function(){ + canvas.width = canvas.width; + ctx.lineWidth = 6; + ctx.lineJoin = "round"; + ctx.strokeStyle = "#000000"; + var + i = 0 + , len = x_points.length + ; + for(; i < len; i++) { + ctx.beginPath(); + if (i && drag_points[i]) { + ctx.moveTo(x_points[i-1], y_points[i-1]); + } else { + ctx.moveTo(x_points[i]-1, y_points[i]); + } + ctx.lineTo(x_points[i], y_points[i]); + ctx.closePath(); + ctx.stroke(); + } + } + , stop_drawing = function() { + drawing = false; + } + + // Title guesser and document creator available at https://gist.github.com/1059648 + , guess_title = function(doc) { + var + h = "h6 h5 h4 h3 h2 h1".split(" ") + , i = h.length + , headers + , header_text + ; + while (i--) { + headers = doc.getElementsByTagName(h[i]); + for (var j = 0, len = headers.length; j < len; j++) { + header_text = headers[j].textContent.trim(); + if (header_text) { + return header_text; + } + } + } + } + , doc_impl = document.implementation + , create_html_doc = function(html) { + var + dt = doc_impl.createDocumentType('html', null, null) + , doc = doc_impl.createDocument("http://www.w3.org/1999/xhtml", "html", dt) + , doc_el = doc.documentElement + , head = doc_el.appendChild(doc.createElement("head")) + , charset_meta = head.appendChild(doc.createElement("meta")) + , title = head.appendChild(doc.createElement("title")) + , body = doc_el.appendChild(doc.createElement("body")) + , i = 0 + , len = html.childNodes.length + ; + charset_meta.setAttribute("charset", html.ownerDocument.characterSet); + for (; i < len; i++) { + body.appendChild(doc.importNode(html.childNodes.item(i), true)); + } + var title_text = guess_title(doc); + if (title_text) { + title.appendChild(doc.createTextNode(title_text)); + } + return doc; + } +; +canvas.width = 500; +canvas.height = 300; + + if (typeof x_points === "string") { + x_points = JSON.parse(x_points); +} if (typeof y_points === "string") { + y_points = JSON.parse(y_points); +} if (typeof drag_points === "string") { + drag_points = JSON.parse(drag_points); +} if (session.canvas_filename) { + canvas_filename.value = session.canvas_filename; +} if (session.text) { + text.value = session.text; +} if (session.text_filename) { + text_filename.value = session.text_filename; +} if (session.html) { + html.innerHTML = session.html; +} if (session.html_filename) { + html_filename.value = session.html_filename; +} + +drawing = true; +draw(); +drawing = false; + +canvas_clear_button.addEventListener("click", function() { + canvas.width = canvas.width; + x_points.length = + y_points.length = + drag_points.length = + 0; +}, false); +canvas.addEventListener("mousedown", function(event) { + event.preventDefault(); + drawing = true; + add_point(event.pageX - canvas.offsetLeft, event.pageY - canvas.offsetTop, false); + draw(); +}, false); +canvas.addEventListener("mousemove", function(event) { + if (drawing) { + add_point(event.pageX - canvas.offsetLeft, event.pageY - canvas.offsetTop, true); + draw(); + } +}, false); +canvas.addEventListener("mouseup", stop_drawing, false); +canvas.addEventListener("mouseout", stop_drawing, false); + +canvas_options_form.addEventListener("submit", function(event) { + event.preventDefault(); + canvas.toBlob(function(blob) { + saveAs( + blob + , (canvas_filename.value || canvas_filename.placeholder) + ".png" + ); + }, "image/png"); +}, false); + +text_options_form.addEventListener("submit", function(event) { + event.preventDefault(); + var BB = get_blob(); + saveAs( + new BB( + [text.value || text.placeholder] + , {type: "text/plain;charset=" + document.characterSet} + ) + , (text_filename.value || text_filename.placeholder) + ".txt" + ); +}, false); + +html_options_form.addEventListener("submit", function(event) { + event.preventDefault(); + var + BB = get_blob() + , xml_serializer = new XMLSerializer() + , doc = create_html_doc(html) + ; + saveAs( + new BB( + [xml_serializer.serializeToString(doc)] + , {type: "application/xhtml+xml;charset=" + document.characterSet} + ) + , (html_filename.value || html_filename.placeholder) + ".xhtml" + ); +}, false); + +view.addEventListener("unload", function() { + session.x_points = JSON.stringify(x_points); + 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); +}(self));