easystream-main/f_scripts/shared/cropper/cropper.init.js

if (!HTMLCanvasElement.prototype.toBlob) {
        Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {
	value: function (callback, type, quality) {
	        type = 'image/jpeg';
	        quality = 1;

	        var binStr = atob(this.toDataURL(type, quality).split(',')[1]),
		len = binStr.length,
		arr = new Uint8Array(len);

	        for (var i = 0; i < len; i++) {
		arr[i] = binStr.charCodeAt(i);
	        }

	        callback(new Blob([arr], {type: type || 'image/jpeg'}));
	}
        });
}

function pad(num, size) {
        return ('000000000' + num).substr(-size);
}

String.prototype.chunk = function (n) {
        var ret = [];
        for (var i = 0, len = this.length; i < len; i += n) {
	ret.push(this.substr(i, n))
        }

        return ret
};

$(document).ready(function() {
        var $image = $(".cropper img");
        
        $image.cropper({
	aspectRatio: 512 / 85,
	resizable: true,
	rotatable: true,
	responsive: true,
	minCropBoxWidth: Math.round(2048),
	minCropBoxHeight: Math.round(340),
	done: function (data) {
	}
        });
        
        
        var $inputImage = $('#fedit-image');
        var URL = window.URL || window.webkitURL;
        var blobURL;

        if (URL) {
	$inputImage.change(function () {
	        var files = this.files;
	        var file;

	        if (!$image.data('cropper')) {
		return;
	        }

	        if (files && files.length) {
		file = files[0];

		if (/^image\/\w+$/.test(file.type)) {
		        blobURL = URL.createObjectURL(file);
		        $image.one('built.cropper', function () {
			URL.revokeObjectURL(blobURL);
		        }).cropper('reset').cropper('replace', blobURL);
		} else {
		        $body.tooltip('Please choose an image file.', 'warning');
		}
	        }
	});
        } else {
	$inputImage.prop('disabled', true).parent().addClass('disabled');
        }


        $("a[class='c-zoomin']").click(function () {
        	$image.cropper('zoom', '.1');
        });
        $("a[class='c-zoomout']").click(function () {
        	$image.cropper('zoom', '-.1');
        });
        $("a[class='c-moveup']").click(function () {
        	$image.cropper('move', '0', '-10');
        });
        $("a[class='c-movedown']").click(function () {
        	$image.cropper('move', '0', '10');
        });
        $("a[class='c-moveleft']").click(function () {
        	$image.cropper('move', '-10', '0');
        });
        $("a[class='c-moveright']").click(function () {
        	$image.cropper('move', '10', '0');
        });


        $("button[id='done']").click(function () {
	if (typeof ($(".cropper-container").html()) != "undefined") {
	        $image.cropper('getCroppedCanvas').toBlob(function (blob) {
		var reader = new window.FileReader();
		reader.readAsDataURL(blob);
		reader.onloadend = function () {
		        base64data = reader.result.replace('png', 'jpeg');
		        $("input[name='crop_data']").val(base64data);
		        
		        $("#fedit-image-form").mask(" ");
		        jQuery.post(current_url + menu_section + "?s=channel-menu-entry3&do=save", $("#fedit-image-form").serialize(), function (data) {
			
			window.location = current_url + menu_section + "?r=confirm";
			
			return false;
		        });

		}
	        });
	} else {
	}
        });
        
        
        
        $("button[id='update']").click(function () {
	if (typeof ($(".cropper-container").html()) != "undefined") {
	        $image.cropper('getCroppedCanvas').toBlob(function (blob) {
		var reader = new window.FileReader();
		reader.readAsDataURL(blob);
		reader.onloadend = function () {
		        t = $("#crop-string").val();
		        base64data = reader.result.replace('png', 'jpeg');
		        $("input[name='crop_data']").val(base64data);
		        
		        $(".fancybox-inner").mask(" ");
		        jQuery.post(current_url + menu_section + "?s=channel-menu-entry3&do=save_crop&t=" + t, $("#fedit-image-form").serialize(), function (data) {
			if (t > 24) {
			        $(".fancybox-inner #upload-response").html(data);
			        $(".fancybox-inner").unmask("");
			} else {
			        window.location = current_url + menu_section + "?r=confirm";
			
			        return false;  
			}
		        });
		}
	        });
	} else {
	}
        });
        
        
        $("button[id='default']").click(function () {
	t = $("#crop-string").val();
	$(".fancybox-inner").mask(" ");
	jQuery.post(current_url + menu_section + "?s=channel-menu-entry3&do=save_default&t=" + t, $("#fedit-image-form").serialize(), function (data) {
	        $("#channel-own-photos img").removeClass("own");
	        $("#channel-own-photos #li-" + t + " img").addClass("own");
	        $(".fancybox-inner #upload-response").html(data);
	        $(".fancybox-inner").unmask("");
	});
        });
});