web-a2e 1.0.0

package/src/js/input/gamepad-handler.js

@@ -0,0 +1,176 @@
+/*
+ * gamepad-handler.js - Physical game controller support via Gamepad API
+ *
+ * Written by
+ *  Mike Daley <michael_daley@icloud.com>
+ */
+
+const STORAGE_KEY_ENABLED = "gamepad-enabled";
+const STORAGE_KEY_DEADZONE = "gamepad-deadzone";
+const DEFAULT_DEADZONE = 0.1;
+
+export class GamepadHandler {
+  constructor(wasmModule, joystickWindow) {
+    this.wasmModule = wasmModule;
+    this.joystickWindow = joystickWindow;
+    this.enabled = localStorage.getItem(STORAGE_KEY_ENABLED) !== "false";
+    this.deadzone = parseFloat(localStorage.getItem(STORAGE_KEY_DEADZONE)) || DEFAULT_DEADZONE;
+    this.gamepadIndex = null;
+    this.rafId = null;
+
+    // Track previous button state to detect edges
+    this.prevButtons = [false, false];
+
+    this._onConnected = this._onConnected.bind(this);
+    this._onDisconnected = this._onDisconnected.bind(this);
+    this._poll = this._poll.bind(this);
+
+    window.addEventListener("gamepadconnected", this._onConnected);
+    window.addEventListener("gamepaddisconnected", this._onDisconnected);
+
+    // Check if a gamepad is already connected
+    const gamepads = navigator.getGamepads ? navigator.getGamepads() : [];
+    for (let i = 0; i < gamepads.length; i++) {
+      if (gamepads[i]) {
+        this.gamepadIndex = gamepads[i].index;
+        this._notifyWindow();
+        if (this.enabled) {
+          this._startPolling();
+        }
+        break;
+      }
+    }
+  }
+
+  _onConnected(e) {
+    this.gamepadIndex = e.gamepad.index;
+    this._notifyWindow();
+    if (this.enabled) {
+      this._startPolling();
+    }
+  }
+
+  _onDisconnected(e) {
+    if (this.gamepadIndex === e.gamepad.index) {
+      this.gamepadIndex = null;
+      this._notifyWindow();
+    }
+  }
+
+  _notifyWindow() {
+    if (this.joystickWindow && this.joystickWindow.updateGamepadStatus) {
+      const gp = this._getGamepad();
+      this.joystickWindow.updateGamepadStatus(gp ? gp.id : null, this.enabled);
+    }
+  }
+
+  _getGamepad() {
+    if (this.gamepadIndex === null) return null;
+    const gamepads = navigator.getGamepads ? navigator.getGamepads() : [];
+    return gamepads[this.gamepadIndex] || null;
+  }
+
+  _applyDeadzone(value) {
+    if (Math.abs(value) < this.deadzone) return 0;
+    // Rescale so the range beyond deadzone maps to 0..1
+    const sign = value > 0 ? 1 : -1;
+    return sign * (Math.abs(value) - this.deadzone) / (1 - this.deadzone);
+  }
+
+  _poll() {
+    const gp = this._getGamepad();
+    if (!gp) {
+      this.rafId = null;
+      return;
+    }
+    if (this.enabled) {
+      // Left stick axes (0 = X, 1 = Y), range -1..1
+      const rawX = gp.axes[0] || 0;
+      const rawY = gp.axes[1] || 0;
+      const adjX = this._applyDeadzone(rawX);
+      const adjY = this._applyDeadzone(rawY);
+
+      // Map -1..1 to 0..1
+      const normX = (adjX + 1) / 2;
+      const normY = (adjY + 1) / 2;
+
+      // Map to 0-255 for paddle values
+      const paddleX = Math.round(normX * 255);
+      const paddleY = Math.round(normY * 255);
+
+      if (this.wasmModule._setPaddleValue) {
+        this.wasmModule._setPaddleValue(0, paddleX);
+        this.wasmModule._setPaddleValue(1, paddleY);
+      }
+
+      // Update the joystick window knob to reflect controller position
+      if (this.joystickWindow) {
+        this.joystickWindow.setExternalPosition(normX, normY);
+      }
+
+      // Buttons 0 and 1 (A/B on standard controllers)
+      for (let i = 0; i < 2; i++) {
+        const pressed = gp.buttons[i] ? gp.buttons[i].pressed : false;
+        if (pressed !== this.prevButtons[i]) {
+          this.prevButtons[i] = pressed;
+          if (this.wasmModule._setButton) {
+            this.wasmModule._setButton(i, pressed);
+          }
+          if (this.joystickWindow) {
+            this.joystickWindow.setExternalButton(i, pressed);
+          }
+        }
+      }
+    }
+
+    this.rafId = requestAnimationFrame(this._poll);
+  }
+
+  _startPolling() {
+    if (this.rafId !== null) return;
+    this.rafId = requestAnimationFrame(this._poll);
+  }
+
+  _stopPolling() {
+    if (this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+    }
+  }
+
+  start() {
+    if (this.enabled && this.gamepadIndex !== null) {
+      this._startPolling();
+    }
+  }
+
+  stop() {
+    this._stopPolling();
+  }
+
+  setEnabled(enabled) {
+    this.enabled = enabled;
+    localStorage.setItem(STORAGE_KEY_ENABLED, enabled);
+    this._notifyWindow();
+    if (enabled && this.gamepadIndex !== null) {
+      this._startPolling();
+    } else if (!enabled) {
+      this._stopPolling();
+    }
+  }
+
+  setDeadzone(value) {
+    this.deadzone = Math.max(0, Math.min(0.5, value));
+    localStorage.setItem(STORAGE_KEY_DEADZONE, this.deadzone);
+  }
+
+  isConnected() {
+    return this._getGamepad() !== null;
+  }
+
+  destroy() {
+    this.stop();
+    window.removeEventListener("gamepadconnected", this._onConnected);
+    window.removeEventListener("gamepaddisconnected", this._onDisconnected);
+  }
+}

