@camera.ui/server 0.0.54 → 0.0.56

package/dist/interface/js/vue-zoomable.D16lEenv.0.0.54.js

@@ -1 +0,0 @@
-import{B as Z,r as w,k as b,c as E,w as _,o as S,d as g,G as B,M as D,O as Y,h,P as X,e as p,a1 as y,ab as C}from"./@vue.B5vqhCp2.0.0.54.js";const j={class:"controll"},L={class:"controll__item controll__item--circle"},M={class:"controll__pan controll__item--circle__inner"},T={class:"controll__pan__up controll__item--circle__inner__up"},O={class:"controll__pan__right controll__item--circle__inner__right"},H={class:"controll__pan__down controll__item--circle__inner__down"},$={class:"controll__pan__left controll__item--circle__inner__left"},W={class:"controll__home controll__item controll__item--list-item"},I={class:"controll__zoom-in controll__item controll__item--list-item"},U={class:"controll__zoom-in controll__item controll__item--list-item"},V=Z({__name:"ControlButtons",emits:["buttondown","buttonup"],setup(e,{emit:l}){const u=l;function r(a,o){u("buttondown",{key:o})}function t(a,o){u("buttonup",{key:o})}return(a,o)=>(g(),E("div",{id:"v-zoomable-control-btns",class:"controll__buttons",onDblclick:o[31]||(o[31]=y(()=>{},["stop"])),onMousedown:o[32]||(o[32]=y(()=>{},["stop"]))},[p("ul",j,[p("li",L,[p("ul",M,[p("li",T,[p("a",{onPointerdown:o[0]||(o[0]=n=>r(n,"pan-up")),onPointerup:o[1]||(o[1]=n=>t(n,"pan-up")),onPointercancel:o[2]||(o[2]=n=>t(n,"pan-up")),onPointerleave:o[3]||(o[3]=n=>t(n,"pan-up")),onContextmenu:o[4]||(o[4]=y(()=>{},["prevent"]))},o[33]||(o[33]=[p("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"feather feather-chevron-up"},[p("polyline",{points:"18 15 12 9 6 15"})],-1)]),32)]),p("li",O,[p("a",{onPointerdown:o[5]||(o[5]=n=>r(n,"pan-right")),onPointerup:o[6]||(o[6]=n=>t(n,"pan-right")),onPointercancel:o[7]||(o[7]=n=>t(n,"pan-right")),onPointerleave:o[8]||(o[8]=n=>t(n,"pan-right")),onContextmenu:o[9]||(o[9]=y(()=>{},["prevent"]))},o[34]||(o[34]=[p("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"feather feather-chevron-right"},[p("polyline",{points:"9 18 15 12 9 6"})],-1)]),32)]),p("li",H,[p("a",{onPointerdown:o[10]||(o[10]=n=>r(n,"pan-down")),onPointerup:o[11]||(o[11]=n=>t(n,"pan-down")),onPointercancel:o[12]||(o[12]=n=>t(n,"pan-down")),onPointerleave:o[13]||(o[13]=n=>t(n,"pan-down")),onContextmenu:o[14]||(o[14]=y(()=>{},["prevent"]))},o[35]||(o[35]=[p("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"feather feather-chevron-down"},[p("polyline",{points:"6 9 12 15 18 9"})],-1)]),32)]),p("li",$,[p("a",{onPointerdown:o[15]||(o[15]=n=>r(n,"pan-left")),onPointercancel:o[16]||(o[16]=n=>t(n,"pan-left")),onPointerup:o[17]||(o[17]=n=>t(n,"pan-left")),onPointerleave:o[18]||(o[18]=n=>t(n,"pan-left")),onContextmenu:o[19]||(o[19]=y(()=>{},["prevent"]))},o[36]||(o[36]=[p("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"feather feather-chevron-left"},[p("polyline",{points:"15 18 9 12 15 6"})],-1)]),32)])])]),p("li",W,[p("a",{onPointerdown:o[20]||(o[20]=n=>r(n,"home"))},o[37]||(o[37]=[C('<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-minimize-2" data-v-3ba139de><polyline points="4 14 10 14 10 20" data-v-3ba139de></polyline><polyline points="20 10 14 10 14 4" data-v-3ba139de></polyline><line x1="14" y1="10" x2="21" y2="3" data-v-3ba139de></line><line x1="3" y1="21" x2="10" y2="14" data-v-3ba139de></line></svg>',1)]),32)]),p("li",I,[p("a",{onPointerdown:o[21]||(o[21]=n=>r(n,"zoom-in")),onPointerup:o[22]||(o[22]=n=>t(n,"zoom-in")),onPointercancel:o[23]||(o[23]=n=>t(n,"zoom-in")),onPointerleave:o[24]||(o[24]=n=>t(n,"zoom-in")),onContextmenu:o[25]||(o[25]=y(()=>{},["prevent"]))},o[38]||(o[38]=[C('<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-zoom-in" data-v-3ba139de><circle cx="11" cy="11" r="8" data-v-3ba139de></circle><line x1="21" y1="21" x2="16.65" y2="16.65" data-v-3ba139de></line><line x1="11" y1="8" x2="11" y2="14" data-v-3ba139de></line><line x1="8" y1="11" x2="14" y2="11" data-v-3ba139de></line></svg>',1)]),32)]),p("li",U,[p("a",{onPointerdown:o[26]||(o[26]=n=>r(n,"zoom-out")),onPointerup:o[27]||(o[27]=n=>t(n,"zoom-out")),onPointercancel:o[28]||(o[28]=n=>t(n,"zoom-out")),onPointerleave:o[29]||(o[29]=n=>t(n,"zoom-out")),onContextmenu:o[30]||(o[30]=y(()=>{},["prevent"]))},o[39]||(o[39]=[p("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"feather feather-zoom-out"},[p("circle",{cx:"11",cy:"11",r:"8"}),p("line",{x1:"21",y1:"21",x2:"16.65",y2:"16.65"}),p("line",{x1:"8",y1:"11",x2:"14",y2:"11"})],-1)]),32)])])],32))}}),N=(e,l)=>{const u=e.__vccOpts||e;for(const[r,t]of l)u[r]=t;return u},q=N(V,[["__scopeId","data-v-3ba139de"]]);function G(){let e=0;function l(r,t,a,o){r(),e=window.setTimeout(()=>{e=window.setInterval(()=>{t()},o)},a)}function u(){e&&(window.clearInterval(e),e=0)}return{startHold:l,clearHold:u}}const x="control-btn";function R({props:e,transform:l}){let u=G();function r(c){u.startHold(()=>{l.changeZoom(c*e.buttonZoomStep*.5,x)},()=>{l.changeZoom(c*e.buttonZoomStep*.5,x)},300,50)}function t(c){if(!e.disabled)switch(c.key){case"home":n();break;case"zoom-in":r(1);break;case"zoom-out":r(-1);break;case"pan-left":o({x:1,y:0});break;case"pan-right":o({x:-1,y:0});break;case"pan-up":o({x:0,y:1});break;case"pan-down":o({x:0,y:-1});break}}function a(c){u.clearHold()}function o(c){u.startHold(()=>{l.changePan(c.x*e.buttonPanStep,c.y*e.buttonPanStep,x)},()=>{l.changePan(c.x*e.buttonPanStep,c.y*e.buttonPanStep,x)},300,50)}function n(){l.goHome(x)}return{onButtonDown:t,onButtonUp:a}}function A({props:e,transform:l}){let u={x:0,y:0};function r(o){e.disabled||o.pointerType!=="mouse"||!e.mouseEnabled||(u={x:o.clientX,y:o.clientY},document.addEventListener("pointermove",a,{passive:!1}),document.addEventListener("pointerup",function(n){document.removeEventListener("pointermove",a)}),document.addEventListener("pointerleave",function(n){document.removeEventListener("pointermove",a)}),document.addEventListener("pointercancel",function(n){document.removeEventListener("pointermove",a)}))}function t(o){if(e.disabled||!e.dblClickEnabled||!e.zoomEnabled)return;const n={x:o.clientX,y:o.clientY};l.changeZoom(e.dblClickZoomStep,"dblClick",n)}function a(o){if(e.disabled||!e.panEnabled||o.pointerType!=="mouse"||!e.mouseEnabled)return;let n={x:o.clientX-u.x,y:o.clientY-u.y};l.changePan(n.x,n.y,o.pointerType),u={x:o.clientX,y:o.clientY},o.preventDefault()}return{onPointerDown:r,onDblClick:t}}function F({props:e,transform:l}){let u=w({}),r=w(0),t=null;function a(c){if(e.disabled||!e.touchEnabled||!e.panEnabled&&!e.zoomEnabled||(c.preventDefault(),c.touches.length<1))return;const i=c.touches.item(0);if(!i)return;let d=0,s={x:i.clientX,y:i.clientY};if(c.touches.length===2){const v=c.touches.item(1);let f=o({x:i?i.clientX:0,y:i?i.clientY:0},{x:v?v.clientX:0,y:v?v.clientY:0});r.value<=0?(r.value=f.distance,d=0):(d=f.distance/r.value*l.zoom.value-l.zoom.value,r.value=f.distance),s=f.center}if(e.zoomEnabled&&l.changeZoom(d,"touch",s),t===null){t={x:s.x,y:s.y};return}const m={x:s.x-t.x,y:s.y-t.y};e.panEnabled&&l.changePan(m.x,m.y,"touch"),t={x:s.x,y:s.y}}function o(c,i){let d=Math.sqrt(Math.pow(c.x-i.x,2)+Math.pow(c.y-i.y,2)),s={x:(c.x+i.x)/2,y:(c.y+i.y)/2};return{distance:d,center:s}}function n(c){e.disabled||!e.touchEnabled||(t=null,document.addEventListener("touchmove",a,{passive:!1}),document.addEventListener("touchend",function(i){c.touches.length<2&&(r.value=-1),document.removeEventListener("touchmove",a)}))}return{onTouchStart:n,touchCount:b(()=>Object.keys(u.value).length)}}function J({props:e,onChange:l,container:u,target:r}){const t=w({x:0,y:0}),a=w(0);S(()=>{a.value=e.minZoom,t.value={x:e.pan!=null?e.pan.x:e.initialPanX,y:e.pan!=null?e.pan.y:e.initialPanY},e.zoom?a.value=e.zoom:e.initialZoom>=e.minZoom&&e.initialZoom<=e.maxZoom&&(a.value=e.initialZoom)}),_(()=>e.zoom,()=>{isNaN(e.zoom)||(a.value=e.zoom)}),_(()=>e.pan,()=>{e.pan&&(t.value.x=e.pan.x,t.value.y=e.pan.y)},{deep:!0});function o(i,d,s){if(isNaN(i)||i===0)return;const m=a.value;let v=a.value+i;if(v>e.maxZoom?v=e.maxZoom:v<e.minZoom&&(v=e.minZoom),Math.abs(m-v)<1e-4)return;if(a.value=v,e.zoomOrigin==="center"&&(s=k(u.value)),e.zoomOrigin!=="content-center"){s||(s=k(u.value));const P=K(u.value,t.value),z={x:(v-m)*((P.x-s.x)/m),y:(v-m)*((P.y-s.y)/m)};n(z.x,z.y,"zoom")}let f={zoom:v,delta:{zoom:i,pan:{x:0,y:0}},pan:{x:t.value.x,y:t.value.y,deltaX:0,deltaY:0},type:d};l("zoom",f)}function n(i,d,s){isNaN(i)&&(i=0),isNaN(d)&&(d=0),t.value={x:t.value.x+i,y:t.value.y+d};let m={zoom:a.value,delta:{zoom:0,pan:{x:i,y:d}},pan:{x:t.value.x,y:t.value.y,deltaX:i,deltaY:d},type:s};l("panned",m)}function c(i){a.value=e.initialZoom,l("zoom",{zoom:a.value,pan:{x:t.value.x,y:t.value.y,deltaX:0,deltaY:0},type:i});let d={x:e.initialPanX-t.value.x,y:e.initialPanY-t.value.y};t.value={x:e.initialPanX,y:e.initialPanY},l("panned",{zoom:a.value,pan:{x:t.value.x,y:t.value.y,deltaX:d.x,deltaY:d.y},type:i})}return{zoom:b(()=>a.value),pan:b(()=>t.value),setZoom:i=>{a.value=i},setPan:i=>{t.value=i},changeZoom:o,changePan:n,goHome:c}}function k(e){const l=e.getBoundingClientRect();return{x:l.left+l.width/2,y:l.top+l.height/2}}function K(e,l){const u=k(e);return{x:u.x+l.x,y:u.y+l.y}}function Q({props:e,transform:l}){function u(r){if(e.disabled||!e.wheelEnabled||!e.zoomEnabled)return;const t=e.wheelZoomStep*-1*r.deltaY/Math.abs(r.deltaY),a={x:r.clientX,y:r.clientY};l.changeZoom(t,"wheel",a),r.preventDefault()}return{onWheel:u}}function oo({props:e,onChange:l,container:u,target:r}){const t=J({props:e,onChange:l,container:u,target:r}),a=F({props:e,transform:t}),o=Q({props:e,transform:t}),n=A({props:e,transform:t}),c=R({props:e,transform:t});return{zoom:t.zoom,pan:t.pan,setZoom:t.setZoom,setPan:t.setPan,onWheel:o.onWheel,onTouchStart:a.onTouchStart,onButtonUp:c.onButtonUp,onButtonDown:c.onButtonDown,onPointerDown:n.onPointerDown,onDblClick:n.onDblClick}}const eo=Z({__name:"VueZoomable",props:{zoom:{type:Number,default:null},pan:{type:Object,default:null},selector:{type:String,default:"* > *"},maxZoom:{type:Number,default:3},minZoom:{type:Number,default:.5},initialPanX:{type:Number,default:0},initialPanY:{type:Number,default:0},initialZoom:{type:Number,default:.5},dblClickZoomStep:{type:Number,default:.4},wheelZoomStep:{type:Number,default:.4},panEnabled:{type:Boolean,default:!0},zoomEnabled:{type:Boolean,default:!0},mouseEnabled:{type:Boolean,default:!0},touchEnabled:{type:Boolean,default:!0},dblClickEnabled:{type:Boolean,default:!0},wheelEnabled:{type:Boolean,default:!0},enableControlButton:{type:Boolean,default:!0},buttonPanStep:{type:Number,default:15},buttonZoomStep:{type:Number,default:.1},disabled:{type:Boolean,default:!1},zoomOrigin:{type:String,default:"pointer"}},emits:["panned","zoom","update:zoom","update:pan"],setup(e,{emit:l}){let u=l,r=e,t=w(),a=b(()=>{var d;return(d=t.value)==null?void 0:d.querySelector(r.selector)}),o=oo({props:r,onChange:n,container:t,target:a});function n(d,s){d==="zoom"?u("update:zoom",s.zoom):d==="panned"&&u("update:pan",s.pan),u(d,s)}let c=b(()=>`translate(${o.pan.value.x}px, ${o.pan.value.y}px) scale(${o.zoom.value})`);function i(){a.value&&(a.value.style.transform=c.value,a.value.style.transformOrigin="center center",a.value.style.transition="transform 0.07s ease-out",a.value.style.transformBox="fill-box")}return _(c,()=>{i()},{flush:"post"}),S(()=>{i()}),(d,s)=>(g(),E("div",{ref_key:"container",ref:t,class:X(d.$style.container),onDblclick:s[0]||(s[0]=(...m)=>h(o).onDblClick&&h(o).onDblClick(...m)),onPointerdown:s[1]||(s[1]=(...m)=>h(o).onPointerDown&&h(o).onPointerDown(...m)),onWheel:s[2]||(s[2]=(...m)=>h(o).onWheel&&h(o).onWheel(...m)),onTouchstart:s[3]||(s[3]=(...m)=>h(o).onTouchStart&&h(o).onTouchStart(...m))},[B(d.$slots,"default",{},void 0,!0),B(d.$slots,"buttons",{},()=>[h(r).enableControlButton?(g(),D(q,{key:0,onButtondown:h(o).onButtonDown,onButtonup:h(o).onButtonUp},null,8,["onButtondown","onButtonup"])):Y("",!0)],!0)],34))}}),to="_container_irdvc_2",no="_buttons_irdvc_11",ao={container:to,buttons:no},lo={$style:ao},io=N(eo,[["__cssModules",lo],["__scopeId","data-v-fce7d501"]]);export{io as m};