@woosh/meep-engine 2.47.3 → 2.47.8

package/src/engine/input/devices/KeyboardDevice.js

@@ -5,7 +5,7 @@
 import Signal from "../../../core/events/signal/Signal.js";
 import { KeyCodes } from './KeyCodes.js';
 import { KeyboardEvents } from "./events/KeyboardEvents.js";
-import { InputDeviceButton } from "./InputDeviceButton.js";
+import { InputDeviceSwitch } from "./InputDeviceSwitch.js";
 
 /**
  *
@@ -42,7 +42,28 @@ function isFocusable(el) {
         || isInstanceOf(el, HTMLAreaElement)
 }
 
+/**
+ * @readonly
+ * @type {string[]}
+ */
+const codeToKeyNameMap = [];
+
 class KeyboardDevice {
+
+    /**
+     * @readonly
+     */
+    on = {
+        down: new Signal(),
+        up: new Signal()
+    };
+
+    /**
+     * @readonly
+     * @type {Object<InputDeviceSwitch>}
+     */
+    keys = {};
+
     /**
      *
      * @param {EventTarget|Element} domElement
@@ -62,19 +83,6 @@ class KeyboardDevice {
          */
         this.domElement = domElement;
 
-        this.on = {
-            down: new Signal(),
-            up: new Signal()
-        };
-
-
-        /**
-         *
-         * @type {Object<InputDeviceButton>}
-         */
-        const keys = this.keys = {};
-
-        const codeToKeyNameMap = [];
 
         //initialize separate events for each key
         for (let keyName in KeyCodes) {
@@ -83,51 +91,61 @@ class KeyboardDevice {
 
             codeToKeyNameMap[keyCode] = keyName;
 
-            keys[keyName] = new InputDeviceButton();
+            this.keys[keyName] = new InputDeviceSwitch();
         }
 
-        this.__handlerKeyDown = (event) => {
-            this.on.down.send1(event);
+    }
 
-            //hook up dispatch handler for individual keys
-            const keyCode = event.keyCode;
-            const keyName = codeToKeyNameMap[keyCode];
+    /**
+     *
+     * @param {KeyboardEvent} event
+     * @private
+     */
+    #handlerKeyDown = (event) => {
+        this.on.down.send1(event);
 
-            if (keyName !== undefined) {
-                const button = keys[keyName];
+        //hook up dispatch handler for individual keys
+        const keyCode = event.keyCode;
+        const keyName = codeToKeyNameMap[keyCode];
 
-                button.is_down = true;
-                button.down.send1(event);
+        if (keyName !== undefined) {
+            const button = this.keys[keyName];
+
+            button.is_down = true;
+            button.down.send1(event);
 
-            }
         }
+    }
 
-        this.__handlerKeyUp = (event) => {
-            this.on.up.send1(event);
+    /**
+     *
+     * @param {KeyboardEvent} event
+     * @private
+     */
+    #handlerKeyUp = (event) => {
+        this.on.up.send1(event);
 
-            //hook up dispatch handler for individual keys
-            const keyCode = event.keyCode;
+        //hook up dispatch handler for individual keys
+        const keyCode = event.keyCode;
 
-            const keyName = codeToKeyNameMap[keyCode];
+        const keyName = codeToKeyNameMap[keyCode];
 
-            if (keyName !== undefined) {
-                const button = keys[keyName];
+        if (keyName !== undefined) {
+            const button = this.keys[keyName];
 
-                button.is_down = false;
-                button.up.send1(event);
-            }
+            button.is_down = false;
+            button.up.send1(event);
         }
     }
 
-
     start() {
-        this.domElement.addEventListener(KeyboardEvents.KeyDown, this.__handlerKeyDown);
-        this.domElement.addEventListener(KeyboardEvents.KeyUp, this.__handlerKeyUp);
+        this.domElement.addEventListener(KeyboardEvents.KeyDown, this.#handlerKeyDown);
+        this.domElement.addEventListener(KeyboardEvents.KeyUp, this.#handlerKeyUp);
     }
 
     stop() {
-        this.domElement.removeEventListener(KeyboardEvents.KeyDown, this.__handlerKeyDown);
-        this.domElement.removeEventListener(KeyboardEvents.KeyUp, this.__handlerKeyUp);
+        this.domElement.removeEventListener(KeyboardEvents.KeyDown, this.#handlerKeyDown);
+        this.domElement.removeEventListener(KeyboardEvents.KeyUp, this.#handlerKeyUp);
     }
 }
 

package/src/engine/input/devices/PointerDevice.js

@@ -321,117 +321,166 @@ export function readPositionFromMouseEvent(result, event, source = event.target)
     result.set(x, y);
 }
 
-/**
- *
- * @param {EventTarget} domElement html element
- * @constructor
- */
-function PointerDevice(domElement) {
-    assert.notEqual(domElement, undefined, "domElement is undefined");
+export class PointerDevice {
 
     /**
-     * @private
-     * @type {boolean}
+     * @readonly
+     * @type {Vector2}
      */
-    this.isRunning = false;
+    position = new Vector2();
 
     /**
-     *
-     * @type {Element}
-     * @private
+     * @readonly
+     * @type {Vector2}
+     */
+    #anchor_touch_last = new Vector2();
+
+    #globalUp = new Signal();
+
+    #touchStart = new Signal();
+    #touchEnd = new Signal();
+    #touchMove = new Signal();
+
+    /**
+     * @readonly
      */
-    this.__target = null;
+    on = {
+        down: new Signal(),
+        up: new Signal(),
+        move: new Signal(),
+        tap: new Signal(),
+        drag: new Signal(),
+        dragStart: new Signal(),
+        dragEnd: new Signal(),
+        wheel: new Signal(),
+        pinch: new Signal(),
+        pinchStart: new Signal(),
+        pinchEnd: new Signal(),
+    };
 
     /**
      *
-     * @type {EventTarget}
+     * @type {Element|null}
+     * @private
      */
-    this.domElement = domElement;
+    #target = null;
 
-    const position = this.position = new Vector2();
+    /**
+     * @private
+     * @type {boolean}
+     */
+    isRunning = false;
 
     /**
      *
-     * @param {MouseEvent} event
+     * @param {EventTarget} domElement html element
+     * @constructor
      */
-    this.eventHandlerMouseMove = (event) => {
-        event.preventDefault();
+    constructor(domElement) {
+        assert.defined(domElement, "domElement");
 
-        this.__target = event.target;
 
-        this.readPointerPositionFromEvent(position, event);
+        /**
+         *
+         * @type {EventTarget}
+         */
+        this.domElement = domElement;
 
-        this.on.move.send3(position, event, new Vector2(event.movementX, event.movementY));
-    };
-    this.eventHandlerMouseUp = (event) => {
-        this.readPointerPositionFromEvent(position, event);
-        this.on.up.send2(position, event);
-    };
-    this.eventHandlerMouseDown = (event) => {
-        this.readPointerPositionFromEvent(position, event);
-        this.on.down.send2(position, event);
-    };
 
-    const touchStart = new Signal();
-    const touchEnd = new Signal();
-    const touchMove = new Signal();
+        this.#touchStart.add((param0, param1, param2) => {
+            this.on.down.send3(param0, param1, param2);
+        });
 
-    touchStart.add((param0, param1, param2) => {
-        this.on.down.send3(param0, param1, param2);
-    });
+        this.#touchEnd.add((param0, param1, param2) => {
+            this.on.up.send3(param0, param1, param2);
+        });
+        this.#touchMove.add((param0, param1, param2) => {
+            this.on.move.send3(param0, param1, param2);
+        });
 
-    touchEnd.add((param0, param1, param2) => {
-        this.on.up.send3(param0, param1, param2);
-    });
-    touchMove.add((param0, param1, param2) => {
-        this.on.move.send3(param0, param1, param2);
-    });
 
-    const anchor_touch_last = new Vector2();
+        //constructed events
+        observeTap(this.on.up, this.on.down, this.on.move, 10, this.on.tap);
+        observeDrag(this.#globalUp, this.on.down, this.on.move, this.on.dragStart, this.on.dragEnd, this.on.drag);
+        observePinch({
+            touchStart: this.#touchStart,
+            touchEnd: this.#touchEnd,
+            touchMove: this.#touchMove,
+            pinch: this.on.pinch,
+            pinchStart: this.on.pinchStart,
+            pinchEnd: this.on.pinchEnd,
+            device: this
+        });
+    }
 
-    this.eventHandlerTouchStart = function (event) {
-        getTouchCenter(event.touches, position);
-        touchStart.send2(position, event);
+    /**
+     *
+     * @param {MouseEvent} event
+     */
+    #eventHandlerMouseDown = (event) => {
+        this.readPointerPositionFromEvent(this.position, event);
+        this.on.down.send2(this.position, event);
+    }
 
-        anchor_touch_last.copy(position);
-    };
+    /**
+     *
+     * @param {TouchEvent} event
+     */
+    #eventHandlerGlobalTouchEnd = (event) => {
+        getTouchCenter(event.touches, this.position);
+        this.#globalUp.send2(this.position, event);
+    }
 
