added the js

assets/css/cropme.min.css

@@ -0,0 +1,9 @@
+/*!
+ * cropme v1.4.0
+ * https://shpontex.github.io/cropme
+ *
+ * Copyright 2019 shpontex
+ * Released under the MIT license
+ *
+ * Date: 2019-10-28T17:18:45.700Z
+ */.cropme-wrapper{width:100%;height:100%}.cropme-container{position:relative;overflow:hidden;margin:0 auto}.cropme-container img{width:auto!important;cursor:move;opacity:0;touch-action:none}#img{border:5px solid red}.viewport{box-sizing:content-box!important;position:absolute;border-style:solid;margin:auto;top:0;bottom:0;right:0;left:0;box-shadow:0 0 2000px 2000px rgba(0,0,0,.5);z-index:0;pointer-events:none}.viewport.circle{border-radius:50%}.cropme-rotation-slider,.cropme-slider{text-align:center}.cropme-rotation-slider input,.cropme-slider input{-webkit-appearance:none}.cropme-rotation-slider input:disabled,.cropme-slider input:disabled{opacity:.5}.cropme-rotation-slider input::-webkit-slider-runnable-track,.cropme-slider input::-webkit-slider-runnable-track{height:3px;background:rgba(0,0,0,.5);border-radius:3px}.cropme-rotation-slider input::-webkit-slider-thumb,.cropme-slider input::-webkit-slider-thumb{-webkit-appearance:none;height:16px;width:16px;border-radius:50%;background:#ddd;margin-top:-6px}.cropme-rotation-slider input:focus,.cropme-slider input:focus{outline:none}

assets/js/cropme.min.js

