v-viewer
Version:
Image viewer component for vue, supports rotation, scale, zoom and so on, based on viewer.js
2 lines (1 loc) • 12.1 kB
JavaScript
var VueViewer=function(p,ve,g){"use strict";const w=(e=>e&&typeof e=="object"&&"default"in e?e:{default:e})(ve);var me=typeof global=="object"&&global&&global.Object===Object&&global;const R=me;var he=typeof self=="object"&&self&&self.Object===Object&&self,we=R||he||Function("return this")();const A=we;var Te=A.Symbol;const I=Te;var K=Object.prototype,$e=K.hasOwnProperty,Oe=K.toString,j=I?I.toStringTag:void 0;function _e(e){var t=$e.call(e,j),r=e[j];try{e[j]=void 0;var n=!0}catch{}var i=Oe.call(e);return n&&(t?e[j]=r:delete e[j]),i}var je=Object.prototype,Pe=je.toString;function Se(e){return Pe.call(e)}var Ae="[object Null]",Ie="[object Undefined]",G=I?I.toStringTag:void 0;function E(e){return e==null?e===void 0?Ie:Ae:G&&G in Object(e)?_e(e):Se(e)}function M(e){return e!=null&&typeof e=="object"}var Ee="[object Symbol]";function Me(e){return typeof e=="symbol"||M(e)&&E(e)==Ee}var Ve=Array.isArray;const xe=Ve;var Ce=/\s/;function Be(e){for(var t=e.length;t--&&Ce.test(e.charAt(t)););return t}var Ue=/^\s+/;function De(e){return e&&e.slice(0,Be(e)+1).replace(Ue,"")}function h(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var H=0/0,Fe=/^[-+]0x[0-9a-f]+$/i,Ne=/^0b[01]+$/i,Le=/^0o[0-7]+$/i,We=parseInt;function q(e){if(typeof e=="number")return e;if(Me(e))return H;if(h(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=h(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=De(e);var r=Ne.test(e);return r||Le.test(e)?We(e.slice(2),r?2:8):Fe.test(e)?H:+e}function J(e){return e}var Re="[object AsyncFunction]",Ke="[object Function]",Ge="[object GeneratorFunction]",He="[object Proxy]";function X(e){if(!h(e))return!1;var t=E(e);return t==Ke||t==Ge||t==Re||t==He}var qe=A["__core-js_shared__"];const B=qe;var k=function(){var e=/[^.]+$/.exec(B&&B.keys&&B.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""}();function Je(e){return!!k&&k in e}var Xe=Function.prototype,ke=Xe.toString;function ze(e){if(e!=null){try{return ke.call(e)}catch{}try{return e+""}catch{}}return""}var Qe=/[\\^$.*+?()[\]{}|]/g,Ye=/^\[object .+?Constructor\]$/,Ze=Function.prototype,et=Object.prototype,tt=Ze.toString,rt=et.hasOwnProperty,nt=RegExp("^"+tt.call(rt).replace(Qe,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");function it(e){if(!h(e)||Je(e))return!1;var t=X(e)?nt:Ye;return t.test(ze(e))}function at(e,t){return e==null?void 0:e[t]}function ot(e,t){var r=at(e,t);return it(r)?r:void 0}function ut(e,t,r){switch(r.length){case 0:return e.call(t);case 1:return e.call(t,r[0]);case 2:return e.call(t,r[0],r[1]);case 3:return e.call(t,r[0],r[1],r[2])}return e.apply(t,r)}var ct=800,ft=16,st=Date.now;function dt(e){var t=0,r=0;return function(){var n=st(),i=ft-(n-r);if(r=n,i>0){if(++t>=ct)return arguments[0]}else t=0;return e.apply(void 0,arguments)}}function lt(e){return function(){return e}}var gt=function(){try{var e=ot(Object,"defineProperty");return e({},"",{}),e}catch{}}();const V=gt;var yt=V?function(e,t){return V(e,"toString",{configurable:!0,enumerable:!1,value:lt(t),writable:!0})}:J,pt=dt(yt);const bt=pt;var vt=9007199254740991,mt=/^(?:0|[1-9]\d*)$/;function z(e,t){var r=typeof e;return t=t==null?vt:t,!!t&&(r=="number"||r!="symbol"&&mt.test(e))&&e>-1&&e%1==0&&e<t}function Q(e,t,r){t=="__proto__"&&V?V(e,t,{configurable:!0,enumerable:!0,value:r,writable:!0}):e[t]=r}function U(e,t){return e===t||e!==e&&t!==t}var ht=Object.prototype,wt=ht.hasOwnProperty;function Y(e,t,r){var n=e[t];(!(wt.call(e,t)&&U(n,r))||r===void 0&&!(t in e))&&Q(e,t,r)}function Tt(e,t,r,n){var i=!r;r||(r={});for(var u=-1,f=t.length;++u<f;){var o=t[u],d=n?n(r[o],e[o],o,r,e):void 0;d===void 0&&(d=e[o]),i?Q(r,o,d):Y(r,o,d)}return r}var Z=Math.max;function $t(e,t,r){return t=Z(t===void 0?e.length-1:t,0),function(){for(var n=arguments,i=-1,u=Z(n.length-t,0),f=Array(u);++i<u;)f[i]=n[t+i];i=-1;for(var o=Array(t+1);++i<t;)o[i]=n[i];return o[t]=r(f),ut(e,this,o)}}function ee(e,t){return bt($t(e,t,J),e+"")}var Ot=9007199254740991;function te(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=Ot}function x(e){return e!=null&&te(e.length)&&!X(e)}function re(e,t,r){if(!h(r))return!1;var n=typeof t;return(n=="number"?x(r)&&z(t,r.length):n=="string"&&t in r)?U(r[t],e):!1}function _t(e){return ee(function(t,r){var n=-1,i=r.length,u=i>1?r[i-1]:void 0,f=i>2?r[2]:void 0;for(u=e.length>3&&typeof u=="function"?(i--,u):void 0,f&&re(r[0],r[1],f)&&(u=i<3?void 0:u,i=1),t=Object(t);++n<i;){var o=r[n];o&&e(t,o,n,u)}return t})}var jt=Object.prototype;function D(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||jt;return e===r}function Pt(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}var St="[object Arguments]";function ne(e){return M(e)&&E(e)==St}var ie=Object.prototype,At=ie.hasOwnProperty,It=ie.propertyIsEnumerable,Et=ne(function(){return arguments}())?ne:function(e){return M(e)&&At.call(e,"callee")&&!It.call(e,"callee")};const Mt=Et;function Vt(){return!1}var ae=typeof p=="object"&&p&&!p.nodeType&&p,oe=ae&&typeof module=="object"&&module&&!module.nodeType&&module,xt=oe&&oe.exports===ae,ue=xt?A.Buffer:void 0,Ct=ue?ue.isBuffer:void 0,Bt=Ct||Vt;const Ut=Bt;var Dt="[object Arguments]",Ft="[object Array]",Nt="[object Boolean]",Lt="[object Date]",Wt="[object Error]",Rt="[object Function]",Kt="[object Map]",Gt="[object Number]",Ht="[object Object]",qt="[object RegExp]",Jt="[object Set]",Xt="[object String]",kt="[object WeakMap]",zt="[object ArrayBuffer]",Qt="[object DataView]",Yt="[object Float32Array]",Zt="[object Float64Array]",er="[object Int8Array]",tr="[object Int16Array]",rr="[object Int32Array]",nr="[object Uint8Array]",ir="[object Uint8ClampedArray]",ar="[object Uint16Array]",or="[object Uint32Array]",s={};s[Yt]=s[Zt]=s[er]=s[tr]=s[rr]=s[nr]=s[ir]=s[ar]=s[or]=!0,s[Dt]=s[Ft]=s[zt]=s[Nt]=s[Qt]=s[Lt]=s[Wt]=s[Rt]=s[Kt]=s[Gt]=s[Ht]=s[qt]=s[Jt]=s[Xt]=s[kt]=!1;function ur(e){return M(e)&&te(e.length)&&!!s[E(e)]}function cr(e){return function(t){return e(t)}}var ce=typeof p=="object"&&p&&!p.nodeType&&p,P=ce&&typeof module=="object"&&module&&!module.nodeType&&module,fr=P&&P.exports===ce,F=fr&&R.process,sr=function(){try{var e=P&&P.require&&P.require("util").types;return e||F&&F.binding&&F.binding("util")}catch{}}();const fe=sr;var se=fe&&fe.isTypedArray,dr=se?cr(se):ur;const lr=dr;var gr=Object.prototype,yr=gr.hasOwnProperty;function de(e,t){var r=xe(e),n=!r&&Mt(e),i=!r&&!n&&Ut(e),u=!r&&!n&&!i&&lr(e),f=r||n||i||u,o=f?Pt(e.length,String):[],d=o.length;for(var c in e)(t||yr.call(e,c))&&!(f&&(c=="length"||i&&(c=="offset"||c=="parent")||u&&(c=="buffer"||c=="byteLength"||c=="byteOffset")||z(c,d)))&&o.push(c);return o}function pr(e,t){return function(r){return e(t(r))}}var br=pr(Object.keys,Object);const vr=br;var mr=Object.prototype,hr=mr.hasOwnProperty;function wr(e){if(!D(e))return vr(e);var t=[];for(var r in Object(e))hr.call(e,r)&&r!="constructor"&&t.push(r);return t}function Tr(e){return x(e)?de(e):wr(e)}var $r=Object.prototype,Or=$r.hasOwnProperty,_r=_t(function(e,t){if(D(t)||x(t)){Tt(t,Tr(t),e);return}for(var r in t)Or.call(t,r)&&Y(e,r,t[r])});const jr=_r;function Pr(e){var t=[];if(e!=null)for(var r in Object(e))t.push(r);return t}var Sr=Object.prototype,Ar=Sr.hasOwnProperty;function Ir(e){if(!h(e))return Pr(e);var t=D(e),r=[];for(var n in e)n=="constructor"&&(t||!Ar.call(e,n))||r.push(n);return r}function Er(e){return x(e)?de(e,!0):Ir(e)}var Mr=function(){return A.Date.now()};const N=Mr;var Vr="Expected a function",xr=Math.max,Cr=Math.min;function Br(e,t,r){var n,i,u,f,o,d,c=0,T=!1,a=!1,l=!0;if(typeof e!="function")throw new TypeError(Vr);t=q(t)||0,h(r)&&(T=!!r.leading,a="maxWait"in r,u=a?xr(q(r.maxWait)||0,t):u,l="trailing"in r?!!r.trailing:l);function b(y){var m=n,S=i;return n=i=void 0,c=y,f=e.apply(S,m),f}function v(y){return c=y,o=setTimeout(_,t),T?b(y):f}function $(y){var m=y-d,S=y-c,be=t-m;return a?Cr(be,u-S):be}function O(y){var m=y-d,S=y-c;return d===void 0||m>=t||m<0||a&&S>=u}function _(){var y=N();if(O(y))return C(y);o=setTimeout(_,$(y))}function C(y){return o=void 0,l&&n?b(y):(n=i=void 0,f)}function L(){o!==void 0&&clearTimeout(o),c=0,n=d=i=o=void 0}function Gr(){return o===void 0?f:C(N())}function W(){var y=N(),m=O(y);if(n=arguments,i=this,d=y,m){if(o===void 0)return v(d);if(a)return clearTimeout(o),o=setTimeout(_,t),b(d)}return o===void 0&&(o=setTimeout(_,t)),f}return W.cancel=L,W.flush=Gr,W}var le=Object.prototype,Ur=le.hasOwnProperty,Dr=ee(function(e,t){e=Object(e);var r=-1,n=t.length,i=n>2?t[2]:void 0;for(i&&re(t[0],t[1],i)&&(n=1);++r<n;)for(var u=t[r],f=Er(u),o=-1,d=f.length;++o<d;){var c=f[o],T=e[c];(T===void 0||U(T,le[c])&&!Ur.call(e,c))&&(e[c]=u[c])}return e});const Fr=Dr,ge=({images:e=[],options:t})=>{t=jr(t,{inline:!1});const r=document.createElement("div"),n=g.h("div",{style:{display:"none"},class:["__viewer-token"]},e.map(o=>g.h("img",typeof o=="string"?{src:o}:o)));g.render(n,r);const i=r.firstElementChild;document.body.appendChild(i);const u=new w.default(i,t),f=u.destroy.bind(u);return u.destroy=function(){return f(),g.render(null,r),u},u.show(),i.addEventListener("hidden",function(){this.viewer===u&&u.destroy()}),u},ye=({name:e="viewer",debug:t=!1}={})=>{async function r(a,l,b=!1,v=!1){await g.nextTick(),!(v&&!n(a))&&(b||!a[`$${e}`]?(f(a),a[`$${e}`]=new w.default(a,l),c("Viewer created")):(a[`$${e}`].update(),c("Viewer updated")))}function n(a){const l=a.innerHTML.match(/<img([\w\W]+?)[\\/]?>/g),b=l?l.join(""):void 0;return a.__viewerImageDiffCache===b?(c("Element change detected, but image(s) has not changed"),!1):(c("Image change detected"),a.__viewerImageDiffCache=b,!0)}function i(a,l,b,v){o(a);const $=window.MutationObserver||window.WebKitMutationObserver||window.MozMutationObserver;if(!$){c("Observer not supported");return}const O=new $(C=>{C.forEach(L=>{c(`Viewer mutation:${L.type}`),b(a,l,v,!0)})}),_={attributes:!0,childList:!0,characterData:!0,subtree:!0};O.observe(a,_),a.__viewerMutationObserver=O,c("Observer created")}function u(a,l,b,v){a.__viewerUnwatch=g.watch(()=>l.value,($,O)=>{c("Change detected by watcher: ",l.value),v(a,$,!0,!1)},{deep:!0}),c("Watcher created, expression: ",l.value)}function f(a){!a[`$${e}`]||(a[`$${e}`].destroy(),delete a[`$${e}`],c("Viewer destroyed"))}function o(a){!a.__viewerMutationObserver||(a.__viewerMutationObserver.disconnect(),delete a.__viewerMutationObserver,c("observer destroyed"))}function d(a){!a.__viewerUnwatch||(a.__viewerUnwatch(),delete a.__viewerUnwatch,c("Watcher destroyed"))}function c(...a){t&&console.log(...a)}return{mounted(a,l,b){c("Viewer bind");const v=Br(r,50);v(a,l.value),u(a,l,b,v),l.modifiers.static||i(a,l.value,v,l.modifiers.rebuild)},unmounted(a){c("Viewer unbind"),o(a),d(a),f(a)}}},Nr=g.defineComponent({name:"Viewer",props:{images:{type:Array,default:()=>[]},rebuild:{type:Boolean,default:!1},trigger:{type:Object,default:null},options:{type:Object,default:()=>null}},emits:["inited"],setup(e,{emit:t}){let r;const n=g.ref();function i(){r=new w.default(n.value,e.options),t("inited",r)}function u(){r&&r.destroy()}function f(){u(),i()}function o(){r?(r.update(),t("inited",r)):i()}function d(){e.rebuild?f():o()}const c={deep:!0};return g.watch(()=>e.images,()=>{g.nextTick(()=>{d()})},c),g.watch(()=>e.trigger,()=>{g.nextTick(()=>{d()})},c),g.watch(()=>e.options,()=>{g.nextTick(()=>{f()})},c),g.onMounted(()=>i()),g.onUnmounted(()=>u()),{root:n,createViewer:i,rebuildViewer:f,updateViewer:o,destroyViewer:u}}}),Lr=(e,t)=>{const r=e.__vccOpts||e;for(const[n,i]of t)r[n]=i;return r},Wr={ref:"root"};function Rr(e,t,r,n,i,u){return g.openBlock(),g.createElementBlock("div",Wr,[g.renderSlot(e.$slots,"default",{images:e.images,options:e.options})],512)}const pe=Lr(Nr,[["render",Rr]]),Kr={install(e,{name:t="viewer",debug:r=!1,defaultOptions:n}={}){n&&w.default.setDefaults(n),e.config.globalProperties[`$${t}Api`]=ge,e.component(t,Fr(pe,{name:t})),e.directive(t,ye({name:t,debug:r}))},setDefaults(e){w.default.setDefaults(e)}};return Object.defineProperty(p,"Viewer",{enumerable:!0,get:()=>w.default}),p.api=ge,p.component=pe,p.default=Kr,p.directive=ye,Object.defineProperties(p,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),p}({},Viewer,Vue);