UNPKG

@leafer-in/scroll

Version:
3 lines (2 loc) 2.51 kB
import{Group as t,DataHelper as i,isString as s,Box as e,Bounds as r,DragEvent as h,RenderEvent as o,ResizeEvent as a,Plugin as n}from"@leafer-ui/core";class l extends t{get isOutside(){return!0}constructor(t,s){super(),this.config={theme:"light",padding:0,minSize:10},t.isApp&&(t.sky.add(this),t=t.tree),this.target=t,s&&i.assign(this.config,s),this.changeTheme(this.config.theme),this.waitLeafer(this.__listenEvents,this)}changeTheme(t){let i;s(t)?(i={fill:"black",stroke:"rgba(255,255,255,0.8)"},"dark"===t&&(i.fill="white",i.stroke="rgba(0,0,0,0.2)")):i=t,this.scrollXBar||this.addMany(this.scrollXBar=new e,this.scrollYBar=new e),i=Object.assign({strokeAlign:"center",opacity:.5,width:6,cornerRadius:3,hoverStyle:{opacity:.6},pressStyle:{opacity:.7}},i),i.height||(i.height=i.width),this.scrollXBar.set(Object.assign(Object.assign({},i),{visible:!1})),this.scrollYBar.set(Object.assign(Object.assign({},i),{visible:!1})),this.leafer&&this.update()}update(t){if(this.dragScrolling)return;const{minSize:i,padding:s}=this.config,{zoomLayer:e,canvas:h}=this.target.leafer,{worldRenderBounds:o}=e;if(t&&this.scrollBounds&&this.scrollBounds.isSame(o))return;this.scrollBounds=new r(o);const a=h.bounds.clone().shrink(s),n=a.clone().add(o),l=this.ratioX=a.width/n.width,g=this.ratioY=a.height/n.height,d=(a.x-n.x)/n.width,c=(a.y-n.y)/n.height,u=l<1,_=g<1,{scrollXBar:p,scrollYBar:v}=this,{x:f,y:m,width:y,height:B}=a.shrink([2,_?v.width+6:2,u?p.height+6:2,2]);p.set({x:f+y*d,y:m+B+2,width:Math.max(y*l,i),visible:u}),v.set({x:f+y+2,y:m+B*c,height:Math.max(B*g,i),visible:_})}onDrag(t){this.dragScrolling=!0,this.__dragOut=this.app.config.move.dragOut,this.app.config.move.dragOut=!1;const i=t.current===this.scrollXBar,s=this.target.leafer.getValidMove(i?-t.moveX/this.ratioX:0,i?0:-t.moveY/this.ratioY);this.target.moveWorld(s.x,s.y),t.current.moveWorld(s.x&&-s.x*this.ratioX,s.y&&-s.y*this.ratioY)}onDragEnd(){this.dragScrolling=!1,this.app.config.move.dragOut=this.__dragOut}__listenEvents(){const{scrollXBar:t,scrollYBar:i}=this;this.__eventIds=[t.on_(h.DRAG,this.onDrag,this),i.on_(h.DRAG,this.onDrag,this),t.on_(h.END,this.onDragEnd,this),i.on_(h.END,this.onDragEnd,this),this.target.on_(o.BEFORE,()=>this.update(!0)),this.target.leafer.on_(a.RESIZE,()=>this.update())]}__removeListenEvents(){this.off_(this.__eventIds)}destroy(){this.destroyed||(this.__removeListenEvents(),this.target=this.config=null,super.destroy())}}n.add("scroll");export{l as ScrollBar}; //# sourceMappingURL=scroll.esm.min.js.map