From 3eeda3e83ea6c9796ff7cd940aab41176155aa78 Mon Sep 17 00:00:00 2001 From: Alessio Maffeis Date: Thu, 20 Jul 2023 23:58:34 +0200 Subject: [PATCH] Update package to 3.0.1 --- package-lock.json | 4 ++-- package.json | 2 +- umd/vue-picture-input.js | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7d41709..cb4c0d9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "vue-picture-input", - "version": "3.0.0", + "version": "3.0.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "vue-picture-input", - "version": "3.0.0", + "version": "3.0.1", "license": "MIT", "devDependencies": { "@vue/test-utils": "^1.0.0", diff --git a/package.json b/package.json index 578b3af..a096622 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-picture-input", - "version": "3.0.0", + "version": "3.0.1", "description": "Mobile-friendly picture file input component with image preview and drag and drop.", "main": "PictureInput.vue", "scripts": { diff --git a/umd/vue-picture-input.js b/umd/vue-picture-input.js index 07fedd4..597e753 100644 --- a/umd/vue-picture-input.js +++ b/umd/vue-picture-input.js @@ -1 +1 @@ -!function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports.PictureInput=t():e.PictureInput=t()}(window,(function(){return function(e){var t={};function i(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,i),r.l=!0,r.exports}return i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)i.d(n,r,function(t){return e[t]}.bind(null,r));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="/",i(i.s=1)}([function(e,t,i){var n=i(3);n.__esModule&&(n=n.default),"string"===typeof n&&(n=[[e.i,n,""]]),n.locals&&(e.exports=n.locals);(0,i(6).default)("580c7f9c",n,!0,{sourceMap:!1})},function(e,t,i){e.exports=i(5)},function(e,t,i){"use strict";i(0)},function(e,t,i){(t=i(4)(!1)).push([e.i,".picture-input[data-v-22739b8c]{width:100%;margin:0 auto;text-align:center}.preview-container[data-v-22739b8c]{width:100%;box-sizing:border-box;margin:0 auto;cursor:pointer;overflow:hidden}.picture-preview[data-v-22739b8c]{width:100%;height:100%;position:relative;z-index:10001;box-sizing:border-box;background-color:hsla(0,0%,78.4%,.25)}.picture-preview.dragging-over[data-v-22739b8c]{filter:brightness(.5)}.picture-inner[data-v-22739b8c]{position:relative;z-index:10002;pointer-events:none;box-sizing:border-box;margin:1em auto;padding:.5em;border:.3em dashed rgba(66,66,66,.15);border-radius:8px;width:calc(100% - 2.5em);height:calc(100% - 2.5em);display:table}.picture-inner .picture-inner-text[data-v-22739b8c]{display:table-cell;vertical-align:middle;text-align:center;font-size:2em;line-height:1.5}button[data-v-22739b8c]{margin:1em .25em;cursor:pointer}input[type=file][data-v-22739b8c]{display:none}",""]),e.exports=t},function(e,t,i){"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var i=function(e,t){var i=e[1]||"",n=e[3];if(!n)return i;if(t&&"function"===typeof btoa){var r=function(e){var t=btoa(unescape(encodeURIComponent(JSON.stringify(e)))),i="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(t);return"/*# ".concat(i," */")}(n),a=n.sources.map((function(e){return"/*# sourceURL=".concat(n.sourceRoot||"").concat(e," */")}));return[i].concat(a).concat([r]).join("\n")}return[i].join("\n")}(t,e);return t[2]?"@media ".concat(t[2]," {").concat(i,"}"):i})).join("")},t.i=function(e,i,n){"string"===typeof e&&(e=[[null,e,""]]);var r={};if(n)for(var a=0;aYour device does not support file uploading.

",drag:"Drag an image or
click here to select a file",tap:"Tap here to select a photo
from your gallery",change:"Change Photo",aspect:"Landscape/Portrait",remove:"Remove Photo",select:"Select a Photo",selected:"

Photo successfully selected!

",fileSize:"The file size exceeds the limit",fileType:"This file type is not supported."}}},mounted:function(){var e=this;if(this.updateStrings(),this.prefill&&this.preloadImage(this.prefill,this.prefillOptions),this.$nextTick((function(){window.addEventListener("resize",e.onResize),e.onResize()})),this.supportsPreview){this.pixelRatio=Math.round(window.devicePixelRatio||window.screen.deviceXDPI/window.screen.logicalXDPI);var t=this.$refs.previewCanvas;t.getContext&&(this.context=t.getContext("2d"),this.context.scale(this.pixelRatio,this.pixelRatio))}"image/*"!==this.accept&&(this.fileTypes=this.accept.split(","),this.fileTypes=this.fileTypes.map((function(e){return e.trim()}))),this.canvasWidth=this.width,this.canvasHeight=this.height,this.width!=Number.MAX_SAFE_INTEGER&&this.height!=Number.MAX_SAFE_INTEGER&&(this.previewWidth=this.width,this.previewHeight=this.height)},beforeDestroy:function(){window.removeEventListener("resize",this.onResize)},methods:{updateStrings:function(){for(var e in this.customStrings)e in this.strings&&"string"===typeof this.customStrings[e]&&(this.strings[e]=this.customStrings[e])},onClick:function(){this.imageSelected?(this.changeOnClick&&this.selectImage(),this.$emit("click")):this.selectImage()},onResize:function(){this.resizeCanvas()&&this.imageObject&&this.drawImage(this.imageObject)},onDragEnter:function(){this.supportsDragAndDrop&&(this.draggingOver=!0)},onDragLeave:function(){this.supportsDragAndDrop&&(this.draggingOver=!1)},onFileDrop:function(e){this.onDragLeave(),this.onFileChange(e)},onFileChange:function(e,t){var i=e.target.files||e.dataTransfer.files;if(i.length){if(i[0].size<=0||i[0].size>1024*this.size*1024)return this.$emit("error",{type:"fileSize",fileSize:i[0].size,fileType:i[0].type,fileName:i[0].name,message:this.strings.fileSize+" ("+this.size+"MB)"}),void(this.alertOnError&&alert(this.strings.fileSize+" ("+this.size+"MB)"));if(i[0].name!==this.fileName||i[0].size!==this.fileSize||this.fileModified!==i[0].lastModified){if(this.file=i[0],this.fileName=i[0].name,this.fileSize=i[0].size,this.fileModified=i[0].lastModified,this.fileType=i[0].type.split(";")[0],"image/*"===this.accept){if("image/"!==this.fileType.substr(0,6))return}else if(-1===this.fileTypes.indexOf(this.fileType))return this.$emit("error",{type:"fileType",fileSize:this.fileSize,fileType:this.fileType,fileName:this.fileName,message:this.strings.fileType}),void(this.alertOnError&&alert(this.strings.fileType));this.imageSelected=!0,this.image="",this.supportsPreview?this.loadImage(i[0],t||!1):t?this.$emit("prefill"):this.$emit("change",this.image)}}},loadImage:function(e,t){var i=this;this.getEXIFOrientation(e,(function(t){i.setOrientation(t);var n=new FileReader;n.onload=function(e){i.image=e.target.result,i.imageObject=new Image,i.imageObject.onload=function(){i.autoToggleAspectRatio&&(i.getOrientation(i.canvasWidth,i.canvasHeight)!==i.getOrientation(i.imageObject.width,i.imageObject.height)&&i.rotateCanvas());i.drawImage(i.imageObject)},i.imageObject.src=i.image},n.readAsDataURL(e)}))},drawImage:function(e){this.imageWidth=e.width,this.imageHeight=e.height,this.imageRatio=e.width/e.height;var t=0,i=0,n=this.previewWidth,r=this.previewHeight,a=this.previewWidth/this.previewHeight;this.crop?this.imageRatio>=a?(n=r*this.imageRatio,t=(this.previewWidth-n)/2):(r=n/this.imageRatio,i=(this.previewHeight-r)/2):this.imageRatio>=a?(r=n/this.imageRatio,i=(this.previewHeight-r)/2):(n=r*this.imageRatio,t=(this.previewWidth-n)/2);var o=this.$refs.previewCanvas;o.style.background="none",o.width=this.previewWidth*this.pixelRatio,o.height=this.previewHeight*this.pixelRatio,this.context.setTransform(1,0,0,1,0,0),this.context.clearRect(0,0,o.width,o.height),this.rotate&&"undefined"===typeof this.imageObject.style.imageOrientation&&(this.context.translate(t*this.pixelRatio,i*this.pixelRatio),this.context.translate(n/2*this.pixelRatio,r/2*this.pixelRatio),this.context.rotate(this.rotate),t=-n/2,i=-r/2),this.context.drawImage(e,t*this.pixelRatio,i*this.pixelRatio,n*this.pixelRatio,r*this.pixelRatio)},selectImage:function(){this.$refs.fileInput.click()},removeImage:function(){this.$refs.fileInput.value="",this.$refs.fileInput.type="",this.$refs.fileInput.type="file",this.fileName="",this.fileType="",this.fileSize=0,this.fileModified=0,this.imageSelected=!1,this.image="",this.file=null,this.imageObject=null,this.$refs.previewCanvas.style.backgroundColor="rgba(200,200,200,.25)",this.$refs.previewCanvas.width=this.previewWidth*this.pixelRatio,this.$emit("remove")},rotateImage:function(){this.rotateCanvas(),this.imageObject&&this.drawImage(this.imageObject);var e=this.getOrientation(this.canvasWidth,this.canvasHeight);this.$emit("aspectratiochange",e)},resizeCanvas:function(){var e=this.canvasWidth/this.canvasHeight,t=this.$refs.container.clientWidth;return!!t&&(!(!this.toggleAspectRatio&&t===this.containerWidth)&&(this.containerWidth=t,this.previewWidth=Math.min(this.containerWidth-2*this.margin,this.canvasWidth),this.previewHeight=this.previewWidth/e,!0))},getOrientation:function(e,t){var i="square";return e>t?i="landscape":e2&&void 0!==arguments[2]?arguments[2]:{};r(this,t);var o=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e,n));return o.lastModifiedDate=new Date,o.lastModified=+o.lastModifiedDate,o.name=i,o}return function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&o(e,t)}(t,Blob),t}()}if(t=Object.assign({},t),"object"===("undefined"===typeof e?"undefined":n(e)))return this.imageSelected=!0,this.image="",void(this.supportsPreview?this.loadImage(e,!0):this.$emit("prefill"));-1===e.indexOf("data:")&&(-1!==e.indexOf("?")?e+="&_="+(new Date).getTime():e+="?_="+(new Date).getTime());var l=new Headers;l.append("Accept","image/*"),fetch(e,{method:"GET",mode:"cors",headers:l}).then((function(e){return e.blob()})).then((function(n){var r={target:{files:[]}},a=t.fileName||e.split("/").slice(-1)[0],o=t.mediaType||n.type||"image/"+(t.fileType||a.split("?")[0].split(".").slice(-1)[0].split("?")[0]);"image/svg"===(o=(o=o.replace("jpg","jpeg")).replace("image/svg","image/svg+xml"))&&(o="image/svg+xml"),r.target.files[0]=new s([n],a,{type:o}),i.onFileChange(r,!0)})).catch((function(e){i.$emit("error",{type:"failedPrefill",message:"Failed loading prefill image: "+e}),i.alertOnError&&alert("Failed loading prefill image: "+e)}))}},computed:{supportsUpload:function(){if(navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/))return!1;var e=document.createElement("input");return e.type="file",!e.disabled},supportsPreview:function(){return window.FileReader&&!!window.CanvasRenderingContext2D},supportsDragAndDrop:function(){var e=document.createElement("div");return("draggable"in e||"ondragstart"in e&&"ondrop"in e)&&!("ontouchstart"in window||navigator.msMaxTouchPoints)},computedClasses:function(){var e={};return e["dragging-over"]=this.draggingOver,e},fontSize:function(){return Math.min(.04*this.previewWidth,21)+"px"}}};i(2);var l=function(e,t,i,n,r,a,o,s){var l,u="function"===typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=i,u._compiled=!0),n&&(u.functional=!0),a&&(u._scopeId="data-v-"+a),o?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},u._ssrRegister=l):r&&(l=s?function(){r.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:r),l)if(u.functional){u._injectStyles=l;var c=u.render;u.render=function(e,t){return l.call(t),c(e,t)}}else{var p=u.beforeCreate;u.beforeCreate=p?[].concat(p,l):[l]}return{exports:e,options:u}}(s,(function(){var e=this,t=e._self._c;return t("div",{ref:"container",staticClass:"picture-input",attrs:{id:"picture-input"}},[e.supportsUpload?e.supportsPreview?t("div",[t("div",{staticClass:"preview-container",style:{maxWidth:e.previewWidth+"px",height:e.previewHeight+"px",borderRadius:e.radius+"%"}},[t("canvas",{ref:"previewCanvas",staticClass:"picture-preview",class:e.computedClasses,style:{height:e.previewHeight+"px",zIndex:e.zIndex+1},attrs:{tabindex:"0"},on:{drag:function(e){e.stopPropagation(),e.preventDefault()},dragover:function(e){e.stopPropagation(),e.preventDefault()},dragstart:function(e){e.stopPropagation(),e.preventDefault()},dragend:function(e){e.stopPropagation(),e.preventDefault()},dragenter:function(t){return t.stopPropagation(),t.preventDefault(),e.onDragEnter.apply(null,arguments)},dragleave:function(t){return t.stopPropagation(),t.preventDefault(),e.onDragLeave.apply(null,arguments)},drop:function(t){return t.stopPropagation(),t.preventDefault(),e.onFileDrop.apply(null,arguments)},click:function(t){return t.preventDefault(),e.onClick.apply(null,arguments)},keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.onClick.apply(null,arguments)}}}),e._v(" "),e.imageSelected||e.plain?e._e():t("div",{staticClass:"picture-inner",style:{top:-e.previewHeight+"px",marginBottom:-e.previewHeight+"px",fontSize:e.fontSize,borderRadius:e.radius+"%",zIndex:e.zIndex+2}},[e.supportsDragAndDrop?t("span",{staticClass:"picture-inner-text",domProps:{innerHTML:e._s(e.strings.drag)}}):t("span",{staticClass:"picture-inner-text",domProps:{innerHTML:e._s(e.strings.tap)}})])]),e._v(" "),e.imageSelected&&!e.hideChangeButton?t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.change))]):e._e(),e._v(" "),e.imageSelected&&e.removable?t("button",{class:e.removeButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.removeImage.apply(null,arguments)}}},[e._v(e._s(e.strings.remove))]):e._e(),e._v(" "),e.imageSelected&&e.toggleAspectRatio&&e.width!==e.height?t("button",{class:e.aspectButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.rotateImage.apply(null,arguments)}}},[e._v(e._s(e.strings.aspect))]):e._e()]):t("div",[e.imageSelected?t("div",[t("div",{domProps:{innerHTML:e._s(e.strings.selected)}}),e._v(" "),e.hideChangeButton?e._e():t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.change))]),e._v(" "),e.removable?t("button",{class:e.removeButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.removeImage.apply(null,arguments)}}},[e._v(e._s(e.strings.remove))]):e._e()]):t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.select))])]):t("div",{domProps:{innerHTML:e._s(e.strings.upload)}}),e._v(" "),t("input",{ref:"fileInput",attrs:{type:"file",name:e.name,id:e.id,accept:e.accept,capture:e.capture},on:{change:e.onFileChange}})])}),[],!1,null,"22739b8c",null);t.default=l.exports},function(e,t,i){"use strict";function n(e,t){for(var i=[],n={},r=0;ri.parts.length&&(n.parts.length=i.parts.length)}else{var o=[];for(r=0;rYour device does not support file uploading.

",drag:"Drag an image or
click here to select a file",tap:"Tap here to select a photo
from your gallery",change:"Change Photo",aspect:"Landscape/Portrait",remove:"Remove Photo",select:"Select a Photo",selected:"

Photo successfully selected!

",fileSize:"The file size exceeds the limit",fileType:"This file type is not supported."}}},mounted:function(){var e=this;if(this.updateStrings(),this.prefill&&this.preloadImage(this.prefill,this.prefillOptions),this.$nextTick((function(){window.addEventListener("resize",e.onResize),e.onResize()})),this.supportsPreview){this.pixelRatio=Math.round(window.devicePixelRatio||window.screen.deviceXDPI/window.screen.logicalXDPI);var t=this.$refs.previewCanvas;t.getContext&&(this.context=t.getContext("2d"),this.context.scale(this.pixelRatio,this.pixelRatio))}"image/*"!==this.accept&&(this.fileTypes=this.accept.split(","),this.fileTypes=this.fileTypes.map((function(e){return e.trim()}))),this.canvasWidth=this.width!=Number.MAX_SAFE_INTEGER?this.width:this.$refs.container.clientWidth,this.canvasHeight=this.height!=Number.MAX_SAFE_INTEGER?this.height:this.canvasWidth,this.previewWidth=this.canvasWidth,this.previewHeight=this.canvasHeight},beforeDestroy:function(){window.removeEventListener("resize",this.onResize)},methods:{updateStrings:function(){for(var e in this.customStrings)e in this.strings&&"string"===typeof this.customStrings[e]&&(this.strings[e]=this.customStrings[e])},onClick:function(){this.imageSelected?(this.changeOnClick&&this.selectImage(),this.$emit("click")):this.selectImage()},onResize:function(){this.resizeCanvas()&&this.imageObject&&this.drawImage(this.imageObject)},onDragEnter:function(){this.supportsDragAndDrop&&(this.draggingOver=!0)},onDragLeave:function(){this.supportsDragAndDrop&&(this.draggingOver=!1)},onFileDrop:function(e){this.onDragLeave(),this.$refs.fileInput.files=e.target.files||e.dataTransfer.files,this.onFileChange(e)},onFileChange:function(e,t){var i=e.target.files||e.dataTransfer.files;if(i.length){if(i[0].size<=0||i[0].size>1024*this.size*1024)return this.$emit("error",{type:"fileSize",fileSize:i[0].size,fileType:i[0].type,fileName:i[0].name,message:this.strings.fileSize+" ("+this.size+"MB)"}),void(this.alertOnError&&alert(this.strings.fileSize+" ("+this.size+"MB)"));if(i[0].name!==this.fileName||i[0].size!==this.fileSize||this.fileModified!==i[0].lastModified){if(this.file=i[0],this.fileName=i[0].name,this.fileSize=i[0].size,this.fileModified=i[0].lastModified,this.fileType=i[0].type.split(";")[0],"image/*"===this.accept){if("image/"!==this.fileType.substr(0,6))return}else if(-1===this.fileTypes.indexOf(this.fileType))return this.$emit("error",{type:"fileType",fileSize:this.fileSize,fileType:this.fileType,fileName:this.fileName,message:this.strings.fileType}),void(this.alertOnError&&alert(this.strings.fileType));this.imageSelected=!0,this.image="",this.supportsPreview?this.loadImage(i[0],t||!1):t?this.$emit("prefill"):this.$emit("change",this.image)}}},loadImage:function(e,t){var i=this;this.getEXIFOrientation(e,(function(t){i.setOrientation(t);var n=new FileReader;n.onload=function(e){i.image=e.target.result,i.imageObject=new Image,i.imageObject.onload=function(){i.autoToggleAspectRatio&&(i.getOrientation(i.canvasWidth,i.canvasHeight)!==i.getOrientation(i.imageObject.width,i.imageObject.height)&&i.rotateCanvas());i.drawImage(i.imageObject)},i.imageObject.src=i.image},n.readAsDataURL(e)}))},drawImage:function(e){this.imageWidth=e.width,this.imageHeight=e.height,this.imageRatio=e.width/e.height;var t=0,i=0,n=this.previewWidth,r=this.previewHeight,a=this.previewWidth/this.previewHeight;this.crop?this.imageRatio>=a?(n=r*this.imageRatio,t=(this.previewWidth-n)/2):(r=n/this.imageRatio,i=(this.previewHeight-r)/2):this.imageRatio>=a?(r=n/this.imageRatio,i=(this.previewHeight-r)/2):(n=r*this.imageRatio,t=(this.previewWidth-n)/2);var s=this.$refs.previewCanvas;s.style.background="none",s.width=this.previewWidth*this.pixelRatio,s.height=this.previewHeight*this.pixelRatio,this.context.setTransform(1,0,0,1,0,0),this.context.clearRect(0,0,s.width,s.height),this.rotate&&"undefined"===typeof this.imageObject.style.imageOrientation&&(this.context.translate(t*this.pixelRatio,i*this.pixelRatio),this.context.translate(n/2*this.pixelRatio,r/2*this.pixelRatio),this.context.rotate(this.rotate),t=-n/2,i=-r/2),this.context.drawImage(e,t*this.pixelRatio,i*this.pixelRatio,n*this.pixelRatio,r*this.pixelRatio)},selectImage:function(){this.$refs.fileInput.click()},removeImage:function(){this.$refs.fileInput.value="",this.$refs.fileInput.type="",this.$refs.fileInput.type="file",this.fileName="",this.fileType="",this.fileSize=0,this.fileModified=0,this.imageSelected=!1,this.image="",this.file=null,this.imageObject=null,this.$refs.previewCanvas.style.backgroundColor="rgba(200,200,200,.25)",this.$refs.previewCanvas.width=this.previewWidth*this.pixelRatio,this.$emit("remove")},rotateImage:function(){this.rotateCanvas(),this.imageObject&&this.drawImage(this.imageObject);var e=this.getOrientation(this.canvasWidth,this.canvasHeight);this.$emit("aspectratiochange",e)},resizeCanvas:function(){var e=this.canvasWidth/this.canvasHeight,t=this.$refs.container.clientWidth;return!!t&&(!(!this.toggleAspectRatio&&!this.autoToggleAspectRatio&&t===this.containerWidth)&&(this.containerWidth=t,this.previewWidth=Math.min(this.containerWidth-2*this.margin,this.canvasWidth),this.previewHeight=this.previewWidth/e,!0))},getOrientation:function(e,t){var i="square";return e>t?i="landscape":e2&&void 0!==arguments[2]?arguments[2]:{};r(this,t);var s=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e,n));return s.lastModifiedDate=new Date,s.lastModified=+s.lastModifiedDate,s.name=i,s}return function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&s(e,t)}(t,Blob),t}()}if(t=Object.assign({},t),"object"===("undefined"===typeof e?"undefined":n(e)))return this.imageSelected=!0,this.image="",void(this.supportsPreview?this.loadImage(e,!0):this.$emit("prefill"));-1===e.indexOf("data:")&&(-1!==e.indexOf("?")?e+="&_="+(new Date).getTime():e+="?_="+(new Date).getTime());var l=new Headers;l.append("Accept","image/*"),fetch(e,{method:"GET",mode:"cors",headers:l}).then((function(e){return e.blob()})).then((function(n){var r={target:{files:[]}},a=t.fileName||e.split("/").slice(-1)[0],s=t.mediaType||n.type||"image/"+(t.fileType||a.split("?")[0].split(".").slice(-1)[0].split("?")[0]);"image/svg"===(s=(s=s.replace("jpg","jpeg")).replace("image/svg","image/svg+xml"))&&(s="image/svg+xml"),r.target.files[0]=new o([n],a,{type:s}),i.onFileChange(r,!0)})).catch((function(e){i.$emit("error",{type:"failedPrefill",message:"Failed loading prefill image: "+e}),i.alertOnError&&alert("Failed loading prefill image: "+e)}))}},computed:{supportsUpload:function(){if(navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/))return!1;var e=document.createElement("input");return e.type="file",!e.disabled},supportsPreview:function(){return window.FileReader&&!!window.CanvasRenderingContext2D},supportsDragAndDrop:function(){var e=document.createElement("div");return("draggable"in e||"ondragstart"in e&&"ondrop"in e)&&!("ontouchstart"in window||navigator.msMaxTouchPoints)},computedClasses:function(){var e={};return e["dragging-over"]=this.draggingOver,e},fontSize:function(){return Math.min(.04*this.previewWidth,21)+"px"}}};i(2);var l=function(e,t,i,n,r,a,s,o){var l,u="function"===typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=i,u._compiled=!0),n&&(u.functional=!0),a&&(u._scopeId="data-v-"+a),s?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},u._ssrRegister=l):r&&(l=o?function(){r.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:r),l)if(u.functional){u._injectStyles=l;var c=u.render;u.render=function(e,t){return l.call(t),c(e,t)}}else{var p=u.beforeCreate;u.beforeCreate=p?[].concat(p,l):[l]}return{exports:e,options:u}}(o,(function(){var e=this,t=e._self._c;return t("div",{ref:"container",staticClass:"picture-input",attrs:{id:"picture-input"}},[e.supportsUpload?e.supportsPreview?t("div",[t("div",{staticClass:"preview-container",style:{maxWidth:e.previewWidth+"px",height:e.previewHeight+"px",borderRadius:e.radius+"%"}},[t("canvas",{ref:"previewCanvas",staticClass:"picture-preview",class:e.computedClasses,style:{height:e.previewHeight+"px",zIndex:parseInt(e.zIndex)+1},attrs:{tabindex:"0"},on:{drag:function(e){e.stopPropagation(),e.preventDefault()},dragover:function(e){e.stopPropagation(),e.preventDefault()},dragstart:function(e){e.stopPropagation(),e.preventDefault()},dragend:function(e){e.stopPropagation(),e.preventDefault()},dragenter:function(t){return t.stopPropagation(),t.preventDefault(),e.onDragEnter.apply(null,arguments)},dragleave:function(t){return t.stopPropagation(),t.preventDefault(),e.onDragLeave.apply(null,arguments)},drop:function(t){return t.stopPropagation(),t.preventDefault(),e.onFileDrop.apply(null,arguments)},click:function(t){return t.preventDefault(),e.onClick.apply(null,arguments)},keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.onClick.apply(null,arguments)}}}),e._v(" "),e.imageSelected||e.plain?e._e():t("div",{staticClass:"picture-inner",style:{top:-e.previewHeight+"px",marginBottom:-e.previewHeight+"px",fontSize:e.fontSize,borderRadius:e.radius+"%",zIndex:parseInt(e.zIndex)+2}},[e.supportsDragAndDrop?t("span",{staticClass:"picture-inner-text",domProps:{innerHTML:e._s(e.strings.drag)}}):t("span",{staticClass:"picture-inner-text",domProps:{innerHTML:e._s(e.strings.tap)}})])]),e._v(" "),e.imageSelected&&!e.hideChangeButton?t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.change))]):e._e(),e._v(" "),e.imageSelected&&e.removable?t("button",{class:e.removeButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.removeImage.apply(null,arguments)}}},[e._v(e._s(e.strings.remove))]):e._e(),e._v(" "),e.imageSelected&&e.toggleAspectRatio&&e.width!==e.height?t("button",{class:e.aspectButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.rotateImage.apply(null,arguments)}}},[e._v(e._s(e.strings.aspect))]):e._e()]):t("div",[e.imageSelected?t("div",[t("div",{domProps:{innerHTML:e._s(e.strings.selected)}}),e._v(" "),e.hideChangeButton?e._e():t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.change))]),e._v(" "),e.removable?t("button",{class:e.removeButtonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.removeImage.apply(null,arguments)}}},[e._v(e._s(e.strings.remove))]):e._e()]):t("button",{class:e.buttonClass,attrs:{type:"button"},on:{click:function(t){return t.preventDefault(),e.selectImage.apply(null,arguments)}}},[e._v(e._s(e.strings.select))])]):t("div",{domProps:{innerHTML:e._s(e.strings.upload)}}),e._v(" "),t("input",{ref:"fileInput",attrs:{type:"file",name:e.name,id:e.id,accept:e.accept,capture:e.capture},on:{change:e.onFileChange}})])}),[],!1,null,"06a8c132",null);t.default=l.exports},function(e,t,i){"use strict";function n(e,t){for(var i=[],n={},r=0;ri.parts.length&&(n.parts.length=i.parts.length)}else{var s=[];for(r=0;r