@niuee/board
Version:
<h1 align="center"> board </h1> <p align="center"> board supercharges your html canvas element giving it the capabilities to pan, zoom, rotate, and much more. </p> <p align="center"> <a href="https://www.npmjs.com/package/@niuee/board">
3 lines (2 loc) • 2.9 kB
JavaScript
class VanillaKMTEventParser{constructor(eventTarget,stateMachine){this.bindFunctions(),this._stateMachine=stateMachine,this._keyfirstPressed=new Map,this._eventTarget=eventTarget}get disabled(){return this._disabled}set disabled(value){this._disabled=value}get stateMachine(){return this._stateMachine}setUp(){this.addEventListeners(this._eventTarget)}addEventListeners(eventTarget){eventTarget.addEventListener("pointerdown",this.pointerDownHandler),eventTarget.addEventListener("pointerup",this.pointerUpHandler),eventTarget.addEventListener("pointermove",this.pointerMoveHandler),eventTarget.addEventListener("wheel",this.scrollHandler),window.addEventListener("keydown",this.keypressHandler),window.addEventListener("keyup",this.keyupHandler)}tearDown(){this._eventTarget.removeEventListener("pointerdown",this.pointerDownHandler),this._eventTarget.removeEventListener("pointerup",this.pointerUpHandler),this._eventTarget.removeEventListener("pointermove",this.pointerMoveHandler),this._eventTarget.removeEventListener("wheel",this.scrollHandler),window.removeEventListener("keydown",this.keypressHandler),window.removeEventListener("keyup",this.keyupHandler)}bindFunctions(){this.pointerDownHandler=this.pointerDownHandler.bind(this),this.pointerUpHandler=this.pointerUpHandler.bind(this),this.pointerMoveHandler=this.pointerMoveHandler.bind(this),this.scrollHandler=this.scrollHandler.bind(this),this.keypressHandler=this.keypressHandler.bind(this),this.keyupHandler=this.keyupHandler.bind(this)}pointerDownHandler(e){this._disabled||(0!==e.button||"mouse"!==e.pointerType?1!==e.button||"mouse"!==e.pointerType||this.stateMachine.happens("middlePointerDown",{x:e.clientX,y:e.clientY}):this.stateMachine.happens("leftPointerDown",{x:e.clientX,y:e.clientY}))}pointerUpHandler(e){this._disabled||(0!==e.button||"mouse"!==e.pointerType?1!==e.button||"mouse"!==e.pointerType||this.stateMachine.happens("middlePointerUp",{x:e.clientX,y:e.clientY}):this.stateMachine.happens("leftPointerUp",{x:e.clientX,y:e.clientY}))}pointerMoveHandler(e){this._disabled||(1!==e.buttons||"mouse"!==e.pointerType?4!==e.buttons||"mouse"!==e.pointerType||this.stateMachine.happens("middlePointerMove",{x:e.clientX,y:e.clientY}):this.stateMachine.happens("leftPointerMove",{x:e.clientX,y:e.clientY}))}scrollHandler(e){this._disabled||(e.preventDefault(),e.ctrlKey?this.stateMachine.happens("scrollWithCtrl",{x:e.clientX,y:e.clientY,deltaX:e.deltaX,deltaY:e.deltaY}):this.stateMachine.happens("scroll",{deltaX:e.deltaX,deltaY:e.deltaY}))}keypressHandler(e){this._keyfirstPressed.has(e.key)||(this._keyfirstPressed.set(e.key,!0)," "===e.key&&(e.preventDefault(),this.stateMachine.happens("spacebarDown",{})))}keyupHandler(e){this._keyfirstPressed.has(e.key)&&this._keyfirstPressed.delete(e.key)," "===e.key&&this.stateMachine.happens("spacebarUp",{})}}export{VanillaKMTEventParser};
//# sourceMappingURL=index.js.map