photo-gallery-waterfall

Version:
2 lines (1 loc) • 19.7 kB
JavaScript
var e=Object.assign;import{ref as t,inject as l,watch as a,onMounted as i,onUnmounted as o,openBlock as s,createBlock as r,createVNode as n,withModifiers as u,unref as c,renderSlot as d,createCommentVNode as v,withScopeId as h,nextTick as g,pushScopeId as p,popScopeId as f,computed as m,toDisplayString as b,provide as x,Fragment as w,renderList as y,withDirectives as k,vShow as z,useContext as $,withCtx as H}from"vue";import C from"vue-waterfall-ex";import T from"@better-scroll/core";import S from"@better-scroll/mouse-wheel";import W from"@better-scroll/pull-up";import M from"@better-scroll/slide";var O="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},F=/^\s+|\s+$/g,P=/^[-+]0x[0-9a-f]+$/i,_=/^0b[01]+$/i,I=/^0o[0-7]+$/i,N=parseInt,j="object"==typeof O&&O&&O.Object===Object&&O,E="object"==typeof self&&self&&self.Object===Object&&self,L=j||E||Function("return this")(),R=Object.prototype.toString,A=Math.max,X=Math.min,B=function(){return L.Date.now()};function Y(e,t,l){var a,i,o,s,r,n,u=0,c=!1,d=!1,v=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function h(t){var l=a,o=i;return a=i=void 0,u=t,s=e.apply(o,l)}function g(e){return u=e,r=setTimeout(f,t),c?h(e):s}function p(e){var l=e-n;return void 0===n||l>=t||l<0||d&&e-u>=o}function f(){var e=B();if(p(e))return m(e);r=setTimeout(f,function(e){var l=t-(e-n);return d?X(l,o-(e-u)):l}(e))}function m(e){return r=void 0,v&&a?h(e):(a=i=void 0,s)}function b(){var e=B(),l=p(e);if(a=arguments,i=this,n=e,l){if(void 0===r)return g(n);if(d)return r=setTimeout(f,t),h(n)}return void 0===r&&(r=setTimeout(f,t)),s}return t=q(t)||0,D(l)&&(c=!!l.leading,o=(d="maxWait"in l)?A(q(l.maxWait)||0,t):o,v="trailing"in l?!!l.trailing:v),b.cancel=function(){void 0!==r&&clearTimeout(r),u=0,a=n=i=r=void 0},b.flush=function(){return void 0===r?s:m(B())},b}function D(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function q(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&"[object Symbol]"==R.call(e)}(e))return NaN;if(D(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=D(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(F,"");var l=_.test(e);return l||I.test(e)?N(e.slice(2),l?2:8):P.test(e)?NaN:+e}var U=function(e,t,l){var a=!0,i=!0;if("function"!=typeof e)throw new TypeError("Expected a function");return D(l)&&(a="leading"in l?!!l.leading:a,i="trailing"in l?!!l.trailing:i),Y(e,t,{leading:a,maxWait:t,trailing:i})};const G=h("data-v-5d102ec2"),K={expose:[],props:{imgsArr:{type:Array,required:!0},moreHeight:{type:Number,default:0},pagination:{type:Object,default:()=>({num:1,size:20})}},setup(e){const h=e;let p;T.use(S),T.use(W);let f=null,m=!0,b=Object.assign({},h.pagination);const x=t(l("curr-selected"));t(l("mark-imgs-list"));const w=t(l("scroll-reach-bottom")),y=t(l("scroll-hook")),k=t(null),z=t(null),$=t(0),H=t(0),M=t(0),O=t(0),F=t([]),P=t([]),_=()=>{g((()=>{p&&(p.finishPullUp(),p.refresh())}))},I=()=>{b.num++},N=()=>{P.value=F.value,w.value({num:b.num,size:b.size},I)},j=U((function(e){M.value=e.y}),300),E=U((function(){const{clientWidth:e=0,clientHeight:t=0}=k.value||{};0!==e&&0!==t&&($.value===e&&H.value===t||($.value=e,H.value=t,g((()=>{p&&p.refresh()}))))}),250);return a((()=>x.value),(e=>{z.value.setSelected(e)})),a((()=>h.imgsArr),(e=>{F.value=e,m&&(m=!1,N())})),i((()=>{k.value&&($.value=k.value.clientWidth,H.value=k.value.clientHeight,p=new T(k.value,{pullUpLoad:{threshold:500},mouseWheel:{speed:40,invert:!1,easeTime:1e3},disableMouse:!1,disableTouch:!0,scrollY:!0,probeType:1,momentumLimitTime:1e3}),p.on("pullingUp",N),p.on("scroll",(e=>{y.value(e),j(e)})),N()),ResizeObserver?(f=new ResizeObserver(E),f.observe(k.value)):k.value.addEventListener("resize",E)})),o((()=>{p&&p.destroy(),ResizeObserver?f=null:k.value.removeEventListener("resize",E)})),G(((t,l)=>(s(),r("div",{class:"waterfall-container",ref:k},[n("div",{class:"at-least-one-child",onMousedown:l[1]||(l[1]=u((()=>{}),["right","stop"]))},[$.value>0?(s(),r(c(C),{ref:z,key:O.value,y:M.value,width:$.value,height:H.value,imgsArr:P.value,maxCols:3,imgWidth:300,moreHeight:e.moreHeight,srcKey:"preview",onUpdateComplete:_},{default:G((({data:e})=>[d(t.$slots,"default",{data:e})])),_:1},8,["y","width","height","imgsArr","moreHeight"])):v("",!0)],32)],512))))},__scopeId:"data-v-5d102ec2"};const J=h("data-v-18aedeac");p("data-v-18aedeac");const Q={class:"slot-box"};f();const V={expose:[],props:{size:{type:[Number,String],default:100},lineWidth:{type:[Number,String],default:20},backgroundColor:{type:String,default:"#ffffff"},barColor:{type:String,default:"#4395ff"},fontSize:{type:[Number,String]},fontColor:{type:String,default:"#4395ff"},fontBackgroundColor:{type:String,default:"transparent"},isRound:{type:Boolean,default:!0},isAnimation:{type:Boolean,default:!0},progress:{type:[Number,String],default:50},duration:{type:[String,Number],default:1e3},delay:{type:[String,Number],default:0}},setup(e){const l=e,i=t(null),o=t(m((()=>Math.round((l.size-l.lineWidth)*Math.PI)))),u=t({from:0,to:o.value}),c=t(m((()=>({width:`${l.size}px`,height:`${l.size}px`,padding:`${l.lineWidth}px`})))),v=t(m((()=>({color:l.fontColor,fontSize:`${l.fontSize||.28*l.size}px`,backgroundColor:l.fontBackgroundColor}))));return a((()=>l.progress),(e=>{u.value.from=u.value.to,u.value.to=o.value*(100-e)/100,i.value&&i.value.beginElement()}),{immediate:!0}),J(((t,l)=>(s(),r("div",{class:"circle-progress-container",style:c.value},[(s(),r("svg",{class:"circle-progress",width:e.size,height:e.size,xmlns:"http://www.w3.org/2000/svg"},[n("circle",{r:(e.size-e.lineWidth)/2,cy:e.size/2,cx:e.size/2,"stroke-width":e.lineWidth-2,stroke:e.backgroundColor,fill:"none"},null,8,["r","cy","cx","stroke-width","stroke"]),n("circle",{r:(e.size-e.lineWidth)/2,cy:e.size/2,cx:e.size/2,stroke:e.barColor,"stroke-width":e.lineWidth,"stroke-linecap":e.isRound?"round":"square","stroke-dasharray":o.value,fill:"none"},[n("animate",{ref:i,attributeName:"stroke-dashoffset",from:u.value.from,to:u.value.to,dur:e.isAnimation?`${e.duration}ms`:"0s",begin:`${e.delay}ms`,fill:"freeze"},null,8,["from","to","dur","begin"])],8,["r","cy","cx","stroke","stroke-width","stroke-linecap","stroke-dasharray"])],8,["width","height"])),n("div",Q,[d(t.$slots,"default",{},(()=>[n("div",{class:"progress",style:v.value},b(e.progress),5)]))])],4))))},__scopeId:"data-v-18aedeac"};const Z=h("data-v-4e06f6ae");p("data-v-4e06f6ae");const ee={width:"0",height:"0"},te=n("feColorMatrix",{in:"gaussianBlur",mode:"matrix",values:"1 0 0 0 0    0 1 0 0 0    0 0 1 0 0    0 0 0 18 -7",result:"colorMatrix"},null,-1),le=n("feBlend",{in:"SourceGraphic",in2:"colorMatrix"},null,-1);f();const ae={expose:[],props:{blur:{type:Number,default:10},id:{type:String,required:!0}},setup:e=>Z(((t,l)=>(s(),r("div",{class:"svg-composite",style:{filter:`url('#${e.id}')`}},[(s(),r("svg",ee,[n("defs",null,[n("filter",{id:e.id},[n("feGaussianBlur",{in:"SourceGraphic",stdDeviation:e.blur,result:"gaussianBlur"},null,8,["stdDeviation"]),te,le],8,["id"])])])),d(t.$slots,"default")],4)))),__scopeId:"data-v-4e06f6ae"};const ie={props:{icon:{type:String,required:!0},prefix:{type:String,default:"#moe-"}}},oe=h("data-v-3ce26460");p("data-v-3ce26460");const se={class:"icon","aria-hidden":"true"};f();const re=oe(((e,t,l,a,i,o)=>(s(),r("svg",se,[n("use",{"xlink:href":l.prefix+l.icon},null,8,["xlink:href"])]))));function ne(e,t,l,a,i=40){let o=1,s=1;return l/a<e/t?(o=l-2*i,s=t*o/e):(s=a-2*i,o=e*s/t),{width:o,height:s}}ie.render=re,ie.__scopeId="data-v-3ce26460";const ue=h("data-v-ea4e6530");p("data-v-ea4e6530");const ce={class:"image-view-container"},de={class:"close"},ve={class:"download-progress"},he={key:0,class:"next turn-page"},ge=n("div",{class:"wall"},null,-1),pe={key:1,class:"prev turn-page"},fe=n("div",{class:"wall"},null,-1);f();const me={expose:[],props:{length:Number},emits:["close","next","prev"],setup(e,{emit:c}){let d,h=null,p={width:1,height:1};const f=t(l("curr-view-img-data")),m=t(null),b=t(null),x=t(null),w=t(50),y=t("original"),k=t({}),z=t({}),$=()=>{c("close")},H=()=>{const{width:e,height:t}=f.value;e&&t&&(k.value={height:t+"px",width:e+"px"},z.value={height:t+"px",width:e+"px"},g((()=>{d.refresh()})))},C=()=>{const{width:e,height:t}=ne(f.value.width,f.value.height,p.width,p.height);e&&t&&(k.value={height:t+"px",width:e+"px"},z.value={height:t+"px",width:e+"px"},g((()=>{d.refresh()})))},S=()=>{"scale"==y.value?(y.value="original",H()):(y.value="scale",C())},W=({offsetX:e,offsetY:t,deltaY:l})=>{y.value="custom";let{width:a,height:i}=z.value;const o=a=parseFloat(a),s=i=parseFloat(i),r=l>0?1.1*a:.9*a;i=i*r/a,a=r,k.value={height:i+"px",width:a+"px"},z.value={height:i+"px",width:a+"px"},g((()=>{d.refresh();let{x:l,y:r,maxScrollX:n,maxScrollY:u}=d;n<0&&(l+=(e-=o/2)-e*a/o),u<0&&(r+=(t-=s/2)-t*i/s),d.scrollTo(l,r,0)}))},M=()=>console.log("download"),O=t(l("menu-pos")),F=t(l("click-target")),P=({x:e,y:t,currentTarget:l})=>{F.value=l,O.value.x=e,O.value.y=t},_=()=>{w.value=b.value.clientHeight},I=()=>{w.value=50},N=()=>{c("next")},j=()=>{c("prev")},E=e=>{console.log("check")};a((()=>f.value.sample),(e=>{d&&(y.value="original",e?(x.value.style.transform="",C()):(k.value={height:"10px",width:"10px"},z.value={height:"10px",width:"10px"},g((()=>{d.refresh(),d.scrollTo(0,0,0)}))))}));const L=U((function(){const{clientWidth:e=0,clientHeight:t=0}=m.value||{};0!==e&&0!==t&&(p.width===e&&p.height===t||(p={width:e,height:t},g((()=>{d&&("original"==y.value?H():"scale"==y.value&&C(),d.refresh())}))))}),250);return i((()=>{d=new T(m.value,{disableMouse:!1,disableTouch:!0,scrollX:!0,scrollY:!0,freeScroll:!0,startX:0,startY:0,stopPropagation:!0}),ResizeObserver?(h=new ResizeObserver(L),h.observe(m.value)):m.value.addEventListener("resize",L)})),o((()=>{d.destroy(),ResizeObserver?h=null:m.value.removeEventListener("resize",L)})),ue(((t,l)=>(s(),r("div",ce,[n("div",{class:"scroll-wrapper",ref:m},[n("div",{class:"image-box image-view-img-box",style:z.value,onClick:u(E,["stop"]),onDblclick:u($,["stop"]),onMousedown:u(P,["right","stop"]),onMousewheel:W},[n("img",{src:f.value.sample,style:k.value,ref:x},null,12,["src"])],44,["onClick","onDblclick","onMousedown"])],512),n("div",{class:["left-bottom",{"download-bar":f.value.downloadPercentage>0}],style:{height:`${w.value}px`},onMouseenter:_,onMouseleave:I},[n("div",{class:"btn-box",ref:b},["original"===y.value?(s(),r(ie,{key:0,class:"icon",icon:"original",onClick:S})):(s(),r(ie,{key:1,class:"icon",icon:"fit",onClick:S})),n(ie,{class:"icon",icon:"download",onClick:M})],512),n("div",de,[n(ie,{class:"icon",icon:"close",onClick:$})]),n("div",ve,[n("div",{class:["progress-box",{show:f.value.downloadPercentage>0}]},[n("div",{class:"progress-bar",style:{height:`${f.value.downloadPercentage}%`}},null,4)],2)])],38),e.length>1?(s(),r("div",he,[n(ae,{id:"svg-filter-next"},{default:ue((()=>[ge,n("div",{class:"btn",onClick:N},[n(ie,{class:"icon",icon:"right"})])])),_:1})])):v("",!0),e.length>1?(s(),r("div",pe,[n(ae,{id:"svg-filter-prev"},{default:ue((()=>[fe,n("div",{class:"btn",onClick:j},[n(ie,{class:"icon",icon:"left"})])])),_:1})])):v("",!0)]))))},__scopeId:"data-v-ea4e6530"};const be=h("data-v-7cd663b6");p("data-v-7cd663b6");const xe={key:0,class:"progress"};f();const we={expose:[],props:{maxHeight:{type:[String,Number],default:100},minHeight:{type:[String,Number],default:50},padding:{type:String,default:"10px"}},setup(e){const c=e;T.use(S),T.use(M);const d=t(l("task-list")),h=t(l("download-complete")),p=t(l("mark-imgs-list")),f=t(l("need-refresh-markbox")),b=t(l("hide")),k=t(l("curr-view-img-data")),z=t(l("menu-pos")),$={disableMouse:!1,disableTouch:!0,scrollX:!0,scrollY:!1},H=t(null);x("click-target",H);const C=t(0);let W=null;const O=t(!1);let F=0,P=0;const _=t(null),I=t(null),N=t(null),j=t(null),E=t(null),L=t(!1),R=t(!1),A=t(0);let X,B,Y={w:0,h:0},D=!1;const q=function(e){let t=e.trim().split(/\s+/);return t=4===t.length?{t:parseFloat(t[0]),r:parseFloat(t[1]),b:parseFloat(t[2]),l:parseFloat(t[3])}:3===t.length?{t:parseFloat(t[0]),r:parseFloat(t[1]),b:parseFloat(t[2]),l:parseFloat(t[1])}:2===t.length?{t:parseFloat(t[0]),r:parseFloat(t[1]),b:parseFloat(t[0]),l:parseFloat(t[1])}:{t:parseFloat(t[0]),r:parseFloat(t[0]),b:parseFloat(t[0]),l:parseFloat(t[0])},t}(c.padding),G=parseInt(c.minHeight)-q.t-q.b,K=({x:e,y:t,currentTarget:l})=>{H.value=l,z.value.x=e,z.value.y=t},J=()=>{L.value=!1,k.value={},Z(),b.value()},Q=()=>{L.value||(O.value=!0,f.value&&setTimeout((()=>{X.refresh(),f.value=!1}),300),X.scrollTo(F,0))},Z=()=>{L.value||(O.value=!1,F=X.x,X.scrollTo(0,0))},ee=e=>{if(!e.scaleWidth){const t=parseInt(c.maxHeight)-q.t-q.b,l=Math.round(e.width*t/e.height);e.scaleWidth=`${l}px`,e.scaleHeight=`${t}px`}return{width:e.scaleWidth,height:e.scaleHeight}},te=t(m((()=>{let e;return e=O.value?"number"==typeof c.maxHeight?`${c.maxHeight}px`:c.maxHeight:"number"==typeof c.minHeight?`${c.minHeight}px`:c.minHeight,{height:e,padding:`${q.t}px ${q.r}px ${q.b}px ${q.l}px`}}))),le=t(m((()=>O.value?{borderRadius:"12px"}:{width:`${G}px`,height:`${G}px`,borderRadius:"50%"}))),ae=e=>{if(!D&&e.fitW&&e.fitH)return{width:e.fitW+"px",height:e.fitH+"px"};const{width:t,height:l}=ne(e.width,e.height,Y.w,Y.h);return e.fitW=t,e.fitH=l,D=!1,{height:l+"px",width:t+"px"}},ie=t(m((()=>p.value.filter((e=>"cacheing"===e.status)).map((e=>e.gid))))),oe=t(m((()=>p.value.filter((e=>"downloading"===e.status)).map((e=>e.gid))))),se=l("slide-page-changed"),re=()=>{const{pageX:e}=B.getCurrentPage();if(P=e,k.value=p.value[e],se(),X.maxScrollX<0){const t=N.value.children[e],l=_.value.offsetLeft;if(t){const{offsetLeft:e,offsetWidth:a}=t,{w:i}=Y,o=-1*q.l;let s=(i-a)/2-l+o-e;s=s>o?o:s,s=s<X.maxScrollX?X.maxScrollX:s,X.scrollTo(s,0,1e3)}}},ue=()=>{B&&B.prev(0)},ce=()=>{B&&B.next(0)};a((()=>p.value.length),(e=>{g(!B&&e>0?()=>{B=new T(I.value,Object.assign({},$,{slide:{autoplay:!1,loop:!0,listenFlick:!1},mouseWheel:!0,momentum:!1,bounce:!1,stopPropagation:!0,probeType:1})),B.on("scrollEnd",re)}:()=>{B.refresh()})})),a(oe.value,((e,t=[])=>{0!==t.length&&0===e.length&&(A.value=100,setTimeout((()=>{A.value=0}),1e3))})),a((()=>d.value),(e=>{if(ie.value.length>0&&e.filter((e=>ie.value.includes(e.gid))).forEach((e=>{const t=p.value.find((t=>e.gid===t.gid));if(t){const l=parseInt(e.completedLength),a=parseInt(e.totalLength),i=a>0?Math.floor(l/a*1e3)/10:0;t.loadingPercentage=i}})),oe.value.length>0){const t=e.filter((e=>oe.value.includes(e.gid)));if(t.length>0){let e=0,l=0;t.forEach((t=>{const a=parseInt(t.completedLength),i=parseInt(t.totalLength);e+=a,l+=i;const o=p.value.find((e=>t.gid===e.gid));if(o){const e=i>0?Math.floor(a/i*1e3)/10:0;o.downloadPercentage=e}})),A.value=l>0?Math.floor(e/l*1e3)/10:0}}})),a((()=>h.value),(e=>{ie.value.length>0&&e.filter((e=>ie.value.includes(e))).forEach((e=>{const t=p.value.find((t=>e===t.gid));t&&"cacheing"===t.status&&(t.loadingPercentage=100,t.status="cacheComplete")})),oe.value.length>0&&e.filter((e=>oe.value.includes(e))).forEach((e=>{const t=p.value.find((t=>e===t.gid));t&&(t.downloadPercentage=100,t.status="downloadComplete")}))}));const de=U((function(){const{clientWidth:e=0,clientHeight:t=0}=E.value||{};0!==e&&0!==t&&(Y.w===e&&Y.h===t||(D=!0,Y={w:e,h:t},C.value++,g((()=>{B&&(B.refresh(),B.goToPage(P,0,0)),X&&X.refresh()}))))}),250);return i((()=>{X=new T(_.value,Object.assign({},$,{mouseWheel:{speed:40,invert:!1,easeTime:1e3}})),ResizeObserver?(W=new ResizeObserver(de),W.observe(E.value)):E.value.addEventListener("resize",de)})),o((()=>{X.destroy(),ResizeObserver?W=null:E.value.removeEventListener("resize",de)})),be(((t,l)=>(s(),r(w,null,[n("div",{class:["mark-container",{show:p.value.length>0&&!R.value}],style:{height:`${parseInt(e.maxHeight)+20}px`},onMouseenter:Q,onMouseleave:Z},[n("div",{class:["scroll-box",{"show-download-progress":A.value>0}]},[n("div",{class:"scroll-x",ref:_,style:te.value},[n("div",{class:"mark-box",ref:N,onMousedown:l[1]||(l[1]=u((()=>{}),["right","stop"]))},[(s(!0),r(w,null,y(p.value,((e,t)=>(s(),r("div",{class:"mark-img-box",ondragstart:"return false;",key:t},[n("div",{class:"img-box",style:[ee(e),le.value]},[n("img",{class:e.width>e.height?"w":"h",src:e.preview,onClick:e=>(e=>{e>0&&p.value.length>1?B.goToPage(e,0):k.value=p.value[0],L.value=!0})(t)},null,10,["src","onClick"])],4),"cacheing"===e.status?(s(),r("div",{key:0,class:"loading",style:le.value},[n(V,{class:"ignore-events",progress:e.loadingPercentage,size:G,lineWidth:4},null,8,["progress"])],4)):v("",!0),"downloading"===e.status||"downloadComplete"===e.status?(s(),r("div",{key:1,class:["downloading",{active:O.value}]},[n(V,{class:"ignore-events",progress:e.downloadPercentage,size:O.value?G:G+2,lineWidth:O.value?4:2},{default:be((()=>[O.value?v("",!0):(s(),r("div",xe))])),_:2},1032,["progress","size","lineWidth"])],2)):v("",!0)])))),128))],544)],4),n("div",{class:["all-download-progress",{active:O.value,show:A.value>0}]},[n("div",{class:"progress-bar",style:{height:`${A.value}%`}},null,4)],2)],2)],38),n("div",{class:["preview-box",{show:L.value&&!R.value}],ref:E,style:{height:`calc(100vh - ${parseInt(e.maxHeight)}px)`}},[n("div",{class:"slide-banner-wrapper",ref:I},[(s(),r("div",{class:"slide-banner-content",key:C.value},[(s(!0),r(w,null,y(p.value,((e,t)=>(s(),r("div",{class:"slide-page",key:t,onClick:J,onMousedown:l[4]||(l[4]=u((()=>{}),["right","stop"]))},[n("img",{src:e.sample,style:ae(e),onClick:l[2]||(l[2]=u((()=>{}),["stop"])),onMousedown:u(K,["right","stop"]),onDblclick:l[3]||(l[3]=u((e=>R.value=!0),["stop"]))},null,44,["src","onMousedown"])],32)))),128))]))],512)],6),n(me,{class:["image-view",{show:R.value}],ref:j,length:p.value.length,onClose:l[5]||(l[5]=e=>R.value=!1),onPrev:ue,onNext:ce},null,8,["length","class"])],64))))},__scopeId:"data-v-7cd663b6"};const ye=h("data-v-f2232e5a"),ke={expose:[],setup(e){const i=t(!1),o=t({transform:"translateY(-100%)"}),c=t(l("menu-pos")),v=()=>{i.value=!1};return x("hide-menu",v),a((()=>c.value),(e=>{const{x:t,y:l}=e;o.value.transform=`translate(${t}px, ${l}px)`,i.value=!0}),{deep:!0}),ye(((e,t)=>(s(),r(w,null,[k(n("div",{class:"menu-mask",onClick:u(v,["stop"])},null,8,["onClick"]),[[z,i.value]]),k(n("div",{class:"menu-box",style:o.value},[d(e.$slots,"default")],4),[[z,i.value]])],64))))},__scopeId:"data-v-f2232e5a"},ze={expose:[],props:{imgsArr:{type:Array,required:!0},moreHeight:{type:Number,default:0},scrollHook:{type:Function,default:()=>{}},pagination:Object},emits:["scroll-reach-bottom","download","slide-page-changed","hide"],setup(l,{emit:a}){const i=l,{expose:o}=$(),u=t(null),c=t(null),v=t([]),h=t([]),g=t({}),p=t(!1),f=t({x:0,y:0});x("scroll-hook",i.scrollHook),x("mark-imgs-list",v),x("curr-selected",h),x("curr-view-img-data",g),x("need-refresh-markbox",p),x("menu-pos",f),x("download",(e=>a("download",e))),x("hide",(()=>a("hide"))),x("scroll-reach-bottom",((...e)=>a("scroll-reach-bottom",...e))),x("slide-page-changed",(()=>a("slide-page-changed")));return x("img-rotate-90",((e,t="right")=>{c.value.imgRotate90(e,t)})),o({addImgToList:(t,l)=>{if(-1!==v.value.findIndex((e=>e.id===t.id)))return;h.value=[t.id];const a=e({status:"cacheing",loadingPercentage:0,downloadPercentage:0},t);v.value.push(a),p.value=!0,l(t).then((e=>{a.gid=e}))},refresh:()=>{c.value&&c.value.hidePreview(),u.value.refresh()},scrollTo:(...e)=>{u.value.scrollTo(...e)}}),(e,t)=>(s(),r(w,null,[n(K,{ref:u,imgsArr:l.imgsArr,moreHeight:l.moreHeight,pagination:l.pagination},{default:H((({data:t})=>[d(e.$slots,"default",{data:t})])),_:1},8,["imgsArr","moreHeight","pagination"]),n(we,{ref:c,maxHeight:"200px"},null,512),n(ke,null,{default:H((()=>[d(e.$slots,"menu")])),_:3})],64))}};export default ze;