Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

filepond-plugin-image-preview

Package Overview
Dependencies
Maintainers
1
Versions
54
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

filepond-plugin-image-preview - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

.gitattributes

4

dist/filepond-plugin-image-preview.esm.js
/*
* FilePondPluginImagePreview 1.0.5
* FilePondPluginImagePreview 1.0.6
* Licensed under MIT, https://opensource.org/licenses/MIT

@@ -15,3 +15,3 @@ * Please visit https://pqina.nl/filepond for details.

4: (width, height) => [1, 0, 0, -1, 0, height],
5: [0, 1, 1, 0, 0, 0],
5: () => [0, 1, 1, 0, 0, 0],
6: (width, height) => [0, 1, -1, 0, height, 0],

@@ -18,0 +18,0 @@ 7: (width, height) => [0, -1, -1, 0, height, width],

4

dist/filepond-plugin-image-preview.esm.min.js
/*
* FilePondPluginImagePreview 1.0.5
* FilePondPluginImagePreview 1.0.6
* Licensed under MIT, https://opensource.org/licenses/MIT
* Please visit https://pqina.nl/filepond for details.
*/
const isPreviewableImage=e=>/^image/.test(e.type)&&!/svg/.test(e.type),transforms={1:()=>[1,0,0,1,0,0],2:e=>[-1,0,0,1,e,0],3:(e,t)=>[-1,0,0,-1,e,t],4:(e,t)=>[1,0,0,-1,0,t],5:[0,1,1,0,0,0],6:(e,t)=>[0,1,-1,0,t,0],7:(e,t)=>[0,-1,-1,0,t,e],8:e=>[0,-1,1,0,0,e]},fixImageOrientation=(e,t,a,i)=>{-1!==i&&e.transform(...transforms[i](t,a))},createPreviewImage=(e,t,a,i)=>{t=Math.round(t),a=Math.round(a),i>=5&&i<=8&&([t,a]=[a,t]);const r=document.createElement("canvas"),o=r.getContext("2d");return i>=5&&i<=8?(r.width=a,r.height=t):(r.width=t,r.height=a),o.save(),fixImageOrientation(o,t,a,i),o.drawImage(e,0,0,t,a),o.restore(),"close"in e&&e.close(),r},IMAGE_SCALE_SPRING_PROPS={type:"spring",stiffness:.5,damping:.45,mass:10},createImageView=e=>e.utils.createView({name:"image-preview",tag:"div",ignoreRect:!0,create:({root:e,props:t})=>{e.ref.clip=document.createElement("div"),e.element.appendChild(e.ref.clip)},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:({root:e,props:t,action:a})=>{const{id:i}=t,r=e.query("GET_ITEM",{id:t.id}),o=(r.getMetadata("exif")||{}).orientation||-1;let{width:n,height:c}=a.data;o>=5&&o<=8&&([n,c]=[c,n]);const s=r.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:c/n},l=window.devicePixelRatio,p=e.query("GET_IMAGE_PREVIEW_HEIGHT"),d=e.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),E=e.query("GET_IMAGE_PREVIEW_MAX_HEIGHT"),I=e.rect.inner.width,m=c/n,h=I,_=I*m,g=null!==p?p:Math.max(d,Math.min(c,E)),w=g/m,y=createPreviewImage(a.data,w*l,g*l,o);let u=null!==p?p:Math.max(d,Math.min(I*s.aspectRatio,E)),T=u/s.aspectRatio;T>h&&(u=(T=h)*s.aspectRatio);const R=u/(_*s.rect.height);n=h*R,c=_*R;const M=-s.rect.x*h*R,v=-s.rect.y*_*R;e.ref.clip.style.cssText=`\n width: ${Math.round(T)}px;\n height: ${Math.round(u)}px;\n `,y.style.cssText=`\n width: ${Math.round(n)}px;\n height: ${Math.round(c)}px;\n transform: translate(${Math.round(M)}px, ${Math.round(v)}px) rotateZ(0.00001deg);\n `,e.ref.clip.appendChild(y),e.dispatch("DID_IMAGE_PREVIEW_DRAW",{id:i})}}),mixins:{styles:["scaleX","scaleY","opacity"],animations:{scaleX:IMAGE_SCALE_SPRING_PROPS,scaleY:IMAGE_SCALE_SPRING_PROPS,opacity:{type:"tween",duration:750}}}}),applyTemplate=(e,t)=>{t.width=e.width,t.height=e.height;t.getContext("2d").drawImage(e,0,0)},createImageOverlayView=e=>e.utils.createView({name:"image-preview-overlay",tag:"canvas",ignoreRect:!0,create:({root:e,props:t})=>{applyTemplate(t.template,e.element)},mixins:{styles:["opacity"],animations:{opacity:{type:"spring",mass:25}}}}),BitmapWorker=function(){self.onmessage=(t=>{e(t.data.message,e=>{self.postMessage({id:t.data.id,message:e},[e])})});const e=(e,t)=>{fetch(e.file).then(e=>e.blob()).then(e=>createImageBitmap(e)).then(e=>t(e))}},getImageSize=(e,t)=>{let a=new Image;a.onload=(()=>{const e=a.naturalWidth,i=a.naturalHeight;a=null,t(e,i)}),a.src=e},easeInOutSine=e=>-.5*(Math.cos(Math.PI*e)-1),addGradientSteps=(e,t,a=1,i=easeInOutSine,r=10,o=0)=>{const n=1-o,c=t.join(",");for(let t=0;t<=r;t++){const s=t/r,l=o+n*s;e.addColorStop(l,`rgba(${c}, ${i(s)*a})`)}},drawTemplate=(e,t,a,i,r)=>{e.width=t,e.height=a;const o=e.getContext("2d"),n=.5*t,c=o.createRadialGradient(n,a+110,a-100,n,a+110,a+100);addGradientSteps(c,i,r,void 0,8,.4),o.save(),o.translate(.5*-t,0),o.scale(2,1),o.fillStyle=c,o.fillRect(0,0,t,a),o.restore()},width=500,height=200,overlayTemplateShadow=document.createElement("canvas"),overlayTemplateError=document.createElement("canvas"),overlayTemplateSuccess=document.createElement("canvas");drawTemplate(overlayTemplateShadow,500,200,[40,40,40],.85),drawTemplate(overlayTemplateError,500,200,[196,78,71],1),drawTemplate(overlayTemplateSuccess,500,200,[54,151,99],1);const createImageWrapperView=e=>{const t=createImageOverlayView(e),a=({root:e})=>{e.ref.overlayShadow.opacity=1,e.ref.overlayError.opacity=0,e.ref.overlaySuccess.opacity=0},i=({root:e})=>{e.ref.overlayShadow.opacity=.25,e.ref.overlayError.opacity=1};return e.utils.createView({name:"image-preview-wrapper",create:({root:a,props:i,dispatch:r})=>{const o=createImageView(e);a.ref.image=a.appendChildView(a.createChildView(o,{id:i.id,scaleX:1.25,scaleY:1.25,opacity:0})),a.ref.overlayShadow=a.appendChildView(a.createChildView(t,{template:overlayTemplateShadow,opacity:0})),a.ref.overlaySuccess=a.appendChildView(a.createChildView(t,{template:overlayTemplateSuccess,opacity:0})),a.ref.overlayError=a.appendChildView(a.createChildView(t,{template:overlayTemplateError,opacity:0}))},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:({root:e,props:t})=>{e.ref.overlayShadow.opacity=1},DID_IMAGE_PREVIEW_DRAW:({root:e,props:t})=>{const{image:a}=e.ref;a.scaleX=1,a.scaleY=1,a.opacity=1},DID_IMAGE_PREVIEW_CONTAINER_CREATE:({root:t,props:a,action:i})=>{const{utils:r,views:o}=e,{createView:n,createWorker:c,loadImage:s}=r,{id:l}=a,p=t.query("GET_ITEM",l),d=URL.createObjectURL(p.file),E=(e,t,a,i)=>{s(d).then(I)},I=e=>{URL.revokeObjectURL(d),t.dispatch("DID_IMAGE_PREVIEW_LOAD",{id:l,data:e})};getImageSize(d,(e,a)=>{if(t.dispatch("DID_IMAGE_PREVIEW_CALCULATE_SIZE",{id:l,width:e,height:a}),"createImageBitmap"in window){const e=c(BitmapWorker);e.post({file:d},t=>{e.terminate(),t?I(t):E()})}else E()})},DID_THROW_ITEM_LOAD_ERROR:i,DID_THROW_ITEM_PROCESSING_ERROR:i,DID_THROW_ITEM_INVALID:i,DID_COMPLETE_ITEM_PROCESSING:({root:e})=>{e.ref.overlayShadow.opacity=.25,e.ref.overlaySuccess.opacity=1},DID_START_ITEM_PROCESSING:a,DID_REVERT_ITEM_PROCESSING:a})})};var plugin$1=e=>{const{addFilter:t,utils:a}=e,{Type:i,createRoute:r}=a,o=createImageWrapperView(e);return t("CREATE_VIEW",e=>{const{is:t,view:a,query:i}=e;if(!t("file")||!i("GET_ALLOW_IMAGE_PREVIEW"))return;a.registerWriter(r({DID_LOAD_ITEM:({root:e,props:t,actions:r})=>{const{id:n}=t,c=i("GET_ITEM",n);if(!c)return;const s=c.file;if(!isPreviewableImage(s))return;const l="createImageBitmap"in(window||{}),p=i("GET_IMAGE_PREVIEW_MAX_FILE_SIZE");!l&&p&&s.size>p||(e.ref.imagePreview=a.appendChildView(a.createChildView(o,{id:n})),e.dispatch("DID_IMAGE_PREVIEW_CONTAINER_CREATE",{id:n}))},DID_IMAGE_PREVIEW_CALCULATE_SIZE:({root:e,props:t,action:a})=>{const i=e.query("GET_ITEM",{id:t.id}),r=(i.getMetadata("exif")||{}).orientation||-1;let{width:o,height:n}=a;r>=5&&r<=8&&([o,n]=[n,o]);const c=i.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:n/o},s=e.query("GET_IMAGE_PREVIEW_HEIGHT"),l=e.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),p=e.query("GET_IMAGE_PREVIEW_MAX_HEIGHT");(o=(n=null!==s?s:Math.max(l,Math.min(n,p)))/c.aspectRatio)>e.rect.element.width&&(n=(o=e.rect.element.width)*c.aspectRatio),e.ref.imagePreview.element.style.cssText=`height:${Math.round(n)}px`}}))}),{options:{allowImagePreview:[!0,i.BOOLEAN],imagePreviewHeight:[null,i.INT],imagePreviewMinHeight:[44,i.INT],imagePreviewMaxHeight:[256,i.INT],imagePreviewMaxFileSize:[null,i.INT]}}};document&&document.dispatchEvent(new CustomEvent("FilePond:pluginloaded",{detail:plugin$1}));export default plugin$1;
const isPreviewableImage=e=>/^image/.test(e.type)&&!/svg/.test(e.type),transforms={1:()=>[1,0,0,1,0,0],2:e=>[-1,0,0,1,e,0],3:(e,t)=>[-1,0,0,-1,e,t],4:(e,t)=>[1,0,0,-1,0,t],5:()=>[0,1,1,0,0,0],6:(e,t)=>[0,1,-1,0,t,0],7:(e,t)=>[0,-1,-1,0,t,e],8:e=>[0,-1,1,0,0,e]},fixImageOrientation=(e,t,a,i)=>{-1!==i&&e.transform(...transforms[i](t,a))},createPreviewImage=(e,t,a,i)=>{t=Math.round(t),a=Math.round(a),i>=5&&i<=8&&([t,a]=[a,t]);const r=document.createElement("canvas"),o=r.getContext("2d");return i>=5&&i<=8?(r.width=a,r.height=t):(r.width=t,r.height=a),o.save(),fixImageOrientation(o,t,a,i),o.drawImage(e,0,0,t,a),o.restore(),"close"in e&&e.close(),r},IMAGE_SCALE_SPRING_PROPS={type:"spring",stiffness:.5,damping:.45,mass:10},createImageView=e=>e.utils.createView({name:"image-preview",tag:"div",ignoreRect:!0,create:({root:e,props:t})=>{e.ref.clip=document.createElement("div"),e.element.appendChild(e.ref.clip)},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:({root:e,props:t,action:a})=>{const{id:i}=t,r=e.query("GET_ITEM",{id:t.id}),o=(r.getMetadata("exif")||{}).orientation||-1;let{width:n,height:c}=a.data;o>=5&&o<=8&&([n,c]=[c,n]);const s=r.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:c/n},l=window.devicePixelRatio,p=e.query("GET_IMAGE_PREVIEW_HEIGHT"),d=e.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),E=e.query("GET_IMAGE_PREVIEW_MAX_HEIGHT"),I=e.rect.inner.width,m=c/n,h=I,_=I*m,g=null!==p?p:Math.max(d,Math.min(c,E)),w=g/m,y=createPreviewImage(a.data,w*l,g*l,o);let u=null!==p?p:Math.max(d,Math.min(I*s.aspectRatio,E)),T=u/s.aspectRatio;T>h&&(u=(T=h)*s.aspectRatio);const R=u/(_*s.rect.height);n=h*R,c=_*R;const M=-s.rect.x*h*R,v=-s.rect.y*_*R;e.ref.clip.style.cssText=`\n width: ${Math.round(T)}px;\n height: ${Math.round(u)}px;\n `,y.style.cssText=`\n width: ${Math.round(n)}px;\n height: ${Math.round(c)}px;\n transform: translate(${Math.round(M)}px, ${Math.round(v)}px) rotateZ(0.00001deg);\n `,e.ref.clip.appendChild(y),e.dispatch("DID_IMAGE_PREVIEW_DRAW",{id:i})}}),mixins:{styles:["scaleX","scaleY","opacity"],animations:{scaleX:IMAGE_SCALE_SPRING_PROPS,scaleY:IMAGE_SCALE_SPRING_PROPS,opacity:{type:"tween",duration:750}}}}),applyTemplate=(e,t)=>{t.width=e.width,t.height=e.height;t.getContext("2d").drawImage(e,0,0)},createImageOverlayView=e=>e.utils.createView({name:"image-preview-overlay",tag:"canvas",ignoreRect:!0,create:({root:e,props:t})=>{applyTemplate(t.template,e.element)},mixins:{styles:["opacity"],animations:{opacity:{type:"spring",mass:25}}}}),BitmapWorker=function(){self.onmessage=(t=>{e(t.data.message,e=>{self.postMessage({id:t.data.id,message:e},[e])})});const e=(e,t)=>{fetch(e.file).then(e=>e.blob()).then(e=>createImageBitmap(e)).then(e=>t(e))}},getImageSize=(e,t)=>{let a=new Image;a.onload=(()=>{const e=a.naturalWidth,i=a.naturalHeight;a=null,t(e,i)}),a.src=e},easeInOutSine=e=>-.5*(Math.cos(Math.PI*e)-1),addGradientSteps=(e,t,a=1,i=easeInOutSine,r=10,o=0)=>{const n=1-o,c=t.join(",");for(let t=0;t<=r;t++){const s=t/r,l=o+n*s;e.addColorStop(l,`rgba(${c}, ${i(s)*a})`)}},drawTemplate=(e,t,a,i,r)=>{e.width=t,e.height=a;const o=e.getContext("2d"),n=.5*t,c=o.createRadialGradient(n,a+110,a-100,n,a+110,a+100);addGradientSteps(c,i,r,void 0,8,.4),o.save(),o.translate(.5*-t,0),o.scale(2,1),o.fillStyle=c,o.fillRect(0,0,t,a),o.restore()},width=500,height=200,overlayTemplateShadow=document.createElement("canvas"),overlayTemplateError=document.createElement("canvas"),overlayTemplateSuccess=document.createElement("canvas");drawTemplate(overlayTemplateShadow,500,200,[40,40,40],.85),drawTemplate(overlayTemplateError,500,200,[196,78,71],1),drawTemplate(overlayTemplateSuccess,500,200,[54,151,99],1);const createImageWrapperView=e=>{const t=createImageOverlayView(e),a=({root:e})=>{e.ref.overlayShadow.opacity=1,e.ref.overlayError.opacity=0,e.ref.overlaySuccess.opacity=0},i=({root:e})=>{e.ref.overlayShadow.opacity=.25,e.ref.overlayError.opacity=1};return e.utils.createView({name:"image-preview-wrapper",create:({root:a,props:i,dispatch:r})=>{const o=createImageView(e);a.ref.image=a.appendChildView(a.createChildView(o,{id:i.id,scaleX:1.25,scaleY:1.25,opacity:0})),a.ref.overlayShadow=a.appendChildView(a.createChildView(t,{template:overlayTemplateShadow,opacity:0})),a.ref.overlaySuccess=a.appendChildView(a.createChildView(t,{template:overlayTemplateSuccess,opacity:0})),a.ref.overlayError=a.appendChildView(a.createChildView(t,{template:overlayTemplateError,opacity:0}))},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:({root:e,props:t})=>{e.ref.overlayShadow.opacity=1},DID_IMAGE_PREVIEW_DRAW:({root:e,props:t})=>{const{image:a}=e.ref;a.scaleX=1,a.scaleY=1,a.opacity=1},DID_IMAGE_PREVIEW_CONTAINER_CREATE:({root:t,props:a,action:i})=>{const{utils:r,views:o}=e,{createView:n,createWorker:c,loadImage:s}=r,{id:l}=a,p=t.query("GET_ITEM",l),d=URL.createObjectURL(p.file),E=(e,t,a,i)=>{s(d).then(I)},I=e=>{URL.revokeObjectURL(d),t.dispatch("DID_IMAGE_PREVIEW_LOAD",{id:l,data:e})};getImageSize(d,(e,a)=>{if(t.dispatch("DID_IMAGE_PREVIEW_CALCULATE_SIZE",{id:l,width:e,height:a}),"createImageBitmap"in window){const e=c(BitmapWorker);e.post({file:d},t=>{e.terminate(),t?I(t):E()})}else E()})},DID_THROW_ITEM_LOAD_ERROR:i,DID_THROW_ITEM_PROCESSING_ERROR:i,DID_THROW_ITEM_INVALID:i,DID_COMPLETE_ITEM_PROCESSING:({root:e})=>{e.ref.overlayShadow.opacity=.25,e.ref.overlaySuccess.opacity=1},DID_START_ITEM_PROCESSING:a,DID_REVERT_ITEM_PROCESSING:a})})};var plugin$1=e=>{const{addFilter:t,utils:a}=e,{Type:i,createRoute:r}=a,o=createImageWrapperView(e);return t("CREATE_VIEW",e=>{const{is:t,view:a,query:i}=e;if(!t("file")||!i("GET_ALLOW_IMAGE_PREVIEW"))return;a.registerWriter(r({DID_LOAD_ITEM:({root:e,props:t,actions:r})=>{const{id:n}=t,c=i("GET_ITEM",n);if(!c)return;const s=c.file;if(!isPreviewableImage(s))return;const l="createImageBitmap"in(window||{}),p=i("GET_IMAGE_PREVIEW_MAX_FILE_SIZE");!l&&p&&s.size>p||(e.ref.imagePreview=a.appendChildView(a.createChildView(o,{id:n})),e.dispatch("DID_IMAGE_PREVIEW_CONTAINER_CREATE",{id:n}))},DID_IMAGE_PREVIEW_CALCULATE_SIZE:({root:e,props:t,action:a})=>{const i=e.query("GET_ITEM",{id:t.id}),r=(i.getMetadata("exif")||{}).orientation||-1;let{width:o,height:n}=a;r>=5&&r<=8&&([o,n]=[n,o]);const c=i.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:n/o},s=e.query("GET_IMAGE_PREVIEW_HEIGHT"),l=e.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),p=e.query("GET_IMAGE_PREVIEW_MAX_HEIGHT");(o=(n=null!==s?s:Math.max(l,Math.min(n,p)))/c.aspectRatio)>e.rect.element.width&&(n=(o=e.rect.element.width)*c.aspectRatio),e.ref.imagePreview.element.style.cssText=`height:${Math.round(n)}px`}}))}),{options:{allowImagePreview:[!0,i.BOOLEAN],imagePreviewHeight:[null,i.INT],imagePreviewMinHeight:[44,i.INT],imagePreviewMaxHeight:[256,i.INT],imagePreviewMaxFileSize:[null,i.INT]}}};document&&document.dispatchEvent(new CustomEvent("FilePond:pluginloaded",{detail:plugin$1}));export default plugin$1;

