JSFiddle - React, Tailwind, and code Playground

HTML

<div class="scalableParent">
    <img src="http://media.indiatimes.in/media/photogallery/2012/Dec/best_images_of_2012_1355117665_1355117684.jpg" class="scalable" />
</div>

JavaScript

var uid = 0;
            jQuery.fn.extend({
                skew: function() {
                    uid++;
                    this.attr("style","position:relative");
                    var parent = this;
                    var image = this.find("img");
                    var canvas = createCorrespondingCanvas(image);
                    var img = new Image();
                    $(img).on("load", function(){
                        canvas.width = this.width
                        canvas.height = this.height
                        var ctx=canvas.getContext("2d");
                        ctx.clearRect(0,0,0,0)
                        ctx.drawImage(this,0,0, this.width, this.height);
                        $(this).hide();
                        //$(img).off("load");
                    });

                    img.src= image.attr("src")
                    this.find("img").attr("style", "position:absolute; z-index: -1");
                    var handles = createHandles(this, image);
                    makeHandlesDraggable(handles);
                    createOutputImage();
                    var output;
                    function createOutputImage(){
                        output = new Image();
                        output.id="outputImage";
                        $(parent).append(output);
                    }

                    function createHandles(el, image){
                        var handleLeftTop = document.createElement("div");
                        handleLeftTop.className = "handle left-top";
                        $(handleLeftTop).css({position:"absolute", width: 40, height: 40, border: "1px solid black"});
                        var handleLeftBottom = document.createElement("div");
                        handleLeftBottom.className = "handle left-bottom";
                        $(handleLeftBottom).css({position:"absolute", width: 40, height: 40, border: "1px solid black"});
                        var handleRightTop =...