@blibliki/engine 0.1.26 → 0.3.1

package/src/core/Timing/Transport.ts

@@ -0,0 +1,104 @@
+import { now } from ".";
+import Scheduler from "./Scheduler";
+import Time, { t, TTime } from "./Time";
+
+export enum TransportState {
+  playing = "playing",
+  stopped = "stopped",
+  paused = "paused",
+}
+
+export type TransportEvents = {
+  start: { actionAt: TTime; offset: TTime };
+  stop: { actionAt: TTime };
+  pause: { actionAt: TTime };
+};
+
+type TPlaybackCallback = (actionAt: TTime) => void;
+
+type TransportProps = {
+  onStart?: TPlaybackCallback;
+  onStop?: TPlaybackCallback;
+};
+
+export default class Transport {
+  bpm = 120;
+  timeSignature: [number, number] = [4, 4];
+  loopStart: TTime;
+  loopEnd?: TTime;
+
+  state: TransportState = TransportState.stopped;
+  offset: TTime = 0;
+
+  private startTime: TTime = 0;
+  private onStart: TransportProps["onStart"];
+  private onStop: TransportProps["onStop"];
+  private scheduler: Scheduler;
+
+  constructor(props: TransportProps) {
+    this.onStart = props.onStart;
+    this.onStop = props.onStop;
+    this.loopStart = t("0:0:0");
+    this.scheduler = new Scheduler(this);
+  }
+
+  start({
+    offset = this.offset,
+    actionAt = now(),
+  }: {
+    offset?: TTime;
+    actionAt?: TTime;
+  }) {
+    if (this.state === TransportState.playing) return;
+
+    this.validateFutureTime(actionAt);
+
+    this.scheduler.start(actionAt, () => {
+      this.state = TransportState.playing;
+      this.offset = offset;
+      this.startTime = t(actionAt).subtrack(this.offset);
+    });
+    this.onStart?.(actionAt);
+
+    return actionAt;
+  }
+
+  stop({ actionAt: actionAt = now() }: { actionAt?: TTime }) {
+    if (this.state === TransportState.stopped) return;
+
+    this.validateFutureTime(actionAt);
+
+    this.scheduler.stop(actionAt, () => {
+      this.state = TransportState.stopped;
+      this.offset = 0;
+    });
+    this.onStop?.(actionAt);
+
+    return actionAt;
+  }
+
+  pause({ actionAt: actionAt = now() }: { actionAt?: TTime }) {
+    if (this.state === TransportState.paused) return;
+
+    this.validateFutureTime(actionAt);
+
+    this.scheduler.stop(actionAt, () => {
+      this.state = TransportState.paused;
+      this.offset = t(actionAt).subtrack(this.startTime);
+    });
+    this.onStop?.(actionAt);
+
+    return actionAt;
+  }
+
+  get playhead(): Time {
+    if (this.state === TransportState.stopped) return t(0);
+    if (this.state === TransportState.paused) return t(this.offset);
+
+    return t(now()).subtrack(this.startTime);
+  }
+
+  private validateFutureTime(time: TTime) {
+    if (t(time).isBefore(now())) throw Error("Past time not allowed");
+  }
+}

package/src/core/Timing/index.ts

@@ -0,0 +1,16 @@
+import { Engine } from "@/Engine";
+
+export { default as Transport, TransportState } from "./Transport";
+export { default as Time } from "./Time";
+
+export type { TransportEvents } from "./Transport";
+export type { TTime } from "./Time";
+
+export function now() {
+  return Engine.current.context.currentTime;
+}
+
+export function browserToContextTime(time: number): number {
+  const differenceBetweenClocks = performance.now() / 1000 - now();
+  return time / 1000 - differenceBetweenClocks;
+}

package/src/core/index.ts

@@ -0,0 +1,36 @@
+export { Module } from "./module";
+export type { IModule, IModuleSerialize, IPolyModuleSerialize } from "./module";
+
+export type IAnyAudioContext = AudioContext | OfflineAudioContext;
+
+export { Routes } from "./Route";
+export type { IRoute } from "./Route";
+
+export { default as MidiDeviceManager } from "./midi/MidiDeviceManager";
+export { default as MidiDevice, MidiPortState } from "./midi/MidiDevice";
+export type { IMidiDevice } from "./midi/MidiDevice";
+export { default as MidiEvent, MidiEventType } from "./midi/MidiEvent";
+
+export type {
+  MidiOutput,
+  MidiInput,
+  AudioInput,
+  AudioOutput,
+  IIOSerialize,
+} from "./IO";
+
+export { Time, TransportState, Transport } from "./Timing";
+export type { TTime } from "./Timing";
+
+export type {
+  PropDefinition,
+  PropSchema,
+  NumberProp,
+  StringProp,
+  EnumProp,
+  BooleanProp,
+  ArrayProp,
+} from "./schema";
+
+export { default as Note } from "./Note";
+export type { INote } from "./Note";

