flash the screen when using transport commands

src/API.ts

@@ -7,6 +7,12 @@ import { webaudioOutput, samples } from '@strudel.cycles/webaudio';
 // @ts-ignore
 import { ZZFX, zzfx } from "zzfx";
 
+interface TimePoint {
+    bar: number,
+    beat: number,
+    pulse: number
+}
+
 
 
 const sound = (value: any) => ({
@@ -69,7 +75,7 @@ export class UserAPI {
     strudelSound = webaudioOutput()
     load: samples
 
-    constructor(public app: Editor) {
+    constructor (public app: Editor) {
         this.load = samples("github:tidalcycles/Dirt-Samples/master");
     }
 
@@ -291,6 +297,7 @@ export class UserAPI {
             return this.app.clock.bpm
 
         if (bpm < 1 || bpm > 500)
+            console.log(`Setting bpm to ${bpm}`)
             this.app.clock.bpm = bpm
         return bpm
     }
@@ -411,6 +418,10 @@ export class UserAPI {
         return cycle;
     }
 
+    // =============================================================
+    // Time zones 
+    // =============================================================
+
     // =============================================================
     // Trivial functions
     // =============================================================
@@ -419,7 +430,6 @@ export class UserAPI {
     zzfx = (...thing: number[]) => zzfx(...thing);
 
     sound = async (values: object) => {
-        await this.load;
         webaudioOutput(sound(values), 0.00) 
     }
 }

src/main.ts

@@ -483,6 +483,7 @@ export class Editor {
     button: "play" | "pause" | "stop" | "clear",
     highlight: boolean
   ) {
+    this.flashBackground('#2d313d', 200)
     const possible_selectors = [
       '[id^="play-button-"]',
       '[id^="pause-button-"]',