Created
February 17, 2013 13:57
-
-
Save bageljp/4971596 to your computer and use it in GitHub Desktop.
upload_before_thumbnail
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE HTML> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Thumbnail Load Example</title> | |
| </head> | |
| <body> | |
| <h2>Select an image file</h2> | |
| <p><input id="file-input" type="file"></p> | |
| <div id="result" class="well"> | |
| <canvas width="126" height="126"></canvas> | |
| </div> | |
| <script src="js/load-image.min.js"></script> | |
| <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> | |
| <script> | |
| /*global jQuery, window, document, HTMLCanvasElement */ | |
| (function ($) { | |
| 'use strict'; | |
| var result = $('#result'), | |
| load = function (e) { | |
| e = e.originalEvent; | |
| e.preventDefault(); | |
| if (!window.loadImage( | |
| (e.dataTransfer || e.target).files[0], | |
| function (img) { | |
| if (!(img.src || img instanceof HTMLCanvasElement)) { | |
| img = $( | |
| '<span class="label label-important">Error</span>' + | |
| ' <span>Loading image file failed</span>' | |
| ); | |
| } | |
| result.children().replaceWith(img); | |
| }, | |
| { | |
| maxWidth: result.children().outerWidth(), | |
| canvas: true | |
| } | |
| )) { | |
| result.children().replaceWith( | |
| $( | |
| '<span class="label label-important">Error</span>' + | |
| ' <span>Your browser does not support the URL or FileReader API.</span>' | |
| ) | |
| ); | |
| } | |
| }; | |
| $(document) | |
| .on('dragover', function (e) { | |
| e = e.originalEvent; | |
| e.preventDefault(); | |
| e.dataTransfer.dropEffect = 'copy'; | |
| }) | |
| .on('drop', load); | |
| $('#file-input').on('change', load); | |
| }(jQuery)); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment