MouseInput.js 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. class MouseInput {
  2. constructor() {
  3. this.mouseListener = {};
  4. this.mouseCanvas = {};
  5. this.position = {x: 0, y: 0};
  6. this.handlers = {};
  7. }
  8. attachHandler(eventName, handleFunction) {
  9. this.handlers[eventName] = handleFunction;
  10. this.mouseCanvas.addEventListener(eventName, handleFunction);
  11. }
  12. detachHandler(eventName) {
  13. this.mouseCanvas.removeEventListener(eventName, this.handlers[eventName]);
  14. delete this.handlers[eventName];
  15. }
  16. attach(canvas, listener) {
  17. this.mouseListener = listener;
  18. this.mouseCanvas = canvas;
  19. this.attachHandler('mousemove', (event) => {this.handleMouseMove(event)});
  20. this.attachHandler('mousedown', (event) => this.handleMouseDown(event));
  21. this.attachHandler('mouseup', (event) => this.handleMouseUp(event));
  22. this.attachHandler('contextmenu', (event) => this.handleContextMenu(event));
  23. this.attachHandler('touchstart', (event) => this.handleTouchStart(event));
  24. this.attachHandler('touchmove', (event) => this.handleTouchMove(event));
  25. this.attachHandler('touchend', (event) => this.handleTouchEnd(event));
  26. }
  27. detach() {
  28. this.detachHandler('mousemove');
  29. this.detachHandler('mousedown');
  30. this.detachHandler('mouseup');
  31. this.detachHandler('contextmenu');
  32. this.detachHandler('touchstart');
  33. this.detachHandler('touchmove');
  34. this.detachHandler('touchend');
  35. };
  36. handleMouseMove(event) {
  37. this.position.x = event.clientX;
  38. this.position.y = event.clientY;
  39. if (!this.mouseListener.mouseMove) { return; }
  40. this.mouseListener.mouseMove(this.mouseCanvas, event.offsetX, event.offsetY);
  41. }
  42. handleMouseDown(event) {
  43. this.position.x = event.clientX;
  44. this.position.y = event.clientY;
  45. if (!this.mouseListener.mouseDown) { return; }
  46. this.mouseListener.mouseDown(this.mouseCanvas, event.button, event.offsetX, event.offsetY);
  47. }
  48. handleMouseUp(event) {
  49. this.position.x = event.clientX;
  50. this.position.y = event.clientY;
  51. if (!this.mouseListener.mouseUp) { return; }
  52. this.mouseListener.mouseUp(this.mouseCanvas, event.button, event.offsetX, event.offsetY);
  53. };
  54. handleTouchStart(event) {
  55. this.position.x = event.clientX;
  56. this.position.y = event.clientY;
  57. if (!this.mouseListener.touchStart) { return; }
  58. this.mouseListener.touchStart(this.mouseCanvas, event.touches[0].clientX, event.touches[0].clientY);
  59. }
  60. handleTouchMove(event) {
  61. this.position.x = event.clientX;
  62. this.position.y = event.clientY;
  63. if (!this.mouseListener.touchMove) { return; }
  64. this.mouseListener.touchMove(this.mouseCanvas, event.touches[0].clientX, event.touches[0].clientY);
  65. }
  66. handleTouchEnd(event) {
  67. this.position.x = event.clientX;
  68. this.position.y = event.clientY;
  69. if (!this.mouseListener.touchEnd) { return; }
  70. this.mouseListener.touchEnd(this.mouseCanvas, event.offsetX, event.offsetY);
  71. }
  72. handleContextMenu(event) {
  73. this.position.x = event.clientX;
  74. this.position.y = event.clientY;
  75. event.preventDefault();
  76. if (!this.mouseListener.contextMenu) { return false; }
  77. this.mouseListener.touchEnd(this.mouseCanvas, event);
  78. return false;
  79. }
  80. };