6

dist/filepond-plugin-image-preview.js
/*
* FilePondPluginImagePreview 1.0.5
* FilePondPluginImagePreview 1.0.6
* Licensed under MIT, https://opensource.org/licenses/MIT

@@ -160,3 +160,5 @@ * Please visit https://pqina.nl/filepond for details.

},
5: [0, 1, 1, 0, 0, 0],
5: function _() {
return [0, 1, 1, 0, 0, 0];
},
6: function _(width, height) {

@@ -163,0 +165,0 @@ return [0, 1, -1, 0, height, 0];

4

dist/filepond-plugin-image-preview.min.js
/*
* FilePondPluginImagePreview 1.0.5
* FilePondPluginImagePreview 1.0.6
* Licensed under MIT, https://opensource.org/licenses/MIT
* Please visit https://pqina.nl/filepond for details.
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.FilePondPluginImagePreview=t()}(this,function(){"use strict";var e=function(e){return/^image/.test(e.type)&&!/svg/.test(e.type)},t=(function(){function e(e){this.value=e}function t(t){function r(e,t){return new Promise(function(r,i){var c={key:e,arg:t,resolve:r,reject:i,next:null};o?o=o.next=c:(a=o=c,n(e,t))})}function n(r,a){try{var o=t[r](a),c=o.value;c instanceof e?Promise.resolve(c.value).then(function(e){n("next",e)},function(e){n("throw",e)}):i(o.done?"return":"normal",o.value)}catch(u){i("throw",u)}}function i(e,t){switch(e){case"return":a.resolve({value:t,done:!0});break;case"throw":a.reject(t);break;default:a.resolve({value:t,done:!1})}a=a.next,a?n(a.key,a.arg):o=null}var a,o;this._invoke=r,"function"!=typeof t["return"]&&(this["return"]=void 0)}return"function"==typeof Symbol&&Symbol.asyncIterator&&(t.prototype[Symbol.asyncIterator]=function(){return this}),t.prototype.next=function(e){return this._invoke("next",e)},t.prototype["throw"]=function(e){return this._invoke("throw",e)},t.prototype["return"]=function(e){return this._invoke("return",e)},{wrap:function(e){return function(){return new t(e.apply(this,arguments))}},await:function(t){return new e(t)}}}(),function(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)}),r={1:function(){return[1,0,0,1,0,0]},2:function(e){return[-1,0,0,1,e,0]},3:function(e,t){return[-1,0,0,-1,e,t]},4:function(e,t){return[1,0,0,-1,0,t]},5:[0,1,1,0,0,0],6:function(e,t){return[0,1,-1,0,t,0]},7:function(e,t){return[0,-1,-1,0,t,e]},8:function(e){return[0,-1,1,0,0,e]}},n=function(e,n,i,a){a!==-1&&e.transform.apply(e,t(r[a](n,i)))},i=function(e,t,r,i){if(t=Math.round(t),r=Math.round(r),i>=5&&i<=8){var a=[r,t];t=a[0],r=a[1]}var o=document.createElement("canvas"),c=o.getContext("2d");return i>=5&&i<=8?(o.width=r,o.height=t):(o.width=t,o.height=r),c.save(),n(c,t,r,i),c.drawImage(e,0,0,t,r),c.restore(),"close"in e&&e.close(),o},a={type:"spring",stiffness:.5,damping:.45,mass:10},o=function(e){return e.utils.createView({name:"image-preview",tag:"div",ignoreRect:!0,create:function(e){var t=e.root;t.ref.clip=document.createElement("div"),t.element.appendChild(t.ref.clip)},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:function(e){var t=e.root,r=e.props,n=e.action,a=r.id,o=t.query("GET_ITEM",{id:r.id}),c=o.getMetadata("exif")||{},u=c.orientation||-1,l=n.data,d=l.width,s=l.height;if(u>=5&&u<=8){var f=[s,d];d=f[0],s=f[1]}var E=o.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:s/d},h=window.devicePixelRatio,p=t.query("GET_IMAGE_PREVIEW_HEIGHT"),v=t.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),I=t.query("GET_IMAGE_PREVIEW_MAX_HEIGHT"),_=t.rect.inner.width,m=s/d,y=_,w=_*m,g=null!==p?p:Math.max(v,Math.min(s,I)),M=g/m,R=i(n.data,M*h,g*h,u),T=null!==p?p:Math.max(v,Math.min(_*E.aspectRatio,I)),A=T/E.aspectRatio;A>y&&(A=y,T=A*E.aspectRatio);var D=T/(w*E.rect.height);d=y*D,s=w*D;var G=-E.rect.x*y*D,P=-E.rect.y*w*D;t.ref.clip.style.cssText="\n width: "+Math.round(A)+"px;\n height: "+Math.round(T)+"px;\n ",R.style.cssText="\n width: "+Math.round(d)+"px;\n height: "+Math.round(s)+"px;\n transform: translate("+Math.round(G)+"px, "+Math.round(P)+"px) rotateZ(0.00001deg);\n ",t.ref.clip.appendChild(R),t.dispatch("DID_IMAGE_PREVIEW_DRAW",{id:a})}}),mixins:{styles:["scaleX","scaleY","opacity"],animations:{scaleX:a,scaleY:a,opacity:{type:"tween",duration:750}}}})},c=function(e,t){t.width=e.width,t.height=e.height;var r=t.getContext("2d");r.drawImage(e,0,0)},u=function(e){return e.utils.createView({name:"image-preview-overlay",tag:"canvas",ignoreRect:!0,create:function(e){var t=e.root,r=e.props;c(r.template,t.element)},mixins:{styles:["opacity"],animations:{opacity:{type:"spring",mass:25}}}})},l=function(){self.onmessage=function(t){e(t.data.message,function(e){self.postMessage({id:t.data.id,message:e},[e])})};var e=function(e,t){fetch(e.file).then(function(e){return e.blob()}).then(function(e){return createImageBitmap(e)}).then(function(e){return t(e)})}},d=function(e,t){var r=new Image;r.onload=function(){var e=r.naturalWidth,n=r.naturalHeight;r=null,t(e,n)},r.src=e},s=function(e){return-.5*(Math.cos(Math.PI*e)-1)},f=function(e,t){for(var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:1,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:s,i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:10,a=arguments.length>5&&void 0!==arguments[5]?arguments[5]:0,o=1-a,c=t.join(","),u=0;u<=i;u++){var l=u/i,d=a+o*l;e.addColorStop(d,"rgba("+c+", "+n(l)*r+")")}},E=function(e,t,r,n,i){e.width=t,e.height=r;var a=e.getContext("2d"),o=.5*t,c=a.createRadialGradient(o,r+110,r-100,o,r+110,r+100);f(c,n,i,void 0,8,.4),a.save(),a.translate(.5*-t,0),a.scale(2,1),a.fillStyle=c,a.fillRect(0,0,t,r),a.restore()},h=500,p=200,v=document.createElement("canvas"),I=document.createElement("canvas"),_=document.createElement("canvas");E(v,h,p,[40,40,40],.85),E(I,h,p,[196,78,71],1),E(_,h,p,[54,151,99],1);var m=function(e){var t=u(e),r=function(t){var r=t.root,n=t.props,i=e.utils,a=(i.createView,i.createWorker),o=i.loadImage,c=n.id,u=r.query("GET_ITEM",c),s=URL.createObjectURL(u.file),f=function(e,t,r,n){o(s).then(E)},E=function(e){URL.revokeObjectURL(s),r.dispatch("DID_IMAGE_PREVIEW_LOAD",{id:c,data:e})};d(s,function(e,t){if(r.dispatch("DID_IMAGE_PREVIEW_CALCULATE_SIZE",{id:c,width:e,height:t}),"createImageBitmap"in window){var n=a(l);n.post({file:s},function(e){return n.terminate(),e?void E(e):void f(u)})}else f(u)})},n=function(e){var t=e.root;t.ref.overlayShadow.opacity=1},i=function(e){var t=e.root,r=t.ref.image;r.scaleX=1,r.scaleY=1,r.opacity=1},a=function(e){var t=e.root;t.ref.overlayShadow.opacity=1,t.ref.overlayError.opacity=0,t.ref.overlaySuccess.opacity=0},c=function(e){var t=e.root;t.ref.overlayShadow.opacity=.25,t.ref.overlayError.opacity=1},s=function(e){var t=e.root;t.ref.overlayShadow.opacity=.25,t.ref.overlaySuccess.opacity=1},f=function(r){var n=r.root,i=r.props,a=o(e);n.ref.image=n.appendChildView(n.createChildView(a,{id:i.id,scaleX:1.25,scaleY:1.25,opacity:0})),n.ref.overlayShadow=n.appendChildView(n.createChildView(t,{template:v,opacity:0})),n.ref.overlaySuccess=n.appendChildView(n.createChildView(t,{template:_,opacity:0})),n.ref.overlayError=n.appendChildView(n.createChildView(t,{template:I,opacity:0}))};return e.utils.createView({name:"image-preview-wrapper",create:f,write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:n,DID_IMAGE_PREVIEW_DRAW:i,DID_IMAGE_PREVIEW_CONTAINER_CREATE:r,DID_THROW_ITEM_LOAD_ERROR:c,DID_THROW_ITEM_PROCESSING_ERROR:c,DID_THROW_ITEM_INVALID:c,DID_COMPLETE_ITEM_PROCESSING:s,DID_START_ITEM_PROCESSING:a,DID_REVERT_ITEM_PROCESSING:a})})},y=function(t){var r=t.addFilter,n=t.utils,i=n.Type,a=n.createRoute,o=m(t);return r("CREATE_VIEW",function(t){var r=t.is,n=t.view,i=t.query;if(r("file")&&i("GET_ALLOW_IMAGE_PREVIEW")){var c=function(t){var r=t.root,a=t.props,c=a.id,u=i("GET_ITEM",c);if(u){var l=u.file;if(e(l)){var d="createImageBitmap"in(window||{}),s=i("GET_IMAGE_PREVIEW_MAX_FILE_SIZE");!d&&s&&l.size>s||(r.ref.imagePreview=n.appendChildView(n.createChildView(o,{id:c})),r.dispatch("DID_IMAGE_PREVIEW_CONTAINER_CREATE",{id:c}))}}},u=function(e){var t=e.root,r=e.props,n=e.action,i=t.query("GET_ITEM",{id:r.id}),a=i.getMetadata("exif")||{},o=a.orientation||-1,c=n.width,u=n.height;if(o>=5&&o<=8){var l=[u,c];c=l[0],u=l[1]}var d=i.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:u/c},s=t.query("GET_IMAGE_PREVIEW_HEIGHT"),f=t.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),E=t.query("GET_IMAGE_PREVIEW_MAX_HEIGHT");u=null!==s?s:Math.max(f,Math.min(u,E)),c=u/d.aspectRatio,c>t.rect.element.width&&(c=t.rect.element.width,u=c*d.aspectRatio),t.ref.imagePreview.element.style.cssText="height:"+Math.round(u)+"px"};n.registerWriter(a({DID_LOAD_ITEM:c,DID_IMAGE_PREVIEW_CALCULATE_SIZE:u}))}}),{options:{allowImagePreview:[!0,i.BOOLEAN],imagePreviewHeight:[null,i.INT],imagePreviewMinHeight:[44,i.INT],imagePreviewMaxHeight:[256,i.INT],imagePreviewMaxFileSize:[null,i.INT]}}};return document&&document.dispatchEvent(new CustomEvent("FilePond:pluginloaded",{detail:y})),y});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.FilePondPluginImagePreview=t()}(this,function(){"use strict";var e=function(e){return/^image/.test(e.type)&&!/svg/.test(e.type)},t=(function(){function e(e){this.value=e}function t(t){function r(e,t){return new Promise(function(r,i){var c={key:e,arg:t,resolve:r,reject:i,next:null};o?o=o.next=c:(a=o=c,n(e,t))})}function n(r,a){try{var o=t[r](a),c=o.value;c instanceof e?Promise.resolve(c.value).then(function(e){n("next",e)},function(e){n("throw",e)}):i(o.done?"return":"normal",o.value)}catch(u){i("throw",u)}}function i(e,t){switch(e){case"return":a.resolve({value:t,done:!0});break;case"throw":a.reject(t);break;default:a.resolve({value:t,done:!1})}a=a.next,a?n(a.key,a.arg):o=null}var a,o;this._invoke=r,"function"!=typeof t["return"]&&(this["return"]=void 0)}return"function"==typeof Symbol&&Symbol.asyncIterator&&(t.prototype[Symbol.asyncIterator]=function(){return this}),t.prototype.next=function(e){return this._invoke("next",e)},t.prototype["throw"]=function(e){return this._invoke("throw",e)},t.prototype["return"]=function(e){return this._invoke("return",e)},{wrap:function(e){return function(){return new t(e.apply(this,arguments))}},await:function(t){return new e(t)}}}(),function(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)}),r={1:function(){return[1,0,0,1,0,0]},2:function(e){return[-1,0,0,1,e,0]},3:function(e,t){return[-1,0,0,-1,e,t]},4:function(e,t){return[1,0,0,-1,0,t]},5:function(){return[0,1,1,0,0,0]},6:function(e,t){return[0,1,-1,0,t,0]},7:function(e,t){return[0,-1,-1,0,t,e]},8:function(e){return[0,-1,1,0,0,e]}},n=function(e,n,i,a){a!==-1&&e.transform.apply(e,t(r[a](n,i)))},i=function(e,t,r,i){if(t=Math.round(t),r=Math.round(r),i>=5&&i<=8){var a=[r,t];t=a[0],r=a[1]}var o=document.createElement("canvas"),c=o.getContext("2d");return i>=5&&i<=8?(o.width=r,o.height=t):(o.width=t,o.height=r),c.save(),n(c,t,r,i),c.drawImage(e,0,0,t,r),c.restore(),"close"in e&&e.close(),o},a={type:"spring",stiffness:.5,damping:.45,mass:10},o=function(e){return e.utils.createView({name:"image-preview",tag:"div",ignoreRect:!0,create:function(e){var t=e.root;t.ref.clip=document.createElement("div"),t.element.appendChild(t.ref.clip)},write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:function(e){var t=e.root,r=e.props,n=e.action,a=r.id,o=t.query("GET_ITEM",{id:r.id}),c=o.getMetadata("exif")||{},u=c.orientation||-1,l=n.data,d=l.width,s=l.height;if(u>=5&&u<=8){var f=[s,d];d=f[0],s=f[1]}var E=o.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:s/d},h=window.devicePixelRatio,p=t.query("GET_IMAGE_PREVIEW_HEIGHT"),v=t.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),I=t.query("GET_IMAGE_PREVIEW_MAX_HEIGHT"),_=t.rect.inner.width,m=s/d,y=_,w=_*m,g=null!==p?p:Math.max(v,Math.min(s,I)),M=g/m,R=i(n.data,M*h,g*h,u),T=null!==p?p:Math.max(v,Math.min(_*E.aspectRatio,I)),A=T/E.aspectRatio;A>y&&(A=y,T=A*E.aspectRatio);var D=T/(w*E.rect.height);d=y*D,s=w*D;var G=-E.rect.x*y*D,P=-E.rect.y*w*D;t.ref.clip.style.cssText="\n width: "+Math.round(A)+"px;\n height: "+Math.round(T)+"px;\n ",R.style.cssText="\n width: "+Math.round(d)+"px;\n height: "+Math.round(s)+"px;\n transform: translate("+Math.round(G)+"px, "+Math.round(P)+"px) rotateZ(0.00001deg);\n ",t.ref.clip.appendChild(R),t.dispatch("DID_IMAGE_PREVIEW_DRAW",{id:a})}}),mixins:{styles:["scaleX","scaleY","opacity"],animations:{scaleX:a,scaleY:a,opacity:{type:"tween",duration:750}}}})},c=function(e,t){t.width=e.width,t.height=e.height;var r=t.getContext("2d");r.drawImage(e,0,0)},u=function(e){return e.utils.createView({name:"image-preview-overlay",tag:"canvas",ignoreRect:!0,create:function(e){var t=e.root,r=e.props;c(r.template,t.element)},mixins:{styles:["opacity"],animations:{opacity:{type:"spring",mass:25}}}})},l=function(){self.onmessage=function(t){e(t.data.message,function(e){self.postMessage({id:t.data.id,message:e},[e])})};var e=function(e,t){fetch(e.file).then(function(e){return e.blob()}).then(function(e){return createImageBitmap(e)}).then(function(e){return t(e)})}},d=function(e,t){var r=new Image;r.onload=function(){var e=r.naturalWidth,n=r.naturalHeight;r=null,t(e,n)},r.src=e},s=function(e){return-.5*(Math.cos(Math.PI*e)-1)},f=function(e,t){for(var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:1,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:s,i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:10,a=arguments.length>5&&void 0!==arguments[5]?arguments[5]:0,o=1-a,c=t.join(","),u=0;u<=i;u++){var l=u/i,d=a+o*l;e.addColorStop(d,"rgba("+c+", "+n(l)*r+")")}},E=function(e,t,r,n,i){e.width=t,e.height=r;var a=e.getContext("2d"),o=.5*t,c=a.createRadialGradient(o,r+110,r-100,o,r+110,r+100);f(c,n,i,void 0,8,.4),a.save(),a.translate(.5*-t,0),a.scale(2,1),a.fillStyle=c,a.fillRect(0,0,t,r),a.restore()},h=500,p=200,v=document.createElement("canvas"),I=document.createElement("canvas"),_=document.createElement("canvas");E(v,h,p,[40,40,40],.85),E(I,h,p,[196,78,71],1),E(_,h,p,[54,151,99],1);var m=function(e){var t=u(e),r=function(t){var r=t.root,n=t.props,i=e.utils,a=(i.createView,i.createWorker),o=i.loadImage,c=n.id,u=r.query("GET_ITEM",c),s=URL.createObjectURL(u.file),f=function(e,t,r,n){o(s).then(E)},E=function(e){URL.revokeObjectURL(s),r.dispatch("DID_IMAGE_PREVIEW_LOAD",{id:c,data:e})};d(s,function(e,t){if(r.dispatch("DID_IMAGE_PREVIEW_CALCULATE_SIZE",{id:c,width:e,height:t}),"createImageBitmap"in window){var n=a(l);n.post({file:s},function(e){return n.terminate(),e?void E(e):void f(u)})}else f(u)})},n=function(e){var t=e.root;t.ref.overlayShadow.opacity=1},i=function(e){var t=e.root,r=t.ref.image;r.scaleX=1,r.scaleY=1,r.opacity=1},a=function(e){var t=e.root;t.ref.overlayShadow.opacity=1,t.ref.overlayError.opacity=0,t.ref.overlaySuccess.opacity=0},c=function(e){var t=e.root;t.ref.overlayShadow.opacity=.25,t.ref.overlayError.opacity=1},s=function(e){var t=e.root;t.ref.overlayShadow.opacity=.25,t.ref.overlaySuccess.opacity=1},f=function(r){var n=r.root,i=r.props,a=o(e);n.ref.image=n.appendChildView(n.createChildView(a,{id:i.id,scaleX:1.25,scaleY:1.25,opacity:0})),n.ref.overlayShadow=n.appendChildView(n.createChildView(t,{template:v,opacity:0})),n.ref.overlaySuccess=n.appendChildView(n.createChildView(t,{template:_,opacity:0})),n.ref.overlayError=n.appendChildView(n.createChildView(t,{template:I,opacity:0}))};return e.utils.createView({name:"image-preview-wrapper",create:f,write:e.utils.createRoute({DID_IMAGE_PREVIEW_LOAD:n,DID_IMAGE_PREVIEW_DRAW:i,DID_IMAGE_PREVIEW_CONTAINER_CREATE:r,DID_THROW_ITEM_LOAD_ERROR:c,DID_THROW_ITEM_PROCESSING_ERROR:c,DID_THROW_ITEM_INVALID:c,DID_COMPLETE_ITEM_PROCESSING:s,DID_START_ITEM_PROCESSING:a,DID_REVERT_ITEM_PROCESSING:a})})},y=function(t){var r=t.addFilter,n=t.utils,i=n.Type,a=n.createRoute,o=m(t);return r("CREATE_VIEW",function(t){var r=t.is,n=t.view,i=t.query;if(r("file")&&i("GET_ALLOW_IMAGE_PREVIEW")){var c=function(t){var r=t.root,a=t.props,c=a.id,u=i("GET_ITEM",c);if(u){var l=u.file;if(e(l)){var d="createImageBitmap"in(window||{}),s=i("GET_IMAGE_PREVIEW_MAX_FILE_SIZE");!d&&s&&l.size>s||(r.ref.imagePreview=n.appendChildView(n.createChildView(o,{id:c})),r.dispatch("DID_IMAGE_PREVIEW_CONTAINER_CREATE",{id:c}))}}},u=function(e){var t=e.root,r=e.props,n=e.action,i=t.query("GET_ITEM",{id:r.id}),a=i.getMetadata("exif")||{},o=a.orientation||-1,c=n.width,u=n.height;if(o>=5&&o<=8){var l=[u,c];c=l[0],u=l[1]}var d=i.getMetadata("crop")||{rect:{x:0,y:0,width:1,height:1},aspectRatio:u/c},s=t.query("GET_IMAGE_PREVIEW_HEIGHT"),f=t.query("GET_IMAGE_PREVIEW_MIN_HEIGHT"),E=t.query("GET_IMAGE_PREVIEW_MAX_HEIGHT");u=null!==s?s:Math.max(f,Math.min(u,E)),c=u/d.aspectRatio,c>t.rect.element.width&&(c=t.rect.element.width,u=c*d.aspectRatio),t.ref.imagePreview.element.style.cssText="height:"+Math.round(u)+"px"};n.registerWriter(a({DID_LOAD_ITEM:c,DID_IMAGE_PREVIEW_CALCULATE_SIZE:u}))}}),{options:{allowImagePreview:[!0,i.BOOLEAN],imagePreviewHeight:[null,i.INT],imagePreviewMinHeight:[44,i.INT],imagePreviewMaxHeight:[256,i.INT],imagePreviewMaxFileSize:[null,i.INT]}}};return document&&document.dispatchEvent(new CustomEvent("FilePond:pluginloaded",{detail:y})),y});

4

package.json
{
"name": "filepond-plugin-image-preview",
"version": "1.0.5",
"version": "1.0.6",
"description": "Image Preview Plugin for FilePond",

@@ -14,2 +14,2 @@ "homepage": "https://pqina.nl/filepond",

}
}
}
dist/filepond-plugin-image-preview.css

Sorry, the diff of this file is not supported yet

dist/filepond-plugin-image-preview.min.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc