coherent-gameface-interaction-manager/dist/rotate.min.js

Library for the most common UI interactions

var rotate=(()=>{var m=(o,e)=>()=>(o&&(e=o(o=0)),e);var z=(o,e)=>()=>(e||o((e={exports:{}}).exports,e),e.exports);function g(o){return o*180/Math.PI}function P(){return(Math.random()+1).toString(36).substring(7)}function f(o,e,t,n){let r=o-t,s=e-n;return Math.hypot(r,s)}function x(o,e,t,n){return{x:(o+t)/2,y:(e+n)/2}}var I=m(()=>{});var p,v,_=m(()=>{p=class o{constructor(){this.actions=[],this.keyboardFunctions=[],this.gamepadFunctions=[]}init(){window._IM||(window._IM=new o)}getKeys(e){return _IM.keyboardFunctions.filter(t=>t.keys.every(n=>e.includes(n)))}getKeysIndex(e){return _IM.keyboardFunctions.findIndex(t=>t.keys.every(n=>e.includes(n)))}getGamepadAction({actions:e,type:t}){return _IM.gamepadFunctions.find(n=>n.actions.every(r=>e.includes(r))&&n.type===t&&n.actions.length===e.length)}getGamepadActions(e){return _IM.gamepadFunctions.filter(t=>t.actions.every(n=>e.includes(n))&&t.actions.length===e.length)}getGamepadActionIndex(e){return _IM.gamepadFunctions.findIndex(t=>t.actions.every(n=>e.includes(n)))}getAction(e){return _IM.actions.find(t=>t.name===e)}getActionIndex(e){return _IM.actions.findIndex(t=>t.name===e)}},v=new p});var S,T,O=m(()=>{_();S=class{register(e,t){if(v.getAction(e))return console.error(`The following action "${e}" is already registered!`);_IM.actions.push({name:e,callback:t})}remove(e){let t=v.getActionIndex(e);if(t===-1)return console.error(`${e} is not a registered action!`);_IM.actions.splice(t,1)}execute(e,t){let n=v.getAction(e);if(!n)return console.error(`${e} is not a registered action!`);n.callback(t)}},T=new S});function D(o,e){if(e<0&&o>-200&&o<200)return"top";if(e>0&&o>-200&&o<200)return"bottom";if(o<0&&e>-200&&e<200)return"left";if(o>0&&e>-200&&e<200)return"right";if(o<=-200&&e<=-200)return"top-left";if(o>=200&&e<=-200)return"top-right";if(o<=-200&&e>=200)return"bottom-left";if(o>=200&&e>=200)return"bottom-right"}function l(o){return o instanceof HTMLElement?o:document.querySelector(o)}var y=m(()=>{});var M,L,A,W=m(()=>{y();I();M=2,L=class{constructor(){this.activeTouches=new Map}hold(e){if(!e)return console.error("Options not provided for hold!");let t,n=l(e.element);if(!n)return console.error("Element not found!");let r=({touches:i})=>{this.activeTouches.set(i[0].identifier,i[0]),t=setTimeout(()=>{e.callback&&e.callback()},e.time||1e3)},s=({touches:i})=>{this.activeTouches.delete(i[0].identifier),clearTimeout(t)};return n.addEventListener("touchstart",r),n.addEventListener("touchend",s),{remove(){n.removeEventListener("touchstart",r),n.removeEventListener("touchend",s)}}}tap(e){if(!e)return console.error("Options not provided for tap!");let t,n,r=!0,s=e.tapsNumber||1,i=l(e.element);if(!i)return console.error("Element not found!");let u=({touches:c})=>{this.activeTouches.set(c[0].identifier,c[0]),clearTimeout(n),r=!0,t=setTimeout(()=>{r=!1},e.tapTime||200)},a=({touches:c})=>{this.activeTouches.delete(c[0].identifier),clearTimeout(t),r&&(s--,n=setTimeout(()=>{s=e.tapsNumber||1,clearTimeout(n)},e.betweenTapsTime||500),!(s!==0||!e.callback)&&(e.callback(),r=!0,clearTimeout(t),s=e.tapsNumber||1))};return i.addEventListener("touchstart",u),i.addEventListener("touchend",a),{remove(){i.removeEventListener("touchstart",u),i.removeEventListener("touchend",a)}}}drag(e){if(!e)return console.error("Options not provided for drag!");let t=l(e.element);if(!t)return console.error("Element not found!");let n=({touches:i,target:u,currentTarget:a})=>{this.activeTouches.set(i[0].identifier,i[0]),document.addEventListener("touchmove",r),document.addEventListener("touchend",s),e.onDragStart&&e.onDragStart({x:i[0].clientX,y:i[0].clientY,target:u,currentTarget:a})},r=({touches:i})=>{this.activeTouches.has(i[0].identifier)&&e.onDrag&&e.onDrag({x:i[0].clientX,y:i[0].clientY})},s=({touches:i})=>{this.activeTouches.delete(i[0].identifier),document.removeEventListener("touchmove",r),document.removeEventListener("touchend",s),e.onDragEnd&&e.onDragEnd({x:i[0].clientX,y:i[0].clientY})};return t.addEventListener("touchstart",n),{remove(){t.removeEventListener("touchstart",n)}}}swipe(e){if(!e)return console.error("Options not provided for swipe!");let t,n,r,s=!0,i=100;e.touchNumber||=1;let u=l(e.element);if(!u)return console.error("Element not found!");let a=({touches:h})=>{this.activeTouches.set(h[0].identifier,h[0]),this.activeTouches.size>e.touchNumber&&(document.removeEventListener("touchmove",c),document.removeEventListener("touchend",d)),this.activeTouches.size===e.touchNumber&&(t=setTimeout(()=>{s=!1,clearTimeout(t),t=null},1e3),document.addEventListener("touchmove",c),document.addEventListener("touchend",d))},c=({touches:h})=>{if(!this.activeTouches.has(h[0].identifier))return;let{clientX:w,clientY:N}=this.activeTouches.get(h[0].identifier),R=h[0].clientX-w,U=h[0].clientY-N;n=D(R,U),r=f(w,N,h[0].clientX,h[0].clientY)},d=({touches:h})=>{this.activeTouches.delete(h[0].identifier),this.activeTouches.size===0&&(document.removeEventListener("touchmove",c),document.removeEventListener("touchend",d),E()&&e.callback(n),clearTimeout(t),s=!0,t=null)},E=()=>s&&e.callback&&n&&r>i;return u.addEventListener("touchstart",a),{remove(){u.removeEventListener("touchstart",a)}}}pinch(e){if(!e)return console.error("Options not provided for pinch!");let t,n=40,r=l(e.element);if(!r)return console.error("Element not found!");let s=({touches:a})=>{this.activeTouches.set(a[0].identifier,a[0]),!(this.activeTouches.size<M)&&(document.addEventListener("touchmove",i),document.addEventListener("touchend",u),t=f(this.activeTouches.get(0).clientX,this.activeTouches.get(0).clientY,this.activeTouches.get(1).clientX,this.activeTouches.get(1).clientY))},i=({touches:a})=>{if(this.activeTouches.size!==M)return;this.activeTouches.set(a[0].identifier,a[0]);let c=f(this.activeTouches.get(0).clientX,this.activeTouches.get(0).clientY,this.activeTouches.get(1).clientX,this.activeTouches.get(1).clientY),d=Math.sign(c-t)*n;t=c;let E=x(this.activeTouches.get(0).clientX,this.activeTouches.get(0).clientY,this.activeTouches.get(1).clientX,this.activeTouches.get(1).clientY);e.callback&&e.callback({pinchDelta:d,midpoint:E})},u=({touches:a})=>{this.activeTouches.delete(a[0].identifier),this.activeTouches.size===0&&(document.removeEventListener("touchmove",i),document.removeEventListener("touchend",u))};return r.addEventListener("touchstart",s),{remove(){r.removeEventListener("touchstart",s)}}}rotate(e){if(!e)return console.error("Options not provided for rotate!");let t=0,n,r=l(e.element);if(!r)return console.error("Element not found!");let s=({touches:c})=>{this.activeTouches.size<M||(this.activeTouches.set(c[0].identifier,c[0]),t=a()-n,e.callback&&e.callback(t))},i=({touches:c})=>{this.activeTouches.set(c[0].identifier,c[0]),this.activeTouches.size===M&&(n=a()-t,document.addEventListener("touchmove",s),document.addEventListener("touchend",u))},u=({touches:c})=>{this.activeTouches.delete(c[0].identifier),document.removeEventListener("touchmove",s),document.removeEventListener("touchend",u)};r.addEventListener("touchstart",i);let a=()=>{let E=this.activeTouches.get(0).clientY-this.activeTouches.get(1).clientY,h=this.activeTouches.get(0).clientX-this.activeTouches.get(1).clientX;return(g(Math.atan2(E,h))+360+90)%360};return{remove(){r.removeEventListener("touchstart",i)}}}},A=new L});var b,H,F,k,X=m(()=>{I();O();W();b=360,H=90,F=class{constructor(e){let t=P();this.options=e,this.rotatingElement=null,this.elementPosition={x:0,y:0},this.angle=0,this.enabled=!1,this.actionName=`rotate-${t}`,this.onMouseDown=this.onMouseDown.bind(this),this.onMouseMove=this.onMouseMove.bind(this),this.onMouseUp=this.onMouseUp.bind(this),this._touchEnabled=!1,this.touchEvents=null,this.init()}set touchEnabled(e){this._touchEnabled!==e&&(this._touchEnabled=e,this._touchEnabled?this.addTouchEvents():this.removeTouchEvents())}init(){if(!this.enabled){if(this.rotatingElement=this.rotatingElement||document.querySelector(this.options.element),!this.rotatingElement)return console.error(`${this.options.element} is not a valid element selector`);this.rotatingElement.addEventListener("mousedown",this.onMouseDown),this.registerAction(),this.enabled=!0}}deinit(){this.enabled&&(this.rotatingElement.removeEventListener("mousedown",this.onMouseDown),this.removeActions(),this.enabled=!1)}onMouseDown(e){document.addEventListener("mousemove",this.onMouseMove),document.addEventListener("mouseup",this.onMouseUp);let{x:t,y:n,height:r,width:s}=this.rotatingElement.getBoundingClientRect();this.elementPosition={x:t+s/2,y:n+r/2};let i=this.getAngle(e.clientX,e.clientY);this.initalAngle=i-this.angle}onMouseMove(e){this.angle=this.getAngle(e.clientX,e.clientY)-this.initalAngle,this.options.snapAngle&&(this.angle=Math.floor(this.angle/this.options.snapAngle)*this.options.snapAngle),T.execute(this.actionName,this.angle)}onMouseUp(){document.removeEventListener("mousemove",this.onMouseMove),document.removeEventListener("mouseup",this.onMouseUp)}registerAction(){T.register(this.actionName,e=>{this.rotatingElement.style.transform=`rotate(${e}deg)`,this.options.onRotation&&this.options.onRotation(e<0?b+e:e)})}removeActions(){T.remove(this.actionName)}addTouchEvents(){this.touchEvents=A.drag({element:this.rotatingElement,onDragStart:({x:e,y:t})=>{this.onMouseDown({clientX:e,clientY:t})},onDrag:({x:e,y:t})=>{this.onMouseMove({clientX:e,clientY:t})},onDragEnd:()=>{this.onMouseUp()}})}removeTouchEvents(){this.touchEvents.remove(),this.touchEvents=null}getAngle(e,t){let n=e-this.elementPosition.x,r=t-this.elementPosition.y;return(g(Math.atan2(r,n))+b+H)%b}},k=F});var C=z((re,Y)=>{X();_();v.init();Y.exports=k});return C();})();
//# sourceMappingURL=rotate.min.js.map