-    this.eventHandlerTouchEnd = function (event) {
-        getTouchCenter(event.touches, position);
-        touchEnd.send2(position, event);
-    };
+    /**
+     *
+     * @param {MouseEvent} event
+     */
+    #eventHandlerMouseUp = (event) => {
+        this.readPointerPositionFromEvent(this.position, event);
+        this.on.up.send2(this.position, event);
+    }
 
-    this.eventHandlerTouchMove = function (event) {
+    /**
+     *
+     * @param {MouseEvent} event
+     */
+    #eventHandlerGlobalMouseUp = (event) => {
+        this.readPointerPositionFromEvent(this.position, event);
+        this.#globalUp.send2(this.position, event);
+    }
+
+    /**
+     *
+     * @param {TouchEvent} event
+     */
+    #eventHandlerTouchEnd = (event) => {
+        getTouchCenter(event.touches, this.position);
+        this.#touchEnd.send2(this.position, event);
+    }
+
+    /**
+     *
+     * @param {TouchEvent} event
+     */
+    #eventHandlerTouchMove = (event) => {
         event.preventDefault();
 
         getTouchCenter(event.touches, position);
 
         const delta = new Vector2();
 
-        delta.subVectors(position, anchor_touch_last);
+        delta.subVectors(this.position, this.#anchor_touch_last);
 
-        touchMove.send3(position, event, delta);
-
-        anchor_touch_last.copy(position);
-    };
-
-    const globalUp = new Signal();
-
-    this.eventHandlerGlobalTouchEnd = (event) => {
-        getTouchCenter(event.touches, position);
-        globalUp.send2(position, event);
-    };
+        this.#touchMove.send3(this.position, event, delta);
 
-    this.eventHandlerGlobalMouseUp = (event) => {
-        this.readPointerPositionFromEvent(position, event);
-        globalUp.send2(position, event);
-    };
+        this.#anchor_touch_last.copy(this.position);
+    }
 
     /**
      *
      * @param {WheelEvent} event
      */
-    this.eventHandlerWheel = (event) => {
+    #eventHandlerWheel = (event) => {
         event.preventDefault();
 
         //deltas have inconsistent values across browsers, so we will normalize them
@@ -442,147 +491,143 @@ function PointerDevice(domElement) {
 
         const delta = new Vector3(x, y, z);
 
-        this.readPointerPositionFromEvent(position, event);
+        this.readPointerPositionFromEvent(this.position, event);
 
-        this.on.wheel.send3(delta, position, event);
-    };
+        this.on.wheel.send3(delta, this.position, event);
+    }
 
+    /**
+     *
+     * @param {TouchEvent} event
+     */
+    #eventHandlerTouchStart = (event) => {
+        getTouchCenter(event.touches, this.position);
+        this.#touchStart.send2(this.position, event);
 
-    this.on = {
-        down: new Signal(),
-        up: new Signal(),
-        move: new Signal(),
-        tap: new Signal(),
-        drag: new Signal(),
-        dragStart: new Signal(),
-        dragEnd: new Signal(),
-        wheel: new Signal(),
-        pinch: new Signal(),
-        pinchStart: new Signal(),
-        pinchEnd: new Signal(),
-    };
+        this.#anchor_touch_last.copy(this.position);
+    }
 
