Cropperjs tests

Widget:Cropperjs (not yet working) / MediaWiki:Common.js

installed with npm

Examples:

a-range-of-aspect-ratio.html
crop-a-round-image.html
crop-cross-origin-image.html
crop-on-canvas.html
cropper-in-modal.html
customize-preview.html
fixed-crop-box.html
full-crop-box.html
mask-an-image.html
minimum-and-maximum-cropped-dimensions.html
multiple-croppers.html
one-to-one-crop-box.html
responsive-container.html
upload-cropped-image-to-server.html

Examples (used to be here):

https://www.vanhamel.nl/dev/custom/js/cropperjs%20direct%20download/docs/examples/one-to-one-crop-box.html

https://www.vanhamel.nl/dev/custom/js/cropperjs%20direct%20download/docs/examples/customize-preview.html

function setupCropper() { 
	mw.loader.load('/dev/custom/js/cropperjs/dist/cropper.css', 'text/css');
	$.getScript("/dev/custom/js/cropperjs/dist/cropper.js").done(function() {
		/* import 'cropperjs/dist/cropper.css';
		import Cropper from '/dev/custom/js/cropperjs/'; 
		import '/dev/custom/js/cropperjs/cropper.esm.js';
		*/
		import Cropper from '../cropperjs';
  		const image = document.getElementById('cropper-image');
		const cropper = new Cropper(image, {
 			aspectRatio: 16 / 9,
        	crop(event) {
				console.log(event.detail.x);
				console.log(event.detail.y);
            	console.log(event.detail.width);
            	console.log(event.detail.height);
            	console.log(event.detail.rotate);
            	console.log(event.detail.scaleX);
            	console.log(event.detail.scaleY);
 			},
	     });
	});
}