DarrylD/paste-image.html

## paste-image.html
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Paste image from clipboard in Chrome</title>
	<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
	<script>
		//plugin for pasting from https://gist.github.com/STRd6/5286415
		(function($) {
			// plugin by STRd6
			// MIT License
			// jquery.paste_image_reader.js
		  var defaults;
		  $.event.fix = (function(originalFix) {
		    return function(event) {
		      event = originalFix.apply(this, arguments);
		      if (event.type.indexOf('copy') === 0 || event.type.indexOf('paste') === 0) {
		        event.clipboardData = event.originalEvent.clipboardData;
		      }
		      return event;
		    };
		  })($.event.fix);
		  defaults = {
		    callback: $.noop,
		    matchType: /image.*/
		  };
		  return $.fn.pasteImageReader = function(options) {
		    if (typeof options === "function") {
		      options = {
		        callback: options
		      };
		    }
		    options = $.extend({}, defaults, options);
		    return this.each(function() {
		      var $this, element;
		      element = this;
		      $this = $(this);
		      return $this.bind('paste', function(event) {
		        var clipboardData, found;
		        found = false;
		        clipboardData = event.clipboardData;
		        return Array.prototype.forEach.call(clipboardData.types, function(type, i) {
		          var file, reader;
		          if (found) {
		            return;
		          }
		          if (type.match(options.matchType) || clipboardData.items[i].type.match(options.matchType)) {
		            file = clipboardData.items[i].getAsFile();
		            reader = new FileReader();
		            reader.onload = function(evt) {
		              return options.callback.call(element, {
		                dataURL: evt.target.result,
		                event: evt,
		                file: file,
		                name: file.name
		              });
		            };
		            reader.readAsDataURL(file);
		            return found = true;
		          }
		        });
		      });
		    });
		  };
		})(jQuery);

		//example code to paste
		var loaded = function(){
			$("html").pasteImageReader(function(results) {
				var filename = results.filename;
				  , dataURL = results.dataURL, results;

				$("body").css({
					background: "url(" + dataURL + ") no-repeat"
				});

				$('.instructions').hide()
			});
		}

		//fire on dom ready
		$(document).ready(loaded)
	</script>
</head>
<body>
	<div class="instructions"> Ctrl-v to paste in this container </div>
</body>
</html>
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Paste image from clipboard in Chrome</title>
	<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
	<script>
	//plugin for pasting from https://gist.github.com/STRd6/5286415
	(function($) {
	// plugin by STRd6
	// MIT License
	// jquery.paste_image_reader.js
	var defaults;
	$.event.fix = (function(originalFix) {
	return function(event) {
	event = originalFix.apply(this, arguments);
	if (event.type.indexOf('copy') === 0 \|\| event.type.indexOf('paste') === 0) {
	event.clipboardData = event.originalEvent.clipboardData;
	}
	return event;
	};
	})($.event.fix);
	defaults = {
	callback: $.noop,
	matchType: /image.*/
	};
	return $.fn.pasteImageReader = function(options) {
	if (typeof options === "function") {
	options = {
	callback: options
	};
	}
	options = $.extend({}, defaults, options);
	return this.each(function() {
	var $this, element;
	element = this;
	$this = $(this);
	return $this.bind('paste', function(event) {
	var clipboardData, found;
	found = false;
	clipboardData = event.clipboardData;
	return Array.prototype.forEach.call(clipboardData.types, function(type, i) {
	var file, reader;
	if (found) {
	return;
	}
	if (type.match(options.matchType) \|\| clipboardData.items[i].type.match(options.matchType)) {
	file = clipboardData.items[i].getAsFile();
	reader = new FileReader();
	reader.onload = function(evt) {
	return options.callback.call(element, {
	dataURL: evt.target.result,
	event: evt,
	file: file,
	name: file.name
	});
	};
	reader.readAsDataURL(file);
	return found = true;
	}
	});
	});
	});
	};
	})(jQuery);

	//example code to paste
	var loaded = function(){
	$("html").pasteImageReader(function(results) {
	var filename = results.filename;
	, dataURL = results.dataURL, results;

	$("body").css({
	background: "url(" + dataURL + ") no-repeat"
	});

	$('.instructions').hide()
	});
	}

	//fire on dom ready
	$(document).ready(loaded)
	</script>
	</head>
	<body>
	<div class="instructions"> Ctrl-v to paste in this container </div>
	</body>
	</html>