package/src/core/midi/{ComputerKeyboardInput.ts → ComputerKeyboardDevice.ts}

@@ -1,8 +1,8 @@
 import Note from "../Note";
-import { IMidiInput, TMidiPortState } from "./MidiDevice";
+import { EventListerCallback, IMidiInput, MidiPortState } from "./MidiDevice";
 import MidiEvent from "./MidiEvent";
 
-const MAP_KEYS: { [key: string]: Note } = {
+const MAP_KEYS: Record<string, Note> = {
   a: new Note("C3"),
   s: new Note("D3"),
   d: new Note("E3"),
@@ -21,32 +21,52 @@ const MAP_KEYS: { [key: string]: Note } = {
   p: new Note("D#4"),
 };
 
-const COMPUTER_KEYBOARD_DATA = {
+const computerKeyboardData = () => ({
   id: "computer_keyboard",
   name: "Computer Keyboard",
-  state: "connected",
-};
+  state: MidiPortState.connected,
+});
 
 export default class ComputerKeyboardInput implements IMidiInput {
   id: string;
   name: string;
-  state: TMidiPortState;
-  onmidimessage: ((e: MidiEvent) => void) | null;
+  state: MidiPortState;
+  eventListerCallbacks: EventListerCallback[] = [];
 
   constructor() {
-    Object.assign(this, COMPUTER_KEYBOARD_DATA);
+    const { id, name, state } = computerKeyboardData();
+    this.id = id;
+    this.name = name;
+    this.state = state;
+
     document.addEventListener("keydown", this.onKeyTrigger(true));
     document.addEventListener("keyup", this.onKeyTrigger(false));
   }
 
-  onKeyTrigger = (noteOn: boolean) => (event: KeyboardEvent) => {
-    if (!this.onmidimessage) return;
+  addEventListener(callback: EventListerCallback) {
+    this.eventListerCallbacks.push(callback);
+  }
+
+  removeEventListener(callback: EventListerCallback) {
+    this.eventListerCallbacks = this.eventListerCallbacks.filter(
+      (c) => c !== callback,
+    );
+  }
+
+  serialize() {
+    const { id, name, state } = this;
 
+    return { id, name, state };
+  }
+
+  onKeyTrigger = (noteOn: boolean) => (event: KeyboardEvent) => {
     const note = this.extractNote(event);
     if (!note) return;
 
     const midiEvent = MidiEvent.fromNote(note, noteOn);
-    this.onmidimessage(midiEvent);
+    this.eventListerCallbacks.forEach((callback) => {
+      callback(midiEvent);
+    });
   };
 
   private extractNote(event: KeyboardEvent): Note | undefined {

package/src/core/midi/MidiDevice.ts

@@ -1,49 +1,51 @@
-import MidiEvent from "./MidiEvent";
+import { MessageEvent, Input } from "webmidi";
+import { browserToContextTime } from "../Timing";
+import MidiEvent, { MidiEventType } from "./MidiEvent";
 
-export type TMidiPortState = "connected" | "disconnected";
+export enum MidiPortState {
+  connected = "connected",
+  disconnected = "disconnected",
+}
 
-export interface MidiDeviceInterface {
+export type IMidiDevice = {
   id: string;
   name: string;
-  state: TMidiPortState;
-}
+  state: MidiPortState;
+};
 
-export interface IMidiInput extends MidiDeviceInterface {
-  onmidimessage: ((e: MidiEvent) => void) | null;
-}
+export type IMidiInput = IMidiDevice & {
+  eventListerCallbacks: EventListerCallback[];
+};
 
 export type EventListerCallback = (event: MidiEvent) => void;
 
-export default class MidiDevice implements MidiDeviceInterface {
+export default class MidiDevice implements IMidiDevice {
   id: string;
   name: string;
-  state: TMidiPortState;
   eventListerCallbacks: EventListerCallback[] = [];
 
-  private _midi: IMidiInput;
+  private input: Input;
 
-  constructor(midi: IMidiInput) {
-    this.id = midi.id;
-    this.name = midi.name || `Device ${midi.id}`;
-    this.state = midi.state;
-    this._midi = midi;
+  constructor(input: Input) {
+    this.id = input.id;
+    this.name = input.name || `Device ${input.id}`;
+    this.input = input;
 
     this.connect();
   }
 
-  connect() {
-    this._midi.onmidimessage = (e: Event | MidiEvent) => {
-      const isMidiEvent =
-        e instanceof MIDIMessageEvent || e instanceof MidiEvent;
-
-      if (!isMidiEvent) return;
+  get state() {
+    return this.input.state as MidiPortState;
+  }
 
+  connect() {
+    this.input.addListener("midimessage", (e: MessageEvent) => {
       this.processEvent(e);
-    };
+    });
   }
 
   disconnect() {
-    this._midi.onmidimessage = null;
+    this.input.removeListener();
   }
 
   serialize() {
@@ -58,17 +60,22 @@ export default class MidiDevice implements MidiDeviceInterface {
 
   removeEventListener(callback: EventListerCallback) {
     this.eventListerCallbacks = this.eventListerCallbacks.filter(
-      (c) => c !== callback
+      (c) => c !== callback,
     );
   }
 
-  private processEvent(e: MIDIMessageEvent | MidiEvent) {
-    const event: MidiEvent = e instanceof MidiEvent ? e : new MidiEvent(e);
+  private processEvent(event: MessageEvent) {
+    const midiEvent = new MidiEvent(
+      event.message,
+      browserToContextTime(event.timestamp),
+    );
 
-    switch (event.type) {
-      case "noteOn":
-      case "noteOff":
-        this.eventListerCallbacks.forEach((callback) => callback(event));
+    switch (midiEvent.type) {
+      case MidiEventType.noteOn:
+      case MidiEventType.noteOff:
+        this.eventListerCallbacks.forEach((callback) => {
+          callback(midiEvent);
+        });
     }
   }
 }

package/src/core/midi/MidiDeviceManager.ts

@@ -1,80 +1,79 @@
-import ComputerKeyboardInput from "./ComputerKeyboardInput";
-import MidiDevice, { IMidiInput } from "./MidiDevice";
+import { Input, Output, WebMidi } from "webmidi";
+import ComputerKeyboardDevice from "./ComputerKeyboardDevice";
+import MidiDevice from "./MidiDevice";
+
+type ListenerCallback = (device: MidiDevice) => void;
 
 export default class MidiDeviceManager {
-  devices: { [Key: string]: MidiDevice } = {};
+  devices = new Map<string, MidiDevice | ComputerKeyboardDevice>();
   private initialized = false;
-  private computerKeyboardInput: ComputerKeyboardInput;
+  private listeners: ListenerCallback[] = [];
 
   constructor() {
-    this.computerKeyboardInput = new ComputerKeyboardInput();
-    this.initializeDevices()
-      .then(() => {
-        this.listenChanges();
-        this.initialized = true;
-      })
-      .catch(() => {});
+    const computerKeyboardDevice = new ComputerKeyboardDevice();
+    this.devices.set(computerKeyboardDevice.id, computerKeyboardDevice);
   }
 
-  find(id: string): MidiDevice | null {
-    const device = this.devices[id];
-
-    if (!device) return null;
+  async initialize() {
+    await this.initializeDevices();
 
-    return device;
+    this.listenChanges();
+    this.initialized = true;
   }
 
-  onStateChange(callback: (device: MidiDevice) => void) {
-    navigator
-      .requestMIDIAccess()
-      .then((access: MIDIAccess) => {
-        access.onstatechange = (e) => {
-          const isMidiEvent = e instanceof MIDIConnectionEvent;
-
-          if (!isMidiEvent) return;
-          if (e.port instanceof MIDIOutput) return;
-
-          const input = e.port as unknown as IMidiInput;
+  find(id: string): MidiDevice | ComputerKeyboardDevice | undefined {
+    return this.devices.get(id);
+  }
 
-          const midi = new MidiDevice(input);
+  addListener(callback: ListenerCallback) {
+    this.listeners.push(callback);
+  }
 
-          callback(midi);
-        };
-      })
-      .catch(() => {});
+  private async initializeDevices() {
+    if (this.initialized) return;
+
+    try {
+      await WebMidi.enable();
+
+      WebMidi.inputs.forEach((input) => {
+        if (!this.devices.has(input.id)) {
+          this.devices.set(input.id, new MidiDevice(input));
+        }
+      });
+    } catch (err) {
+      console.error("Error enabling WebMidi:", err);
+    }
   }
 
   private listenChanges() {
-    this.onStateChange((device) => {
-      if (device.state === "disconnected") {
-        device.disconnect();
-        delete this.devices[device.id];
-      } else {
-        this.devices[device.id] = device;
-      }
-    });
-  }
+    WebMidi.addListener("connected", (event) => {
+      const port = event.port as Input | Output;
+      if (port instanceof Output) return;
 
-  private async initializeDevices() {
-    if (this.initialized) return Object.values(this.devices);
+      if (this.devices.has(port.id)) return;
 
-    (await this.inputs()).forEach((input) => {
-      if (this.devices[input.id]) return;
+      const device = new MidiDevice(port);
+      this.devices.set(device.id, device);
 
-      this.devices[input.id] = new MidiDevice(input as IMidiInput);
+      this.listeners.forEach((listener) => {
+        listener(device);
+      });
     });
 
-    return Object.values(this.devices);
-  }
+    WebMidi.addListener("disconnected", (event) => {
+      const port = event.port as Input | Output;
+      if (port instanceof Output) return;
 
-  private async inputs() {
-    const inputs: Array<MIDIInput | ComputerKeyboardInput> = [
-      this.computerKeyboardInput,
-    ];
+      const device = this.devices.get(port.id);
+      if (!device) return;
+      if (device instanceof ComputerKeyboardDevice) return;
 
-    const access = await navigator.requestMIDIAccess();
-    access.inputs.forEach((input) => inputs.push(input));
+      device.disconnect();
+      this.devices.delete(device.id);
 
-    return inputs;
+      this.listeners.forEach((listener) => {
+        listener(device);
+      });
+    });
   }
 }

package/src/core/midi/MidiEvent.ts

@@ -1,91 +1,67 @@
-import { now } from "tone";
-import { ISequence } from "../../modules";
+import { Message } from "webmidi";
 import Note, { INote } from "../Note";
+import { t, TTime } from "../Timing/Time";
 
-const EventType: { [key: number]: MidiEventType } = {
-  0x80: "noteOff",
-  0x90: "noteOn",
-  0xb0: "cc",
-};
-
-export type MidiEventType = "noteOn" | "noteOff" | "cc";
+export enum MidiEventType {
+  noteOn = "noteon",
+  noteOff = "noteoff",
+  cc = "cc",
+}
 
 export default class MidiEvent {
-  note: Note;
+  note?: Note;
   voiceNo?: number;
-  readonly triggeredAt: number;
-  _type: MidiEventType;
-  private data: Uint8Array;
-  private event: MIDIMessageEvent;
-
-  static fromSequence(sequence: ISequence, triggeredAt: number): MidiEvent[] {
-    return sequence.notes.map((noteName) =>
-      this.fromNote(noteName, true, triggeredAt)
-    );
-  }
+  readonly triggeredAt: TTime;
+  private message: Message;
 
   static fromNote(
-    noteName: string | Note | INote,
-    noteOn: boolean = true,
-    triggeredAt?: number
+    noteName: string | Note | Omit<INote, "frequency">,
+    noteOn = true,
+    triggeredAt?: TTime,
   ): MidiEvent {
     const note = noteName instanceof Note ? noteName : new Note(noteName);
 
-    const event = new MidiEvent(
-      new MIDIMessageEvent("", { data: note.midiData(noteOn) }),
-      triggeredAt
-    );
-    event.note = note;
-
-    return event;
+    return new MidiEvent(new Message(note.midiData(noteOn)), triggeredAt);
   }
 
-  static fromCC(cc: number, value: number, triggeredAt?: number): MidiEvent {
+  static fromCC(cc: number, value: number, triggeredAt?: TTime): MidiEvent {
     return new MidiEvent(
-      new MIDIMessageEvent("", { data: new Uint8Array([0xb0, cc, value]) }),
-      triggeredAt
+      new Message(new Uint8Array([0xb0, cc, value])),
+      triggeredAt,
     );
   }
 
-  constructor(event: MIDIMessageEvent, triggeredAt?: number) {
-    this.event = event;
-    this.triggeredAt = triggeredAt || now();
-    this.data = event.data;
+  constructor(message: Message, triggeredAt?: TTime) {
+    this.message = message;
+    this.triggeredAt = triggeredAt ?? t();
     this.defineNotes();
   }
 
-  get statusByte(): number {
-    return this.data[0];
-  }
-
-  get firstData(): number {
-    return this.data[1];
-  }
-
-  get secondData(): number {
-    return this.data[2];
-  }
-
   get type() {
-    if (this._type) return this._type;
-
-    let type = EventType[this.statusByte & 0xf0];
-
-    if (type === "noteOn" && this.secondData === 0) {
-      type = "noteOff";
-    }
-
-    return (this._type = type);
+    return this.message.type as MidiEventType;
   }
 
   get isNote() {
-    return this.type === "noteOn" || this.type === "noteOff";
+    return (
+      this.type === MidiEventType.noteOn || this.type === MidiEventType.noteOff
+    );
   }
 
   defineNotes() {
     if (!this.isNote) return;
     if (this.note) return;
 
-    this.note = new Note(this.event);
+    this.note = Note.fromEvent(this.message);
+  }
+
+  get rawMessage() {
+    return this.message;
+  }
+
+  clone(voiceNo?: number) {
+    const newEvent = new MidiEvent(this.message, this.triggeredAt);
+    newEvent.voiceNo = voiceNo;
+
+    return newEvent;
   }
 }