Copy image protect

19 November 2013

Keywords: javascript

That’s easy for you, but Joe Average would have hard time trying to copy this kitty.

Here is the source, for curious (needs jQuery). The image url (?f=kitty) is accessible only (well…) by ajax requests:

<div style="position:relative;height:128px;width:128px">
	<img id="test" style="position:absolute;" />
	<span id="warn"></span>
</div>

<script>
$(function () {
function myRemove(evt) {
	if (evt.type != "keydown" || evt.ctrlKey || evt.altKey || evt.metaKey || evt.which == 121) {
		$("#test").attr("src", null);
		$("html").off("mouseleave keydown contextmenu").on(evt.type == "mouseleave" ? "mouseenter" : "click", myInsert);
		$("#warn").html("Click somewhere to bring the kitty back.");
	}
}
function myInsert(evt) {
	if(evt && (evt.ctrlKey || evt.altKey || evt.metaKey)) return;
	if(evt) myRequest.abort();
	if(mySrc) {myReload(mySrc); return;}
	myRequest = $.ajax({ 
		url : "?f=kitty", /* replace this by your image url */
		processData : false,
	}).done(function(src){
		mySrc = src ? src : null;
		myReload(mySrc);
	});
}
function myReload(src) {
	$("#test").attr("src", src);
	$("html").off("click mouseenter").on("mouseleave keydown contextmenu", myRemove);
	$("#warn").html("");
}
mySrc = null;
myInsert(null);
});
</script>