@blibliki/engine 0.3.8 → 0.3.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blibliki/engine",
-  "version": "0.3.8",
+  "version": "0.3.10",
   "type": "module",
   "source": "src/index.ts",
   "main": "dist/index.cjs",
@@ -17,11 +17,11 @@
     "vitest": "^4.0.6"
   },
   "dependencies": {
+    "@julusian/midi": "^3.6.1",
     "es-toolkit": "^1.41.0",
     "node-web-audio-api": "^1.0.3",
-    "webmidi": "^3.1.14",
-    "@blibliki/transport": "^0.3.8",
-    "@blibliki/utils": "^0.3.8"
+    "@blibliki/utils": "^0.3.10",
+    "@blibliki/transport": "^0.3.10"
   },
   "scripts": {
     "build": "tsup",

package/src/core/Note/index.ts

@@ -1,5 +1,5 @@
 import { Seconds } from "@blibliki/transport";
-import { Message } from "webmidi";
+import Message from "../midi/Message";
 import frequencyTable from "./frequencyTable";
 
 const Notes = ["C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B"];

package/src/core/midi/Message.ts

@@ -0,0 +1,46 @@
+/**
+ * Simple wrapper around MIDI message data (Uint8Array)
+ * Replaces the webmidi Message class with native Web MIDI API data
+ */
+export default class Message {
+  public readonly data: Uint8Array;
+
+  constructor(data: Uint8Array) {
+    this.data = data;
+  }
+
+  /**
+   * Returns the data bytes (excluding the status byte)
+   */
+  get dataBytes(): number[] {
+    return Array.from(this.data.slice(1));
+  }
+
+  /**
+   * Returns the MIDI message type based on the status byte
+   */
+  get type(): string {
+    const statusByte = this.data[0];
+    const messageType = statusByte & 0xf0;
+
+    switch (messageType) {
+      case 0x90: // Note On
+        // Check if velocity is 0 (which is actually Note Off)
+        return this.data[2] === 0 ? "noteoff" : "noteon";
+      case 0x80: // Note Off
+        return "noteoff";
+      case 0xb0: // Control Change
+        return "controlchange";
+      case 0xe0: // Pitch Bend
+        return "pitchbend";
+      case 0xd0: // Channel Pressure (Aftertouch)
+        return "channelaftertouch";
+      case 0xa0: // Polyphonic Key Pressure
+        return "keyaftertouch";
+      case 0xc0: // Program Change
+        return "programchange";
+      default:
+        return "unknown";
+    }
+  }
+}

package/src/core/midi/MidiDevice.ts

@@ -1,6 +1,7 @@
 import { Context } from "@blibliki/utils";
-import { MessageEvent, Input } from "webmidi";
+import Message from "./Message";
 import MidiEvent, { MidiEventType } from "./MidiEvent";
+import type { IMidiInputPort, IMidiMessageEvent } from "./adapters";
 
 export enum MidiPortState {
   connected = "connected",
@@ -25,11 +26,12 @@ export default class MidiDevice implements IMidiDevice {
   eventListerCallbacks: EventListerCallback[] = [];
 
   private context: Readonly<Context>;
-  private input: Input;
+  private input: IMidiInputPort;
+  private messageHandler: ((event: IMidiMessageEvent) => void) | null = null;
 
-  constructor(input: Input, context: Context) {
+  constructor(input: IMidiInputPort, context: Context) {
     this.id = input.id;
-    this.name = input.name || `Device ${input.id}`;
+    this.name = input.name;
     this.input = input;
     this.context = context;
 
@@ -41,13 +43,17 @@ export default class MidiDevice implements IMidiDevice {
   }
 
   connect() {
-    this.input.addListener("midimessage", (e: MessageEvent) => {
+    this.messageHandler = (e: IMidiMessageEvent) => {
       this.processEvent(e);
-    });
+    };
+    this.input.addEventListener(this.messageHandler);
   }
 
   disconnect() {
-    this.input.removeListener();
+    if (this.messageHandler) {
+      this.input.removeEventListener(this.messageHandler);
+      this.messageHandler = null;
+    }
   }
 
   serialize() {
@@ -66,10 +72,11 @@ export default class MidiDevice implements IMidiDevice {
     );
   }
 
-  private processEvent(event: MessageEvent) {
+  private processEvent(event: IMidiMessageEvent) {
+    const message = new Message(event.data);
     const midiEvent = new MidiEvent(
-      event.message,
-      this.context.browserToContextTime(event.timestamp),
+      message,
+      this.context.browserToContextTime(event.timeStamp),
     );
 
     switch (midiEvent.type) {

package/src/core/midi/MidiDeviceManager.ts

@@ -1,7 +1,7 @@
 import { Context } from "@blibliki/utils";
-import { Input, Output, WebMidi } from "webmidi";
 import ComputerKeyboardDevice from "./ComputerKeyboardDevice";
 import MidiDevice from "./MidiDevice";
+import { createMidiAdapter, type IMidiAccess } from "./adapters";
 
 type ListenerCallback = (device: MidiDevice) => void;
 
@@ -10,6 +10,8 @@ export default class MidiDeviceManager {
   private initialized = false;
   private listeners: ListenerCallback[] = [];
   private context: Readonly<Context>;
+  private midiAccess: IMidiAccess | null = null;
+  private adapter = createMidiAdapter();
 
   constructor(context: Context) {
     this.context = context;
@@ -39,15 +41,25 @@ export default class MidiDeviceManager {
     if (this.initialized) return;
 
     try {
-      await WebMidi.enable();
+      if (!this.adapter.isSupported()) {
+        console.warn("MIDI is not supported on this platform");
+        return;
+      }
 
-      WebMidi.inputs.forEach((input) => {
+      this.midiAccess = await this.adapter.requestMIDIAccess();
+
+      if (!this.midiAccess) {
+        console.error("Failed to get MIDI access");
+        return;
+      }
+
+      for (const input of this.midiAccess.inputs()) {
         if (!this.devices.has(input.id)) {
           this.devices.set(input.id, new MidiDevice(input, this.context));
         }
-      });
+      }
     } catch (err) {
-      console.error("Error enabling WebMidi:", err);
+      console.error("Error enabling MIDI:", err);
     }
   }
 
@@ -59,34 +71,32 @@ export default class MidiDeviceManager {
   }
 
   private listenChanges() {
-    WebMidi.addListener("connected", (event) => {
-      const port = event.port as Input | Output;
-      if (port instanceof Output) return;
-
-      if (this.devices.has(port.id)) return;
-
-      const device = new MidiDevice(port, this.context);
-      this.devices.set(device.id, device);
-
-      this.listeners.forEach((listener) => {
-        listener(device);
-      });
-    });
-
-    WebMidi.addListener("disconnected", (event) => {
-      const port = event.port as Input | Output;
-      if (port instanceof Output) return;
-
-      const device = this.devices.get(port.id);
-      if (!device) return;
-      if (device instanceof ComputerKeyboardDevice) return;
-
-      device.disconnect();
-      this.devices.delete(device.id);
-
-      this.listeners.forEach((listener) => {
-        listener(device);
-      });
+    if (!this.midiAccess) return;
+
+    this.midiAccess.addEventListener("statechange", (port) => {
+      if (port.state === "connected") {
+        // Device connected
+        if (this.devices.has(port.id)) return;
+
+        const device = new MidiDevice(port, this.context);
+        this.devices.set(device.id, device);
+
+        this.listeners.forEach((listener) => {
+          listener(device);
+        });
+      } else {
+        // Device disconnected
+        const device = this.devices.get(port.id);
+        if (!device) return;
+        if (device instanceof ComputerKeyboardDevice) return;
+
+        device.disconnect();
+        this.devices.delete(device.id);
+
+        this.listeners.forEach((listener) => {
+          listener(device);
+        });
+      }
     });
   }
 }

package/src/core/midi/MidiEvent.ts

@@ -1,6 +1,6 @@
 import { ContextTime } from "@blibliki/transport";
-import { Message } from "webmidi";
 import Note, { INote } from "../Note";
+import Message from "./Message";
 
 export enum MidiEventType {
   noteOn = "noteon",

package/src/core/midi/adapters/NodeMidiAdapter.ts

@@ -0,0 +1,174 @@
+/**
+ * node-midi adapter for Node.js
+ */
+import { isNode } from "es-toolkit";
+import type {
+  IMidiAccess,
+  IMidiAdapter,
+  IMidiInputPort,
+  MidiMessageCallback,
+} from "./types";
+
+// Dynamic import type for node-midi
+type NodeMidiInput = {
+  getPortCount(): number;
+  getPortName(port: number): string;
+  openPort(port: number): void;
+  closePort(): void;
+  on(
+    event: "message",
+    callback: (deltaTime: number, message: number[]) => void,
+  ): void;
+  off(
+    event: "message",
+    callback: (deltaTime: number, message: number[]) => void,
+  ): void;
+  isPortOpen(): boolean;
+};
+
+type NodeMidiModule = {
+  Input: new () => NodeMidiInput;
+};
+
+class NodeMidiInputPort implements IMidiInputPort {
+  readonly id: string;
+  readonly name: string;
+  private portIndex: number;
+  private input: NodeMidiInput;
+  private callbacks = new Set<MidiMessageCallback>();
+  private handler: ((deltaTime: number, message: number[]) => void) | null =
+    null;
+  private _state: "connected" | "disconnected" = "disconnected";
+
+  constructor(portIndex: number, name: string, input: NodeMidiInput) {
+    this.portIndex = portIndex;
+    this.id = `node-midi-${portIndex}`;
+    this.name = name;
+    this.input = input;
+  }
+
+  get state(): "connected" | "disconnected" {
+    return this._state;
+  }
+
+  setState(state: "connected" | "disconnected"): void {
+    this._state = state;
+  }
+
+  addEventListener(callback: MidiMessageCallback): void {
+    if (this.callbacks.size === 0) {
+      this.handler = (_deltaTime: number, message: number[]) => {
+        const event = {
+          data: new Uint8Array(message),
+          timeStamp: performance.now(),
+        };
+
+        this.callbacks.forEach((cb) => {
+          cb(event);
+        });
+      };
+
+      try {
+        if (!this.input.isPortOpen()) {
+          this.input.openPort(this.portIndex);
+          this._state = "connected";
+        }
+        this.input.on("message", this.handler);
+      } catch (err) {
+        console.error(`Error opening MIDI port ${this.portIndex}:`, err);
+      }
+    }
+    this.callbacks.add(callback);
+  }
+
+  removeEventListener(callback: MidiMessageCallback): void {
+    this.callbacks.delete(callback);
+
+    if (this.callbacks.size === 0 && this.handler) {
+      try {
+        this.input.off("message", this.handler);
+        if (this.input.isPortOpen()) {
+          this.input.closePort();
+          this._state = "disconnected";
+        }
+      } catch (err) {
+        console.error(`Error closing MIDI port ${this.portIndex}:`, err);
+      }
+      this.handler = null;
+    }
+  }
+}
+
+class NodeMidiAccess implements IMidiAccess {
+  private ports = new Map<string, NodeMidiInputPort>();
+  private MidiModule: NodeMidiModule;
+
+  constructor(MidiModule: NodeMidiModule) {
+    this.MidiModule = MidiModule;
+    this.scanPorts();
+  }
+
+  private scanPorts(): void {
+    try {
+      const input = new this.MidiModule.Input();
+      const portCount = input.getPortCount();
+
+      for (let i = 0; i < portCount; i++) {
+        const portName = input.getPortName(i);
+        const id = `node-midi-${i}`;
+
+        if (!this.ports.has(id)) {
+          // Create a new input instance for each port
+          const portInput = new this.MidiModule.Input();
+          const port = new NodeMidiInputPort(i, portName, portInput);
+          this.ports.set(id, port);
+        }
+      }
+
+      // Clean up the scanning input
+      if (input.isPortOpen()) {
+        input.closePort();
+      }
+    } catch (err) {
+      console.error("Error scanning MIDI ports:", err);
+    }
+  }
+
+  *inputs(): IterableIterator<IMidiInputPort> {
+    for (const [, port] of this.ports) {
+      yield port;
+    }
+  }
+
+  addEventListener(
+    _event: "statechange",
+    _callback: (port: IMidiInputPort) => void,
+  ): void {
+    // node-midi doesn't support hot-plugging detection
+    // This could be implemented with polling if needed
+    console.warn(
+      "Hot-plug detection not supported with node-midi adapter. Restart required for new devices.",
+    );
+  }
+}
+
+export default class NodeMidiAdapter implements IMidiAdapter {
+  async requestMIDIAccess(): Promise<IMidiAccess | null> {
+    try {
+      // Dynamic import to avoid bundling in browser builds
+      const midi = (await import("@julusian/midi")) as
+        | NodeMidiModule
+        | { default: NodeMidiModule };
+      const midiModule = "default" in midi ? midi.default : midi;
+      return new NodeMidiAccess(midiModule);
+    } catch (err) {
+      console.error("Error loading node-midi:", err);
+      return null;
+    }
+  }
+
+  isSupported(): boolean {
+    // Check if we're in Node.js environment
+    return isNode();
+  }
+}

package/src/core/midi/adapters/WebMidiAdapter.ts

@@ -0,0 +1,120 @@
+/**
+ * Web MIDI API adapter for browsers
+ */
+import type {
+  IMidiAccess,
+  IMidiAdapter,
+  IMidiInputPort,
+  MidiMessageCallback,
+} from "./types";
+
+class WebMidiInputPort implements IMidiInputPort {
+  private input: MIDIInput;
+  private callbacks = new Set<MidiMessageCallback>();
+  private handler: ((e: MIDIMessageEvent) => void) | null = null;
+
+  constructor(input: MIDIInput) {
+    this.input = input;
+  }
+
+  get id(): string {
+    return this.input.id;
+  }
+
+  get name(): string {
+    return this.input.name ?? `Device ${this.input.id}`;
+  }
+
+  get state(): "connected" | "disconnected" {
+    return this.input.state as "connected" | "disconnected";
+  }
+
+  addEventListener(callback: MidiMessageCallback): void {
+    if (this.callbacks.size === 0) {
+      this.handler = (e: MIDIMessageEvent) => {
+        if (!e.data) return;
+
+        const event = {
+          data: e.data,
+          timeStamp: e.timeStamp,
+        };
+
+        this.callbacks.forEach((cb) => {
+          cb(event);
+        });
+      };
+      this.input.addEventListener("midimessage", this.handler);
+    }
+    this.callbacks.add(callback);
+  }
+
+  removeEventListener(callback: MidiMessageCallback): void {
+    this.callbacks.delete(callback);
+
+    if (this.callbacks.size === 0 && this.handler) {
+      this.input.removeEventListener("midimessage", this.handler);
+      this.handler = null;
+    }
+  }
+}
+
+class WebMidiAccess implements IMidiAccess {
+  private midiAccess: MIDIAccess;
+  private portCache = new Map<string, WebMidiInputPort>();
+
+  constructor(midiAccess: MIDIAccess) {
+    this.midiAccess = midiAccess;
+  }
+
+  *inputs(): IterableIterator<IMidiInputPort> {
+    for (const [, input] of this.midiAccess.inputs) {
+      if (!this.portCache.has(input.id)) {
+        this.portCache.set(input.id, new WebMidiInputPort(input));
+      }
+      yield this.portCache.get(input.id)!;
+    }
+  }
+
+  addEventListener(
+    event: "statechange",
+    callback: (port: IMidiInputPort) => void,
+  ): void {
+    this.midiAccess.addEventListener(event, (e) => {
+      const port = e.port;
+      if (!port || port.type !== "input") return;
+
+      const input = port as MIDIInput;
+      if (!this.portCache.has(input.id)) {
+        this.portCache.set(input.id, new WebMidiInputPort(input));
+      }
+
+      callback(this.portCache.get(input.id)!);
+    });
+  }
+}
+
+export default class WebMidiAdapter implements IMidiAdapter {
+  async requestMIDIAccess(): Promise<IMidiAccess | null> {
+    try {
+      if (
+        typeof navigator === "undefined" ||
+        typeof navigator.requestMIDIAccess !== "function"
+      ) {
+        return null;
+      }
+
+      const midiAccess = await navigator.requestMIDIAccess();
+      return new WebMidiAccess(midiAccess);
+    } catch (err) {
+      console.error("Error enabling Web MIDI API:", err);
+      return null;
+    }
+  }
+
+  isSupported(): boolean {
+    return (
+      typeof navigator !== "undefined" &&
+      typeof navigator.requestMIDIAccess === "function"
+    );
+  }
+}

package/src/core/midi/adapters/index.ts

@@ -0,0 +1,23 @@
+/**
+ * MIDI adapter factory
+ * Automatically selects the correct MIDI implementation based on the platform
+ */
+import { isNode } from "es-toolkit";
+import NodeMidiAdapter from "./NodeMidiAdapter";
+import WebMidiAdapter from "./WebMidiAdapter";
+import type { IMidiAdapter } from "./types";
+
+export * from "./types";
+
+/**
+ * Creates the appropriate MIDI adapter for the current platform
+ * @returns The MIDI adapter (Web MIDI API for browsers, node-midi for Node.js)
+ */
+export function createMidiAdapter(): IMidiAdapter {
+  if (isNode()) {
+    return new NodeMidiAdapter();
+  }
+
+  // Default to Web MIDI API for browsers
+  return new WebMidiAdapter();
+}

package/src/core/midi/adapters/types.ts

@@ -0,0 +1,32 @@
+/**
+ * Platform-agnostic MIDI interfaces
+ * Allows switching between Web MIDI API and node-midi without refactoring
+ */
+
+export interface IMidiMessageEvent {
+  data: Uint8Array;
+  timeStamp: number;
+}
+
+export type MidiMessageCallback = (event: IMidiMessageEvent) => void;
+
+export interface IMidiInputPort {
+  readonly id: string;
+  readonly name: string;
+  readonly state: "connected" | "disconnected";
+  addEventListener(callback: MidiMessageCallback): void;
+  removeEventListener(callback: MidiMessageCallback): void;
+}
+
+export interface IMidiAccess {
+  inputs(): IterableIterator<IMidiInputPort>;
+  addEventListener(
+    event: "statechange",
+    callback: (port: IMidiInputPort) => void,
+  ): void;
+}
+
+export interface IMidiAdapter {
+  requestMIDIAccess(): Promise<IMidiAccess | null>;
+  isSupported(): boolean;
+}