UNPKG

draggerjs

Version:
1 lines 8.05 kB
module.exports=function(t){var e={};function n(o){if(e[o])return e[o].exports;var i=e[o]={i:o,l:!1,exports:{}};return t[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)n.d(o,i,function(e){return t[e]}.bind(null,i));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e),n.d(e,"default",(function(){return T}));const o=window,i=document,r=(i.documentElement,{allowBoundContainer:!0,allowExactTargetDraggable:!1,autoscroll:!1,autoscrollSensitivity:20,eventListenerOption:!1,allowPointerEvent:!0,allowWindowBound:!1}),a=o.requestAnimationFrame||o.webkitRequestAnimationFrame||o.mozRequestAnimationFrame,l=o.cancelAnimationFrame||o.webkitCancelAnimationFrame||o.mozCancelAnimationFrame,s=(t,e)=>{Object.keys(e).forEach(n=>{n in t.style&&(t.style[n]=e[n])})},c=t=>"string"==typeof t,p=t=>"function"==typeof t,d=t=>t&&t.nodeType===Node.ELEMENT_NODE,u=(t,e,n,o)=>{e.split(/\s{1,10}/).forEach(e=>{t.addEventListener(e,n,o)})},g=(t,e,n,o)=>{e.split(/\s{1,10}/).forEach(e=>{t.removeEventListener(e,n,o)})},h=(t,e,n)=>{if(!(e.includes(typeof t)||e.includes("node")&&d(t)))throw new Error(`${n} must contain the following data types (${e.map(t=>t.toUpperCase()).join(", ")})`)},m=["dragstart","dragmove","dragend","dragenter","dragover","dragexit","drop"],f=(t,e)=>{if(!m.includes(e))throw new SyntaxError(`Dragger.${t} event type "${e}" is not recognize. supported events are ${m.join(", ")}`)};class b{constructor(t,e){var n,o,i;i=void 0,(o="originalEvent")in(n=this)?Object.defineProperty(n,o,{value:i,enumerable:!0,configurable:!0,writable:!0}):n[o]=i,Object.assign(this,e),this.originalEvent=t}preventDefault(){this.originalEvent.preventDefault()}stopPropagation(){this.originalEvent.stopPropagation()}}const v=(t,{x:e,y:n,axis:o})=>{const i={position:"absolute"};"x"!==o&&o||(i.left=e+"px"),"y"!==o&&o||(i.top=n+"px"),s(t,i)},y=(t,{container:e,isDraggable:n,initialPosition:o,allowBoundContainer:i,allowWindowBound:r})=>{let{clientX:a,clientY:l}=t.touches&&t.touches[0]||t;const s=r?{top:0,left:0}:e.getBoundingClientRect(),c=r?0:e.scrollLeft,p=r?0:e.scrollTop;let d=c+(a-s.left)-(n?o.left:0),u=p+(l-s.top)-(n?o.top:0);return i&&(d=D(d,o),u=x(u,o)),{clientX:a,clientY:l,x:d,y:u}},w=({target:t,droppableQuery:e,point:{x:n,y:o}})=>{t.hidden=!0;const r=i.elementFromPoint(n,o);t.hidden=!1;const a=r&&r.closest(e),l=a&&a.matches(e);return{droppableTarget:r,srcDroppable:a,isOverDroppable:l}},x=(t,e)=>Math.max(0,Math.min(e.containerHeight-e.height,t)),D=(t,e)=>Math.max(0,Math.min(e.containerWidth-e.width,t)),E=(t,e,n)=>Math.min(t,Math.min(e,n>0?n:e)),O=(t,{y:e,x:n,clientY:o,clientX:r,target:c,container:p,sensitivity:d,initialPosition:u})=>{t.animationFrame&&l(t.animationFrame);const g=()=>{const l=p.getBoundingClientRect();(t=>{const e=[];for(let n=t;n&&n!==i;n=n.parentNode)(n.scrollHeight>n.clientHeight||n.scrollWidth>n.clientWidth)&&e.push(n);return e})(c).reduce((t,i,a,g)=>{const{top:h,left:m}="HTML"!==i.nodeName?i.getBoundingClientRect():{top:0,left:0};let{scrollTop:f,scrollLeft:b,scrollHeight:v,scrollWidth:y,clientHeight:w,clientWidth:O}=i;const P={},T=i===p,X=h+d,Y=h+w-d,j=m+d,B=m+O-d,C=X-o,F=o-Y,W=j-r,H=r-B,M=e+u.top,A=n+u.left,S=l.top,L=l.top+l.height,_=l.left,R=l.left+l.width,$=o<X&&f>0&&(T?M>0:o>S),k=o>Y&&f<v-w&&(T?M<v:o<L),N=r<j&&b>0&&(T?A>0:r>_),q=r>B&&b<y-O&&(T?A<y:r<R),z=$||k||N||q;if($){const t=E(d,C,T?M-d:o-S);f-=t,e-=t,P.top=x(e,u)+"px"}else if(k){const t=E(d,F,T?v-M:L-o);f+=t,e+=t,P.top=x(e,u)+"px"}if(N){const t=E(d,W,T?A-d:r-_);b-=t,n-=t,P.left=D(n,u)+"px"}else if(q){const t=E(d,H,T?y-A:R-r);b+=t,n+=t,P.left=D(n,u)+"px"}return z&&(i.scrollTop=f,i.scrollLeft=b,i.matches('[data-draggerjs="not-relative"]')||s(c,P),g.splice(1)),t||z},!1)&&(t.animationFrame=a(g))};t.animationFrame=a(g)};function P(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}class T{static create(...t){return new T(...t)}constructor(t,e){var n;P(this,"container",void 0),P(this,"options",void 0),P(this,"emitters",void 0),P(this,"modifiers",void 0),P(this,"pluginDumps",void 0),P(this,"initHandler",void 0),this.container=c(t)?(n=t,i.querySelector(n)):d(t)?t:i.body,this.options={...r,...e},this.emitters={},Object.keys(this.options).forEach(t=>{h(this.options[t],["autoscrollSensitivity"===t?"number":["droppable","draggable","axis"].includes(t)?"string":"boolean"],`Dragger options \`${t}\``)}),h(t,["string","node"],"Dragger argument `0`"),h(this.container,["node"],"Dragger this.container is null check carefully what you input in argument `0`"),this.init()}init(){const t=this.container,{axis:e,draggable:n,droppable:o,allowBoundContainer:i,allowExactTargetDraggable:r,autoscroll:a,autoscrollSensitivity:l,eventListenerOption:c,allowPointerEvent:d,allowWindowBound:h}=this.options;this.initHandler=m=>{const f={},{dragstart:x,dragmove:D,dragend:E,dragenter:P,dragover:T,dragexit:X,drop:Y}=this.emitters,j=!r&&m.target.closest(n)||m.target,B=!!n&&j.matches(n),C=((t,{target:e,container:n,isDraggable:o,allowWindowBound:i})=>{const{clientX:r,clientY:a}=t.touches&&t.touches[0]||t,{left:l=0,top:s=0,width:c=0,height:p=0}=o?e.getBoundingClientRect():{};return{left:r-l,top:a-s,width:c,height:p,containerHeight:i?window.innerHeight:n.scrollHeight,containerWidth:i?window.innerWidth:n.scrollWidth}})(m,{target:j,container:t,isDraggable:B,allowWindowBound:h}),F={container:t,isDraggable:B,allowBoundContainer:i,allowWindowBound:h,initialPosition:C},{x:W,y:H,...M}=y(m,F),A={type:"dragstart",target:j,container:t,isDraggableElement:B,startX:W,startY:H,moveX:W,moveY:H,endX:W,endY:H,clientX:M.clientX,clientY:M.clientY},S={};p(x)&&x.call(t,new b(m,A),S),B&&v(j,{x:W,y:H,axis:e}),d&&j.setPointerCapture(m.pointerId);const L=n=>{const{clientX:i,clientY:r,...s}=y(n,F);A.clientX=i,A.clientY=r;let c=A.moveX=A.endX=s.x,d=A.moveY=A.endY=s.y;if(B&&(v(j,{x:c,y:d,axis:e}),a&&O(f,{target:j,container:t,x:c,y:d,clientX:i,clientY:r,sensitivity:l,initialPosition:C}),o)){const{srcDroppable:e,droppableTarget:i,isOverDroppable:r}=w({target:j,droppableQuery:o,point:{x:A.clientX,y:A.clientY}});r&&(f.droppableAt!==e&&(p(P)&&P.call(e,new b(n,{...A,type:"dragenter",srcDroppable:e,droppableTarget:i}),S),f.droppableAt&&p(X)&&X.call(e,new b(n,{...A,type:"dragexit",srcDroppable:f.droppableAt}),S)),f.droppableAt=e,p(T)&&T.call(t,new b(n,{...A,type:"dragover",srcDroppable:e,droppableTarget:i}),S))}p(D)&&D.call(t,new b(n,{...A,type:"dragmove"}),S)};u(t,d?"pointermove":"mousemove touchmove",L,c);const _=e=>{if(a&&f.animationFrame&&cancelAnimationFrame(f.animationFrame),o&&B){B&&s(j,{position:null,left:null,top:null});const{srcDroppable:t,droppableTarget:n,isOverDroppable:i}=w({target:j,droppableQuery:o,point:{x:A.clientX,y:A.clientY}});if(i&&p(Y)){const i=j.closest(o);Y.call(t,new b(e,{...A,type:"drop",srcDroppable:t,droppableTarget:n,targetCurrentDroppable:i,isSameDroppable:t===i}),S)}}p(E)&&E.call(t,new b(e,{...A,type:"dragend"}),S),d&&j.releasePointerCapture(e.pointerId),g(t,d?"pointermove":"mousemove touchmove",L,c),g(t,d?"pointerup":"mouseup touchend",_,c)};u(t,d?"pointerup":"mouseup touchend",_,c)},u(t,d?"pointerdown":"mousedown touchstart",this.initHandler,c)}on(t,e){f("on",t),this.emitters[t]=e}off(t){f("off",t),delete this.emitters[t]}destroy(){g(this.container,this.options.allowPointerEvent?"pointerdown":"mousedown touchstart",this.initHandler,this.options.eventListenerOption)}}}]);