package/src/js/input/index.js

@@ -0,0 +1,12 @@
+/*
+ * index.js - Input subsystem initialization and exports
+ *
+ * Written by
+ *  Mike Daley <michael_daley@icloud.com>
+ */
+
+export { InputHandler } from "./input-handler.js";
+export { TextSelection } from "./text-selection.js";
+export { JoystickWindow } from "./joystick-window.js";
+export { MouseHandler } from "./mouse-handler.js";
+export { GamepadHandler } from "./gamepad-handler.js";

package/src/js/input/input-handler.js

@@ -0,0 +1,396 @@
+/*
+ * input-handler.js - Keyboard input handling for the emulator
+ *
+ * Written by
+ *  Mike Daley <michael_daley@icloud.com>
+ */
+
+export class InputHandler {
+  constructor(wasmModule) {
+    this.wasmModule = wasmModule;
+
+    // Canvas element for focus management
+    this.canvas = null;
+
+    // Hidden input for mobile keyboard
+    this.mobileInput = null;
+    this.isMobile = false;
+
+    // Paste queue for typing pasted text
+    this.pasteQueue = [];
+    this.pasteTimer = null;
+    this.pasteSpeedUp = false; // whether we've set a speed multiplier for paste
+    this.savedSpeedMultiplier = 1; // speed before paste started
+
+    // MessageChannel for zero-delay batch scheduling (avoids setTimeout's ~4ms minimum)
+    this.pasteChannel = new MessageChannel();
+    this.pasteChannel.port1.onmessage = () => this.processPasteQueue();
+  }
+
+  init() {
+    // Detect mobile/touch devices
+    this.isMobile = this.detectMobile();
+
+    // Get canvas and make it focusable
+    this.canvas = document.getElementById("screen");
+    this.canvas.tabIndex = 1; // Make canvas focusable
+
+    // Create hidden input for mobile keyboard
+    if (this.isMobile) {
+      this.createMobileInput();
+    }
+
+    // Focus canvas on click (or mobile input on mobile)
+    this.canvas.addEventListener("click", () => {
+      if (this.isMobile && this.mobileInput) {
+        this.mobileInput.focus();
+      } else {
+        this.canvas.focus();
+      }
+    });
+
+    // Also handle touch events for mobile
+    this.canvas.addEventListener("touchend", (e) => {
+      if (this.isMobile && this.mobileInput) {
+        // Small delay to ensure touch event completes
+        setTimeout(() => {
+          this.mobileInput.focus();
+        }, 50);
+      }
+    });
+
+    // Focus canvas initially (not on mobile - wait for user tap)
+    if (!this.isMobile) {
+      setTimeout(() => this.canvas.focus(), 100);
+    }
+
+    // Keyboard event listeners - attach to canvas for better focus control
+    this.canvas.addEventListener("keydown", (e) => this.handleKeyDown(e));
+    this.canvas.addEventListener("keyup", (e) => this.handleKeyUp(e));
+
+    // Also listen on document but only process if canvas has focus or no other element does
+    document.addEventListener("keydown", (e) => {
+      // Only handle if canvas has focus or the active element is body
+      if (
+        document.activeElement === this.canvas ||
+        document.activeElement === document.body
+      ) {
+        this.handleKeyDown(e);
+      }
+    });
+
+    document.addEventListener("keyup", (e) => {
+      if (
+        document.activeElement === this.canvas ||
+        document.activeElement === document.body
+      ) {
+        this.handleKeyUp(e);
+      }
+    });
+
+    // Paste event listener
+    document.addEventListener("paste", (e) => {
+      if (
+        document.activeElement === this.canvas ||
+        document.activeElement === document.body
+      ) {
+        this.handlePaste(e);
+      }
+    });
+  }
+
+  handleKeyDown(event) {
+    const keyCode = event.keyCode || event.which;
+
+    // Get modifier states
+    const shift = event.shiftKey;
+    const ctrl = event.ctrlKey;
+    const alt = event.altKey;
+    const meta = event.metaKey;
+    const capsLock = event.getModifierState && event.getModifierState('CapsLock');
+
+    // Don't interfere with browser shortcuts
+    if (ctrl && keyCode === 82) {
+      // Ctrl+R for refresh
+      return;
+    }
+
+    // Prevent default for these keys when not using modifiers
+    if (this.shouldPreventDefault(event)) {
+      event.preventDefault();
+    }
+
+    // Always prevent default for printable characters when canvas has focus
+    // to stop them from triggering button shortcuts
+    if (document.activeElement === this.canvas) {
+      event.preventDefault();
+    }
+
+    // Send raw keycode to WASM - C++ handles the translation
+    this.wasmModule._handleRawKeyDown(keyCode, shift, ctrl, alt, meta, capsLock);
+  }
+
+  handleKeyUp(event) {
+    const keyCode = event.keyCode || event.which;
+
+    // Get modifier states
+    const shift = event.shiftKey;
+    const ctrl = event.ctrlKey;
+    const alt = event.altKey;
+    const meta = event.metaKey;
+
+    // Send raw keycode to WASM
+    this.wasmModule._handleRawKeyUp(keyCode, shift, ctrl, alt, meta);
+  }
+
+  shouldPreventDefault(event) {
+    const keyCode = event.keyCode || event.which;
+
+    // Prevent default for these keys when not using modifiers
+    const preventKeys = [
+      8, // Backspace
+      9, // Tab
+      27, // Escape
+      32, // Space (prevent page scroll)
+      37, 38, 39, 40, // Arrow keys
+    ];
+
+    if (preventKeys.includes(keyCode) && !event.ctrlKey && !event.metaKey) {
+      return true;
+    }
+
+    return false;
+  }
+
+  // Handle paste event - queues text for input at accelerated speed
+  handlePaste(event) {
+    event.preventDefault();
+
+    const text = (event.clipboardData || window.clipboardData).getData("text");
+    if (!text) return;
+
+    this.queueTextInput(text, { speedMultiplier: 8 });
+  }
+
+  // Convert character to Apple II key code (for paste only)
+  charToAppleKey(char) {
+    const result = this.wasmModule._charToAppleKey(char.charCodeAt(0));
+    return result >= 0 ? result : null;
+  }
+
+  // Process paste queue in batches, yielding to the browser periodically
+  // to keep the UI responsive and let the audio worklet drive emulation.
+  // Speed multiplier (set via WASM) makes the audio-driven emulation run
+  // faster, while small boost cycle batches handle immediate key processing.
+  processPasteQueue() {
+    if (this.pasteQueue.length === 0) {
+      this.restorePasteSpeed();
+      this.pasteTimer = null;
+      return;
+    }
+
+    const BOOST_BATCH = 500; // small cycle batch for immediate key processing
+    const TIME_BUDGET_MS = 30;
+    const batchEnd = performance.now() + TIME_BUDGET_MS;
+
+    while (this.pasteQueue.length > 0 && performance.now() < batchEnd) {
+      // Wait for keyboard ready, running small boost cycles until it is
+      if (this.wasmModule._isKeyboardReady) {
+        while (!this.wasmModule._isKeyboardReady()) {
+          this.wasmModule._runCycles(BOOST_BATCH);
+          if (performance.now() >= batchEnd) break;
+        }
+        if (!this.wasmModule._isKeyboardReady()) {
+          break;
+        }
+      }
+
+      const appleKey = this.pasteQueue.shift();
+      this.wasmModule._keyDown(appleKey);
+
+      // Run a small burst to start processing the keystroke
+      this.wasmModule._runCycles(BOOST_BATCH);
+    }
+
+    // Schedule next batch if more characters remain
+    if (this.pasteQueue.length > 0) {
+      this.pasteTimer = true;
+      this.pasteChannel.port2.postMessage(null);
+    } else {
+      this.restorePasteSpeed();
+      this.pasteTimer = null;
+      if (this.pasteOnComplete) {
+        this.pasteOnComplete(false); // false = completed normally
+        this.pasteOnComplete = null;
+      }
+    }
+  }
+
+  // Set emulation speed multiplier for fast paste/input
+  setPasteSpeed(multiplier) {
+    if (!this.pasteSpeedUp && this.wasmModule._setSpeedMultiplier) {
+      this.savedSpeedMultiplier = this.wasmModule._getSpeedMultiplier
+        ? this.wasmModule._getSpeedMultiplier()
+        : 1;
+      this.wasmModule._setSpeedMultiplier(multiplier);
+      this.pasteSpeedUp = true;
+    }
+  }
+
+  // Restore emulation speed after paste completes
+  restorePasteSpeed() {
+    if (this.pasteSpeedUp && this.wasmModule._setSpeedMultiplier) {
+      this.wasmModule._setSpeedMultiplier(this.savedSpeedMultiplier);
+      this.pasteSpeedUp = false;
+    }
+  }
+
+  // Cancel any pending paste operation
+  cancelPaste() {
+    this.pasteTimer = null;
+    this.pasteQueue = [];
+    this.restorePasteSpeed();
+    if (this.pasteOnComplete) {
+      this.pasteOnComplete(true); // true = cancelled
+      this.pasteOnComplete = null;
+    }
+  }
+
+  // Queue text for programmatic input (used by BasicProgramWindow)
+  // speedMultiplier: emulation speed during input (1=normal, 8=8x)
+  // onStart: callback when pasting begins
+  // onComplete: callback when pasting finishes (or is cancelled)
+  queueTextInput(text, { speedMultiplier = 8, onStart = null, onComplete = null } = {}) {
+    this.pasteOnComplete = onComplete;
+    this.setPasteSpeed(speedMultiplier);
+
+    for (const char of text) {
+      const appleKey = this.charToAppleKey(char);
+      if (appleKey !== null) {
+        this.pasteQueue.push(appleKey);
+      }
+    }
+
+    // Start processing queue if not already running
+    if (!this.pasteTimer && this.pasteQueue.length > 0) {
+      if (onStart) onStart();
+      this.processPasteQueue();
+    }
+  }
+
+  // Check if a paste operation is in progress
+  isPasting() {
+    return this.pasteQueue.length > 0 || this.pasteTimer !== null;
+  }
+
+  // Detect if we're on a mobile/touch device
+  detectMobile() {
+    // Check for touch capability and mobile user agent
+    const hasTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
+    const isMobileUA = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+    // Also check for small screen width as a fallback
+    const isSmallScreen = window.innerWidth <= 800;
+
+    return hasTouch && (isMobileUA || isSmallScreen);
+  }
+
+  // Create hidden input element for mobile keyboard
+  createMobileInput() {
+    this.mobileInput = document.createElement('input');
+    this.mobileInput.type = 'text';
+    this.mobileInput.id = 'mobile-keyboard-input';
+    this.mobileInput.autocomplete = 'off';
+    this.mobileInput.autocapitalize = 'none';
+    this.mobileInput.autocorrect = 'off';
+    this.mobileInput.spellcheck = false;
+
+    // Style to be invisible but still functional
+    Object.assign(this.mobileInput.style, {
+      position: 'absolute',
+      left: '-9999px',
+      top: '0',
+      width: '1px',
+      height: '1px',
+      opacity: '0',
+      pointerEvents: 'none',
+      zIndex: '-1'
+    });
+
+    document.body.appendChild(this.mobileInput);
+
+    // Handle input events from mobile keyboard
+    this.mobileInput.addEventListener('input', (e) => {
+      const data = e.data;
+      if (data) {
+        // Process each character typed
+        for (const char of data) {
+          this.sendCharToEmulator(char);
+        }
+      }
+      // Clear the input to be ready for next character
+      this.mobileInput.value = '';
+    });
+
+    // Handle special keys via keydown
+    this.mobileInput.addEventListener('keydown', (e) => {
+      const keyCode = e.keyCode || e.which;
+
+      // Handle special keys that don't generate input events
+      switch (keyCode) {
+        case 8:  // Backspace
+        case 13: // Enter
+        case 27: // Escape
+        case 9:  // Tab
+          e.preventDefault();
+          this.handleKeyDown(e);
+          break;
+      }
+    });
+
+    this.mobileInput.addEventListener('keyup', (e) => {
+      const keyCode = e.keyCode || e.which;
+
+      // Handle special key releases
+      switch (keyCode) {
+        case 8:  // Backspace
+        case 13: // Enter
+        case 27: // Escape
+        case 9:  // Tab
+          this.handleKeyUp(e);
+          break;
+      }
+    });
+
+    // Handle blur - show visual feedback that keyboard is hidden
+    this.mobileInput.addEventListener('blur', () => {
+      this.canvas.classList.remove('keyboard-active');
+    });
+
+    // Handle focus - show visual feedback that keyboard is active
+    this.mobileInput.addEventListener('focus', () => {
+      this.canvas.classList.add('keyboard-active');
+    });
+  }
+
+  // Send a character to the emulator (for mobile input)
+  sendCharToEmulator(char) {
+    const appleKey = this.charToAppleKey(char);
+    if (appleKey !== null) {
+      this.wasmModule._keyDown(appleKey);
+    }
+  }
+
+  // Show mobile keyboard programmatically
+  showMobileKeyboard() {
+    if (this.isMobile && this.mobileInput) {
+      this.mobileInput.focus();
+    }
+  }
+
+  // Hide mobile keyboard
+  hideMobileKeyboard() {
+    if (this.isMobile && this.mobileInput) {
+      this.mobileInput.blur();
+    }
+  }
+}