vue-core-image-upload/dist/lib/canvas-helper.js

a vue plgin for image upload and crop

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.VueCoreImageUpload=e():t.VueCoreImageUpload=e()}(this,function(){return function(t){function e(r){if(a[r])return a[r].exports;var o=a[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var a={};return e.m=t,e.c=a,e.i=function(t){return t},e.d=function(t,a,r){e.o(t,a)||Object.defineProperty(t,a,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var a=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(a,"a",a),a},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=13)}({13:function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={_getImageType:function(t){var e="image/jpeg",a=t.match(/(image\/[\w]+)\.*/)[0];return void 0!==a&&(e=a),e},compress:function(t,e,a){var r=new FileReader,o=this;r.onload=function(r){var n=new Image;n.src=r.target.result,n.onload=function(){var r=o._getImageType(t.type),g=o._getCanvas(n.naturalWidth,n.naturalHeight),i=(g.getContext("2d").drawImage(n,0,0),g.toDataURL(r,e/100));a(i)}},r.readAsDataURL(t)},crop:function(t,e,a){var r=function(t){return"number"==typeof t};if(r(e.toCropImgX)&&r(e.toCropImgY)&&e.toCropImgW>0&&e.toCropImgH>0){var o=e.toCropImgW,n=e.toCropImgH;e.maxWidth&&e.maxWidth<o&&(o=e.maxWidth,n=e.toCropImgH*o/e.toCropImgW),e.maxHeight&&e.maxHeight<n&&(n=e.maxHeight);var g=this._getCanvas(o,n),i=(g.getContext("2d").drawImage(t,e.toCropImgX,e.toCropImgY,e.toCropImgW,e.toCropImgH,0,0,o,n),this._getImageType(t.src));a(g.toDataURL(i,e.compress/100))}},init:function(t,e){var a=new Image;a.src=t;var r=this;a.onload=function(){var t=r._getImageType(a.src),o=r._getCanvas(a.naturalWidth,a.naturalHeight);o.getContext("2d").drawImage(a,0,0);var n=o.toDataURL(t,100);e(n)}},rotate:function(t,e,a){var r=new Image;r.src=t.src;var o=this;r.onload=function(){var t=o._getImageType(r.src),n=o._getCanvas(r.naturalHeight,r.naturalWidth),g=n.getContext("2d");1==e?(g.rotate(90*Math.PI/180),g.translate(0,-n.width)):(g.rotate(-90*Math.PI/180),g.translate(-n.height,0)),g.drawImage(r,0,0);var i=n.toDataURL(t,100);a(i)}},resize:function(t,e,a){var r=function(t){return"number"==typeof t};if(r(e.toCropImgX)&&r(e.toCropImgY)&&e.toCropImgW>0&&e.toCropImgH>0){var o=e.toCropImgW*e.imgChangeRatio,n=e.toCropImgH*e.imgChangeRatio,g=this._getCanvas(o,n),i=(g.getContext("2d").drawImage(t,0,0,e.toCropImgW,e.toCropImgH,0,0,o,n),this._getImageType(t.src));a(g.toDataURL(i,e.compress/100))}},rotate2:function(t,e,a){var r=this;this._loadImage(t,function(o){var n=o.naturalWidth,g=o.naturalHeight,i=Math.max(n,g),u=r._getCanvas(i,i),m=u.getContext("2d");m.save(),m.translate(i/2,i/2),m.rotate(e*(Math.PI/180));var c=-i/2,s=-i/2;if(0===(e%=360))return a(t,n,g);if(e%180!=0){-90===e||270===e?c=i/2-n:s=i/2-g;var p=n;n=g,g=p}else c=i/2-n,s=i/2-g;m.drawImage(o,c,s),r._getCanvas(n,g).getContext("2d").drawImage(u,0,0,n,g,0,0,n,g);var d=r._getImageType(o.src),f=u.toDataURL(d,1);a(f,n,g)})},_loadImage:function(t,e){var a=new Image;a.src=t,a.onload=function(){e(a)},a.onerror=function(){console.log("Error: image error!")}},_getCanvas:function(t,e){var a=document.createElement("canvas");return a.width=t,a.height=e,a}}}})});