Some more logging on message delay

src/Clock.ts

@@ -42,6 +42,7 @@ export class Clock {
   private _ppqn: number;
   tick: number;
   running: boolean;
+  messageSent: number;
 
   constructor(public app: Editor, ctx: AudioContext) {
     this.time_position = { bar: 0, beat: 0, pulse: 0 };
@@ -54,6 +55,7 @@ export class Clock {
     this.transportNode = null;
     this.ctx = ctx;
     this.running = true;
+    this.messageSent = 0;
     ctx.audioWorklet
       .addModule(TransportProcessor)
       .then((e) => {
@@ -139,7 +141,8 @@ export class Clock {
 
   set bpm(bpm: number) {
     if (bpm > 0 && this._bpm !== bpm) {
-      this.transportNode?.setBPM(bpm);
+      this.messageSent = this.app.audioContext.currentTime;
+      this.transportNode?.setBPM(bpm, this.messageSent);
       this._bpm = bpm;
     }
   }
@@ -159,7 +162,8 @@ export class Clock {
   set ppqn(ppqn: number) {
     if (ppqn > 0 && this._ppqn !== ppqn) {
       this._ppqn = ppqn;
-      this.transportNode?.setPPQN(ppqn);
+      this.messageSent = this.app.audioContext.currentTime;
+      this.transportNode?.setPPQN(ppqn, this.messageSent);
     }
   }
 
@@ -201,12 +205,14 @@ export class Clock {
      */
     this.app.audioContext.resume();
     this.running = true;
+    this.messageSent = this.app.audioContext.currentTime;
     this.app.api.MidiConnection.sendStartMessage();
     if (this.tick > 0) {
-      this.transportNode?.resume();
+      this.transportNode?.resume(this.messageSent);
     } else {
-      this.transportNode?.start();
+      this.transportNode?.start(this.messageSent);
     }
+
   }
 
   public pause(): void {
@@ -216,7 +222,8 @@ export class Clock {
      * @remark also sends a MIDI message if a port is declared
      */
     this.running = false;
-    this.transportNode?.pause();
+    this.messageSent = this.app.audioContext.currentTime;
+    this.transportNode?.pause(this.messageSent);
     this.app.api.MidiConnection.sendStopMessage();
   }
 
@@ -232,6 +239,7 @@ export class Clock {
     this.elapsed = 0;
     this.time_position = { bar: 0, beat: 0, pulse: 0 };
     this.app.api.MidiConnection.sendStopMessage();
-    this.transportNode?.stop();
+    this.messageSent = this.app.audioContext.currentTime;
+    this.transportNode?.stop(this.messageSent);
   }
 }

src/TransportNode.js

@@ -39,31 +39,31 @@ export class TransportNode extends AudioWorkletNode {
     }
   };
 
-  start() {
+  start(sentAt) {
-    this.port.postMessage("start");
+    this.port.postMessage({ type: "start", sentAt: sentAt});
   }
 
-  pause() {
+  pause(sentAt) {
-    this.port.postMessage("pause");
+    this.port.postMessage({ type: "pause", sentAt: sentAt});
   }
 
-  resume() {
+  resume(sentAt) {
-    this.port.postMessage("resume");
+    this.port.postMessage({ type: "resume", sentAt: sentAt });
   }
 
-  setBPM(bpm) {
+  setBPM(bpm, sentAt) {
-    this.port.postMessage({ type: "bpm", value: bpm });
+    this.port.postMessage({ type: "bpm", value: bpm, sentAt: sentAt });
   }
 
-  setPPQN(ppqn) {
+  setPPQN(ppqn, sentAt) {
-    this.port.postMessage({ type: "ppqn", value: ppqn });
+    this.port.postMessage({ type: "ppqn", value: ppqn, sentAt: sentAt });
   }
 
-  setNudge(nudge) {
+  setNudge(nudge, sentAt) {
-    this.port.postMessage({ type: "nudge", value: nudge });
+    this.port.postMessage({ type: "nudge", value: nudge, sentAt: sentAt });
   }
 
-  stop() {
+  stop(sentAt) {
-    this.port.postMessage("stop");
+    this.port.postMessage({type: "stop", sentAt: sentAt});
   }
 }

src/TransportProcessor.js

@@ -17,21 +17,21 @@ class TransportProcessor extends AudioWorkletProcessor {
   handleMessage = (message) => {
     if (message.data && message.data.type === "ping") {
       this.port.postMessage(message.data);
-    } else if (message.data === "start") {
+    } else if (message.data.type === "start") {
       this.started = true;
       this.lastPlayPressTime = currentTime;
       this.totalPausedTime = 0;
 
-    } else if (message.data === "resume") {
+    } else if (message.data.type === "resume") {
       this.started = true;
       if (this.lastPauseTime !== null) {
         this.totalPausedTime += currentTime - this.lastPauseTime;
         this.lastPauseTime = null;
       }
-    } else if (message.data === "pause") {
+    } else if (message.data.type === "pause") {
       this.started = false;
       this.lastPauseTime = currentTime;
-    } else if (message.data === "stop") {
+    } else if (message.data.type === "stop") {
       this.started = false;
     } else if (message.data.type === 'bpm') {
       this.bpm = message.data.value;
@@ -40,6 +40,8 @@ class TransportProcessor extends AudioWorkletProcessor {
     } else if (message.data.type === 'nudge') {
       this.nudge = message.data.value
     }
+    // Log difference between currentTime and message.data.sentAt
+     console.log("Message delay: ", currentTime - message.data.sentAt);
   }
 
   process(inputs, outputs, parameters) {