-    //constructed events
-    observeTap(this.on.up, this.on.down, this.on.move, 10, this.on.tap);
-    observeDrag(globalUp, this.on.down, this.on.move, this.on.dragStart, this.on.dragEnd, this.on.drag);
-    observePinch({
-        touchStart: touchStart,
-        touchEnd: touchEnd,
-        touchMove: touchMove,
-        pinch: this.on.pinch,
-        pinchStart: this.on.pinchStart,
-        pinchEnd: this.on.pinchEnd
-    });
-}
+    /**
+     *
+     * @param {MouseEvent} event
+     */
+    #eventHandlerMouseMove = (event) => {
+        event.preventDefault();
 
-/**
- *
- * @return {Element}
- */
-PointerDevice.prototype.getTargetElement = function () {
-    return this.__target;
-};
+        this.#target = event.target;
 
-/**
- *
- * @param {Element} el
- */
-PointerDevice.prototype.setTargetElement = function (el) {
-    assert.defined(el, 'el');
-    assert.notNull(el, 'el');
+        this.readPointerPositionFromEvent(this.position, event);
 
-    if (this.__target === el) {
-        // no change
-        return;
+        this.on.move.send3(this.position, event, new Vector2(event.movementX, event.movementY));
     }
 
-    let was_running = this.isRunning;
-
-    if (was_running) {
-        // disconnect from previous target
-        this.stop();
+    /**
+     *
+     * @return {Element}
+     */
+    getTargetElement() {
+        return this.#target;
     }
 
-    this.__target = el;
+    /**
+     *
+     * @param {Element} el
+     */
+    setTargetElement(el) {
+        assert.defined(el, 'el');
+        assert.notNull(el, 'el');
 
-    if (was_running) {
-        // restart to maintain original state
-        this.start();
-    }
-}
+        if (this.#target === el) {
+            // no change
+            return;
+        }
 
-/**
- *
- * @param {Vector2} result
- * @param {MouseEvent|TouchEvent} event
- */
-PointerDevice.prototype.readPointerPositionFromEvent = function (result, event) {
-    readPositionFromMouseEvent(result, event, this.domElement);
-};
+        let was_running = this.isRunning;
+
+        if (was_running) {
+            // disconnect from previous target
+            this.stop();
+        }
+
+        this.#target = el;
 
-PointerDevice.prototype.start = function () {
-    if (this.isRunning) {
-        //already running
-        return;
+        if (was_running) {
+            // restart to maintain original state
+            this.start();
+        }
     }
 
-    this.isRunning = true;
+    /**
+     *
+     * @param {Vector2} result
+     * @param {MouseEvent|TouchEvent} event
+     */
+    readPointerPositionFromEvent(result, event) {
+        readPositionFromMouseEvent(result, event, this.domElement);
+    }
 
-    // console.warn("PointerDevice.start");
+    start() {
+        if (this.isRunning) {
+            //already running
+            return;
+        }
 
-    const domElement = this.domElement;
+        this.isRunning = true;
 
-    assert.notEqual(domElement, null, "domElement is null");
-    assert.notEqual(domElement, undefined, "domElement is undefined");
+        // console.warn("PointerDevice.start");
 
-    domElement.addEventListener(MouseEvents.Move, this.eventHandlerMouseMove);
-    domElement.addEventListener(MouseEvents.Up, this.eventHandlerMouseUp);
-    domElement.addEventListener(MouseEvents.Down, this.eventHandlerMouseDown);
+        const domElement = this.domElement;
 
-    domElement.addEventListener(TouchEvents.Start, this.eventHandlerTouchStart);
-    domElement.addEventListener(TouchEvents.End, this.eventHandlerTouchEnd);
-    domElement.addEventListener(TouchEvents.Move, this.eventHandlerTouchMove);
+        assert.notEqual(domElement, null, "domElement is null");
+        assert.notEqual(domElement, undefined, "domElement is undefined");
 
-    window.addEventListener(MouseEvents.Up, this.eventHandlerGlobalMouseUp);
-    window.addEventListener(TouchEvents.End, this.eventHandlerGlobalTouchEnd);
+        domElement.addEventListener(MouseEvents.Move, this.#eventHandlerMouseMove);
+        domElement.addEventListener(MouseEvents.Up, this.#eventHandlerMouseUp);
+        domElement.addEventListener(MouseEvents.Down, this.#eventHandlerMouseDown);
 
-    /*
-    In some cases wheel event gets registered as "passive" by default. This interferes with "preventDefault()"
-    see https://www.chromestatus.com/features/6662647093133312
-     */
-    domElement.addEventListener(MouseEvents.Wheel, this.eventHandlerWheel, { passive: false });
+        domElement.addEventListener(TouchEvents.Start, this.#eventHandlerTouchStart);
+        domElement.addEventListener(TouchEvents.End, this.#eventHandlerTouchEnd);
+        domElement.addEventListener(TouchEvents.Move, this.#eventHandlerTouchMove);
 
+        window.addEventListener(MouseEvents.Up, this.#eventHandlerGlobalMouseUp);
+        window.addEventListener(TouchEvents.End, this.#eventHandlerGlobalTouchEnd);
 
-    domElement.addEventListener("contextmenu", supressContextMenu);
-};
+        /*
+        In some cases wheel event gets registered as "passive" by default. This interferes with "preventDefault()"
+        see https://www.chromestatus.com/features/6662647093133312
+         */
+        domElement.addEventListener(MouseEvents.Wheel, this.#eventHandlerWheel, { passive: false });
 
-PointerDevice.prototype.stop = function () {
-    if (!this.isRunning) {
-        //not running
-        return;
+
+        domElement.addEventListener("contextmenu", supressContextMenu);
     }
 
-    this.isRunning = false;
+    stop() {
+        if (!this.isRunning) {
+            //not running
+            return;
+        }
 
-    // console.warn("PointerDevice.stop");
+        this.isRunning = false;
 
-    const domElement = this.domElement;
+        // console.warn("PointerDevice.stop");
 
-    domElement.removeEventListener(MouseEvents.Move, this.eventHandlerMouseMove);
-    domElement.removeEventListener(MouseEvents.Up, this.eventHandlerMouseUp);
-    domElement.removeEventListener(MouseEvents.Down, this.eventHandlerMouseDown);
+        const domElement = this.domElement;
 
-    domElement.removeEventListener(TouchEvents.Start, this.eventHandlerTouchStart);
-    domElement.removeEventListener(TouchEvents.End, this.eventHandlerTouchEnd);
-    domElement.removeEventListener(TouchEvents.Move, this.eventHandlerTouchMove);
+        domElement.removeEventListener(MouseEvents.Move, this.#eventHandlerMouseMove);
+        domElement.removeEventListener(MouseEvents.Up, this.#eventHandlerMouseUp);
+        domElement.removeEventListener(MouseEvents.Down, this.#eventHandlerMouseDown);
 
-    window.removeEventListener(MouseEvents.Up, this.eventHandlerGlobalMouseUp);
-    window.removeEventListener(TouchEvents.End, this.eventHandlerGlobalTouchEnd);
+        domElement.removeEventListener(TouchEvents.Start, this.#eventHandlerTouchStart);
+        domElement.removeEventListener(TouchEvents.End, this.#eventHandlerTouchEnd);
+        domElement.removeEventListener(TouchEvents.Move, this.#eventHandlerTouchMove);
 
-    domElement.removeEventListener(MouseEvents.Wheel, this.eventHandlerWheel);
+        window.removeEventListener(MouseEvents.Up, this.#eventHandlerGlobalMouseUp);
+        window.removeEventListener(TouchEvents.End, this.#eventHandlerGlobalTouchEnd);
 
+        domElement.removeEventListener(MouseEvents.Wheel, this.#eventHandlerWheel);
 
-    domElement.removeEventListener("contextmenu", supressContextMenu);
-};
 
-export { PointerDevice };
+        domElement.removeEventListener("contextmenu", supressContextMenu);
+    }
+}