vue3-image-box/dist/js/app.cc47c103.js

A simple image lightbox component for vue3.0

(function(e){function t(t){for(var c,s,a=t[0],i=t[1],p=t[2],u=0,b=[];u<a.length;u++)s=a[u],Object.prototype.hasOwnProperty.call(o,s)&&o[s]&&b.push(o[s][0]),o[s]=0;for(c in i)Object.prototype.hasOwnProperty.call(i,c)&&(e[c]=i[c]);r&&r(t);while(b.length)b.shift()();return l.push.apply(l,p||[]),n()}function n(){for(var e,t=0;t<l.length;t++){for(var n=l[t],c=!0,a=1;a<n.length;a++){var i=n[a];0!==o[i]&&(c=!1)}c&&(l.splice(t--,1),e=s(s.s=n[0]))}return e}var c={},o={app:0},l=[];function s(t){if(c[t])return c[t].exports;var n=c[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,s),n.l=!0,n.exports}s.m=e,s.c=c,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},s.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(s.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var c in e)s.d(n,c,function(t){return e[t]}.bind(null,c));return n},s.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="/";var a=window["webpackJsonp"]=window["webpackJsonp"]||[],i=a.push.bind(a);a.push=t,a=a.slice();for(var p=0;p<a.length;p++)t(a[p]);var r=i;l.push([0,"chunk-vendors"]),n()})({0:function(e,t,n){e.exports=n("56d7")},"56d7":function(e,t,n){"use strict";n.r(t);n("e260"),n("e6cf"),n("cca6"),n("a79d");var c=n("7a23");function o(e,t,n,o,l,s){var a=Object(c["l"])("image-box");return Object(c["g"])(),Object(c["c"])(a,{"images-list-class":"flex",images:e.images},null,8,["images"])}var l=Object(c["n"])("data-v-24c04290");Object(c["i"])("data-v-24c04290");var s={key:0,class:"vue-lb-container",style:{"touch-action":"pan-y","user-select":"none","-webkit-user-drag":"none","-webkit-tap-highlight-color":"rgba(0, 0, 0, 0)"}},a={class:"vue-lb-content"},i={class:"vue-lb-header"},p=Object(c["e"])("span",null,null,-1),r=Object(c["e"])("span",null,[Object(c["e"])("svg",{fill:"white",x:"0px",y:"0px",width:"100%",height:"100%",viewBox:"0 0 512 512"},[Object(c["e"])("path",{d:"M443.6,387.1L312.4,255.4l131.5-130c5.4-5.4,5.4-14.2,0-19.6l-37.4-37.6c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4 L256,197.8L124.9,68.3c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4L68,105.9c-5.4,5.4-5.4,14.2,0,19.6l131.5,130L68.4,387.1 c-2.6,2.6-4.1,6.1-4.1,9.8c0,3.7,1.4,7.2,4.1,9.8l37.4,37.6c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1L256,313.1l130.7,131.1 c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1l37.4-37.6c2.6-2.6,4.1-6.1,4.1-9.8C447.7,393.2,446.2,389.7,443.6,387.1z"})])],-1),u={class:"vue-lb-figure"},b={class:"vue-lb-footer"},h=Object(c["e"])("div",{class:"vue-lb-footer-info"},null,-1),d={class:"vue-lb-footer-count"},f={class:"vue-lb-thumbnail-wrapper"},m={class:"vue-lb-thumbnail"},v=Object(c["e"])("span",null,[Object(c["e"])("svg",{fill:"white",x:"0px",y:"0px",width:"100%",height:"100%",viewBox:"0 0 512 512"},[Object(c["e"])("path",{d:"M213.7,256L213.7,256L213.7,256L380.9,81.9c4.2-4.3,4.1-11.4-0.2-15.8l-29.9-30.6c-4.3-4.4-11.3-4.5-15.5-0.2L131.1,247.9 c-2.2,2.2-3.2,5.2-3,8.1c-0.1,3,0.9,5.9,3,8.1l204.2,212.7c4.2,4.3,11.2,4.2,15.5-0.2l29.9-30.6c4.3-4.4,4.4-11.5,0.2-15.8 L213.7,256z"})])],-1),g=Object(c["e"])("span",null,[Object(c["e"])("svg",{fill:"white",x:"0px",y:"0px",width:"100%",height:"100%",viewBox:"0 0 512 512"},[Object(c["e"])("path",{d:"M298.3,256L298.3,256L298.3,256L131.1,81.9c-4.2-4.3-4.1-11.4,0.2-15.8l29.9-30.6c4.3-4.4,11.3-4.5,15.5-0.2l204.2,212.7 c2.2,2.2,3.2,5.2,3,8.1c0.1,3-0.9,5.9-3,8.1L176.7,476.8c-4.2,4.3-11.2,4.2-15.5-0.2L131.3,446c-4.3-4.4-4.4-11.5-0.2-15.8 L298.3,256z"})])],-1),j=Object(c["e"])("span",null,[Object(c["e"])("svg",{fill:"white",x:"0px",y:"0px",width:"100%",height:"100%",viewBox:"0 0 512 512"},[Object(c["e"])("path",{d:"M213.7,256L213.7,256L213.7,256L380.9,81.9c4.2-4.3,4.1-11.4-0.2-15.8l-29.9-30.6c-4.3-4.4-11.3-4.5-15.5-0.2L131.1,247.9 c-2.2,2.2-3.2,5.2-3,8.1c-0.1,3,0.9,5.9,3,8.1l204.2,212.7c4.2,4.3,11.2,4.2,15.5-0.2l29.9-30.6c4.3-4.4,4.4-11.5,0.2-15.8 L213.7,256z"})])],-1),O=Object(c["e"])("span",null,[Object(c["e"])("svg",{fill:"white",x:"0px",y:"0px",width:"100%",height:"100%",viewBox:"0 0 512 512","xml:space":"preserve"},[Object(c["e"])("path",{d:"M298.3,256L298.3,256L298.3,256L131.1,81.9c-4.2-4.3-4.1-11.4,0.2-15.8l29.9-30.6c4.3-4.4,11.3-4.5,15.5-0.2l204.2,212.7 c2.2,2.2,3.2,5.2,3,8.1c0.1,3-0.9,5.9-3,8.1L176.7,476.8c-4.2,4.3-11.2,4.2-15.5-0.2L131.3,446c-4.3-4.4-4.4-11.5-0.2-15.8 L298.3,256z"})])],-1);Object(c["h"])();var x=l((function(e,t,n,o,l,x){return Object(c["g"])(),Object(c["c"])(c["a"],null,[Object(c["e"])("div",{class:e.imagesListClass},[(Object(c["g"])(!0),Object(c["c"])(c["a"],null,Object(c["k"])(e.images,(function(t,n){return Object(c["g"])(),Object(c["c"])("div",{key:n},[Object(c["e"])("img",{src:t.thumb,onClick:function(c){return e.selected(n,t.src,t.caption)}},null,8,["src","onClick"])])})),128))],2),e.state.show?(Object(c["g"])(),Object(c["c"])("div",s,[Object(c["e"])("div",a,[Object(c["e"])("div",i,[p,Object(c["e"])("button",{type:"button",title:"Close (Esc)",class:"vue-lb-button-close",onClick:t[1]||(t[1]=function(t){return e.state.show=!1})},[r])]),Object(c["e"])("div",u,[Object(c["e"])("img",{class:"vue-lb-modal-image",src:e.state.selectedImgPath,onTouchstart:t[2]||(t[2]=function(){return e.touchStart.apply(e,arguments)}),onTouchend:t[3]||(t[3]=function(){return e.touchEnd.apply(e,arguments)})},null,40,["src"]),Object(c["e"])("div",{class:"vue-lb-info",innerHTML:e.state.selectedCaption},null,8,["innerHTML"]),Object(c["e"])("div",b,[h,Object(c["e"])("div",d,Object(c["m"])(e.state.selectedIndex+1)+" / "+Object(c["m"])(e.images.length),1)])])]),Object(c["e"])("div",f,[Object(c["e"])("div",m,[Object(c["e"])("button",{type:"button",title:"Previous",class:"vue-lb-thumbnail-arrow vue-lb-thumbnail-left",onClick:t[4]||(t[4]=function(){return e.prev.apply(e,arguments)})},[v]),(Object(c["g"])(!0),Object(c["c"])(c["a"],null,Object(c["k"])(e.images,(function(t,n){return Object(c["g"])(),Object(c["c"])("div",{key:n,class:"vue-lb-modal-thumbnail",lazy:"loaded",aaa:n,bbb:e.state.selectedIndex,style:{"background-image":"url('"+t.thumb+"')",display:n<5&&e.state.selectedIndex<3||e.state.selectedIndex>e.images.length-5&&e.images.length-n<=5&&n<=e.state.selectedIndex+2||n>=e.state.selectedIndex-2&&n<=e.state.selectedIndex+2?"":"none"},onClick:function(c){return e.selected(n,t.src,t.caption)}},null,12,["aaa","bbb","onClick"])})),128)),Object(c["e"])("button",{type:"button",title:"Next",class:"vue-lb-thumbnail-arrow vue-lb-thumbnail-right",onClick:t[5]||(t[5]=function(){return e.next.apply(e,arguments)})},[g])])]),Object(c["e"])("button",{type:"button",title:"Previous",class:"vue-lb-arrow vue-lb-left",onClick:t[6]||(t[6]=function(){return e.prev.apply(e,arguments)})},[j]),Object(c["e"])("button",{type:"button",title:"Next",class:"vue-lb-arrow vue-lb-right",onClick:t[7]||(t[7]=function(){return e.next.apply(e,arguments)})},[O])])):Object(c["d"])("",!0)],64)})),y=Object(c["f"])({name:"my-image-box",props:{imagesListClass:{type:String,default:""},images:{type:Array,default:function(){return[]}}},setup:function(e){var t=Object(c["j"])({show:!1,isChanging:!1,selectedIndex:1,selectedImgPath:"",selectedCaption:""}),n=function(e,n,c){t.selectedIndex=e,t.selectedImgPath=n,t.selectedCaption=c,t.show=!0},o=function(){if(0==t.selectedIndex)return!1;var n=t.selectedIndex-1;t.selectedIndex=n,t.selectedImgPath=e.images[n].src,t.selectedCaption=e.images[n].caption},l=function(){if(t.selectedIndex==e.images.length-1)return!1;var n=t.selectedIndex+1;t.selectedIndex=n,t.selectedImgPath=e.images[n].src,t.selectedCaption=e.images[n].caption},s=Object(c["j"])({startX:0}),a=function(e){s.startX=e.changedTouches[0].clientX},i=function(e){e.changedTouches[0].clientX>s.startX?o():l(),s.startX=0};return{state:t,selected:n,prev:o,next:l,touchStart:a,touchEnd:i}}});n("ac64");y.render=x,y.__scopeId="data-v-24c04290";var w=y,L=Object(c["f"])({name:"App",components:{ImageBox:w},setup:function(){var e=[{thumb:"https://nihonnleo.appspot.com/f/3/",src:"https://nihonnleo.appspot.com/f/3/",caption:"1"},{thumb:"https://nihonnleo.appspot.com/f/4/",src:"https://nihonnleo.appspot.com/f/4/",caption:"2"},{thumb:"https://nihonnleo.appspot.com/f/5/",src:"https://nihonnleo.appspot.com/f/5/",caption:"3"},{thumb:"https://nihonnleo.appspot.com/f/6/",src:"https://nihonnleo.appspot.com/f/6/",caption:"4"},{thumb:"https://nihonnleo.appspot.com/f/7/",src:"https://nihonnleo.appspot.com/f/7/",caption:"5"},{thumb:"https://nihonnleo.appspot.com/f/8/",src:"https://nihonnleo.appspot.com/f/8/",caption:"6"},{thumb:"https://nihonnleo.appspot.com/f/3/",src:"https://nihonnleo.appspot.com/f/3/",caption:"7"},{thumb:"https://nihonnleo.appspot.com/f/4/",src:"https://nihonnleo.appspot.com/f/4/",caption:"8"},{thumb:"https://nihonnleo.appspot.com/f/5/",src:"https://nihonnleo.appspot.com/f/5/",caption:"9"},{thumb:"https://nihonnleo.appspot.com/f/6/",src:"https://nihonnleo.appspot.com/f/6/",caption:"10"},{thumb:"https://nihonnleo.appspot.com/f/7/",src:"https://nihonnleo.appspot.com/f/7/",caption:"11"},{thumb:"https://nihonnleo.appspot.com/f/8/",src:"https://nihonnleo.appspot.com/f/8/",caption:"12"}];return{images:e}}});n("64be");L.render=o;var I=L;Object(c["b"])(I).mount("#app")},"64be":function(e,t,n){"use strict";n("c894")},ac64:function(e,t,n){"use strict";n("ed3d")},c894:function(e,t,n){},ed3d:function(e,t,n){}});
//# sourceMappingURL=app.cc47c103.js.map