@@ -0,0 +1,10 @@
+/*!
+ * cropme v1.4.0
+ * https://shpontex.github.io/cropme
+ *
+ * Copyright 2019 shpontex
+ * Released under the MIT license
+ *
+ * Date: 2019-10-28T17:18:45.700Z
+ */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).Cropme=e()}(this,function(){"use strict";function Z(t){return(Z="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function r(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function p(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function a(t){return t&&"object"===Z(t)&&!Array.isArray(t)}function h(t){for(var e=arguments.length,i=new Array(1<e?e-1:0),r=1;r<e;r++)i[r-1]=arguments[r];if(!i.length)return t;var o,n=i.shift();if(Object.assign||Object.defineProperty(Object,"assign",{enumerable:!1,configurable:!0,writable:!0,value:function(t){if(null==t)throw new TypeError("Cannot convert first argument to object");for(var e=Object(t),i=1;i<arguments.length;i++){var r=arguments[i];if(null!=r){r=Object(r);for(var o=Object.keys(Object(r)),n=0,s=o.length;n<s;n++){var p=o[n],a=Object.getOwnPropertyDescriptor(r,p);void 0!==a&&a.enumerable&&(e[p]=r[p])}}}return e}}),a(t)&&a(n))for(var s in n)a(n[s])?(t[s]||Object.assign(t,p({},s,{})),h(t[s],n[s])):(o=n[s])&&Array.isArray(o)?(t[s]||Object.assign(t,p({},s,[])),t[s]=t[s].concat(n[s])):Object.assign(t,p({},s,n[s]));return h.apply(void 0,[t].concat(i))}function w(){return"translate3d("+this.properties.x+"px,"+this.properties.y+"px, 0) scale("+this.properties.scale+") rotate("+this.properties.deg+"deg)"}function d(t,e){return t+"px "+e+"px"}function l(){if(this.properties.rotation_slider)this.options.rotation.slider?this.properties.rotation_slider.disabled=!this.options.rotation.enable:(this.properties.wrapper.removeChild(this.properties.rotation_slider.parentNode),delete this.properties.rotation_slider),this.properties.rotation_slider&&(this.properties.rotation_slider.style.width=this.properties.container.offsetWidth+"px");else if(this.options.rotation.slider){var t=document.createElement("div");t.classList.add("cropme-rotation-slider");var e=this.properties.rotation_slider=document.createElement("input");e.type="range",e.setAttribute("min",-180),e.setAttribute("max",180),e.setAttribute("step",1),e.value=0,e.style.width=this.properties.container.offsetWidth+"px",t.appendChild(e),this.properties.wrapper.appendChild(t);var i=this;this.properties.rotation_slider.addEventListener(o()?"change":"input",function(t){i.rotate(t.target.value)}),this.properties.rotation_slider.disabled=!this.options.rotation.enable}}function o(){var t=window.navigator.userAgent,e=t.indexOf("MSIE ");if(0<e)return parseInt(t.substring(e+5,t.indexOf(".",e)),10);if(0<t.indexOf("Trident/")){var i=t.indexOf("rv:");return parseInt(t.substring(i+3,t.indexOf(".",i)),10)}var r=t.indexOf("Edge/");return 0<r&&parseInt(t.substring(r+5,t.indexOf(".",r)),10)}function u(){function t(){var t=(this.properties.wrapper.offsetWidth-this.properties.container.offsetWidth)/2,e=this.properties.container.offsetWidth/2+12+t;"left"===this.options.rotation.position&&(e=-this.properties.container.offsetWidth/2-20+t);var i=(this.properties.container.offsetWidth-this.properties.container.offsetHeight)/2,r=this.properties.container.offsetHeight/2+12-i;this.properties.sliderContainer.style.transform="translate3d("+e+"px, "+r+"px, 0) rotate(-90deg)";var o=this.properties.container.offsetWidth/2;this.properties.sliderContainer.style.transformOrigin=o+"px 12px",this.properties.sliderContainer.style.marginTop="-24px",this.properties.slider.disabled=!this.options.zoom.enable}if(this.properties.slider)this.options.zoom.slider?t.call(this):(this.properties.wrapper.removeChild(this.properties.slider.parentNode),delete this.properties.slider);else if(this.options.zoom.slider){var e=this,i=this.properties.sliderContainer=document.createElement("div");i.classList.add("cropme-slider");var r=this.properties.slider=document.createElement("input");r.type="range",r.setAttribute("min",this.options.zoom.min),r.setAttribute("max",this.options.zoom.max),r.setAttribute("step",1e-6),r.style.width=this.properties.container.offsetHeight+"px",i.style.width=this.properties.container.offsetHeight+"px",i.appendChild(r),this.properties.wrapper.insertBefore(i,this.properties.wrapper.firstChild),this.properties.slider.value=this.properties.scale,this.properties.slider.addEventListener(o()?"change":"input",function(t){e.properties.scale=parseFloat(t.target.value),e.properties.image.style.transform=w.call(e)}),t.call(this)}}function e(){var t=this.properties.container;t||(t=this.properties.container=document.createElement("div"),this.properties.wrapper.appendChild(t)),t.classList.add("cropme-container"),t.style.width=this.options.container.width+("string"==typeof this.options.container.width?"":"px"),t.Line truncated

assets/js/jquery-4.0.0.min.js

@@ -0,0 +1,2 @@
+/*! jQuery v4.0.0 | (c) OpenJS Foundation and other contributors | jquery.com/license */
+!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=t(e,!0):t(e)}("undefined"!=typeof window?window:this,function(e,t){"use strict";if(!e.document)throw Error("jQuery requires a window with a document");var n=[],r=Object.getPrototypeOf,i=n.slice,o=n.flat?function(e){return n.flat.call(e)}:function(e){return n.concat.apply([],e)},a=n.push,s=n.indexOf,u={},l=u.toString,c=u.hasOwnProperty,f=c.toString,p=f.call(Object),d={};function h(e){return null==e?e+"":"object"==typeof e?u[l.call(e)]||"object":typeof e}function g(e){return null!=e&&e===e.window}function v(e){var t=!!e&&e.length,n=h(e);return!("function"==typeof e||g(e))&&("array"===n||0===t||"number"==typeof t&&t>0&&t-1 in e)}var y=e.document,m={type:!0,src:!0,nonce:!0,noModule:!0};function x(e,t,n){var r,i=(n=n||y).createElement("script");for(r in i.text=e,m)t&&t[r]&&(i[r]=t[r]);n.head.appendChild(i).parentNode&&i.parentNode.removeChild(i)}var b="4.0.0",w=/HTML$/i,T=function(e,t){return new T.fn.init(e,t)};function C(e,t){return e.nodeName&&e.nodeName.toLowerCase()===t.toLowerCase()}T.fn=T.prototype={jquery:b,constructor:T,length:0,toArray:function(){return i.call(this)},get:function(e){return null==e?i.call(this):e<0?this[e+this.length]:this[e]},pushStack:function(e){var t=T.merge(this.constructor(),e);return t.prevObject=this,t},each:function(e){return T.each(this,e)},map:function(e){return this.pushStack(T.map(this,function(t,n){return e.call(t,n,t)}))},slice:function(){return this.pushStack(i.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},even:function(){return this.pushStack(T.grep(this,function(e,t){return(t+1)%2}))},odd:function(){return this.pushStack(T.grep(this,function(e,t){return t%2}))},eq:function(e){var t=this.length,n=+e+(e<0?t:0);return this.pushStack(n>=0&&n<t?[this[n]]:[])},end:function(){return this.prevObject||this.constructor()}},T.extend=T.fn.extend=function(){var e,t,n,r,i,o,a=arguments[0]||{},s=1,u=arguments.length,l=!1;for("boolean"==typeof a&&(l=a,a=arguments[s]||{},s++),"object"!=typeof a&&"function"!=typeof a&&(a={}),s===u&&(a=this,s--);s<u;s++)if(null!=(e=arguments[s]))for(t in e)r=e[t],"__proto__"!==t&&a!==r&&(l&&r&&(T.isPlainObject(r)||(i=Array.isArray(r)))?(n=a[t],o=i&&!Array.isArray(n)?[]:i||T.isPlainObject(n)?n:{},i=!1,a[t]=T.extend(l,o,r)):void 0!==r&&(a[t]=r));return a},T.extend({expando:"jQuery"+(b+Math.random()).replace(/\D/g,""),isReady:!0,error:function(e){throw Error(e)},noop:function(){},isPlainObject:function(e){var t,n;return!!e&&"[object Object]"===l.call(e)&&(!(t=r(e))||"function"==typeof(n=c.call(t,"constructor")&&t.constructor)&&f.call(n)===p)},isEmptyObject:function(e){var t;for(t in e)return!1;return!0},globalEval:function(e,t,n){x(e,{nonce:t&&t.nonce},n)},each:function(e,t){var n,r=0;if(v(e))for(n=e.length;r<n&&!1!==t.call(e[r],r,e[r]);r++);else for(r in e)if(!1===t.call(e[r],r,e[r]))break;return e},text:function(e){var t,n="",r=0,i=e.nodeType;if(!i)while(t=e[r++])n+=T.text(t);return 1===i||11===i?e.textContent:9===i?e.documentElement.textContent:3===i||4===i?e.nodeValue:n},makeArray:function(e,t){var n=t||[];return null!=e&&(v(Object(e))?T.merge(n,"string"==typeof e?[e]:e):a.call(n,e)),n},inArray:function(e,t,n){return null==t?-1:s.call(t,e,n)},isXMLDoc:function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return!w.test(t||n&&n.nodeName||"HTML")},contains:function(e,t){var n=t&&t.parentNode;return e===n||!!(n&&1===n.nodeType&&(e.contains?e.contains(n):e.compareDocumentPosition&&16&e.compareDocumentPosition(n)))},merge:function(e,t){for(var n=+t.length,r=0,i=e.length;r<n;r++)e[i++]=t[r];return e.length=i,e},grep:function(e,t,n){for(var r=[],i=0,o=e.length,a=!n;i<o;i++)!t(e[i],i)!==a&&r.push(e[i]);return r},map:function(e,t,n){var r,i,a=0,s=[];if(v(e))for(r=e.length;a<r;a++)null!=(i=t(e[a],a,n))&&s.push(i);else for(a in e)null!=(i=t(e[a],a,n))&&s.push(i);return o(s)},guid:1,support:d}),"function"==typeof Symbol&&(T.fn[Symbol.iterator]=n[Symbol.iterator]),T.each("Boolean Number String Function Array Date RegExp Object Error Symbol".split(" "),function(e,t){u["[object "+t+"]"]=t.toLowerCase()});var j=n.pop,E="[\\x20\\t\\r\\n\\f]",k=y.documentMode,S=k&&RegExp(":enabled|:disabled|\\["+E+"*name"+E+"*="+E+"*(?:''|\"\")"),D=RegExp("^"+E+"+|((?:^|[^\\\\])(?:\\\\.)*)"+E+"+$","g"),A="(?:\\\\[\\da-fA-F]{1,6}"+E+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",N=RegExp("^"+E+"*([>+~]|"+E+")"+E+"*"),q=RegExp(E+"|>"),O=/[+~]/,L=y.documentElement,H=L.matches||L.msMatchesSelector;function P(){var e=[];function t(n,r){return e.push(n+" ")>T.expr.cacheLength&&delete t[e.shift()],t[n+" "]=r}return t}function R(e){return e&&void 0!==e.getElementsByTagName&&e}var M="\\["+E+"*("+A+")(?:"+E+"*([*^$|!~]?=)"+E+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+A+"))|)"+E+"*\\]",W=":("+A+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+M+")*)|.*)\\)|)",$={ID:RegExp("^#("+Line truncated