Base audio engine now onto lipsync.

app/pages/PageEnigma/js/audio_engine.ts

@@ -6,12 +6,14 @@ class AudioEngine {
     audio_sources: { [key: string]: AudioBufferSourceNode } = {};
     version: number;
     playing: string[];
+    last_frame: number;
 
     constructor() {
         this.clips = {};
         this.playing = [];
         this.audio_sources = {};
         this.version = 1.0;
+        this.last_frame = 0;
     }
 
     // loads clips into the engine to cache
@@ -21,19 +23,23 @@ class AudioEngine {
     }
 
     // plays from the timeline.
-    playClip(audio_media_id: string) {
+    playClip(audio_media_id: string, frame: number, offset: number) {
         if (this.clips[audio_media_id] == null) { this.loadClip(audio_media_id); }
         let clip = this.clips[audio_media_id];
         if (clip.audio_data?.audioContext) {
-            if (this.playing.includes(audio_media_id)) { return; }
-            this.playing.push(audio_media_id);
+
+            const frameBuffer = 60;
+
+            if(Math.abs(this.last_frame-frame) < frameBuffer-1 && this.last_frame !== 0) { return; }
+
+            const startTime = (frame-offset) / 60.0;
+            const endTime = frameBuffer / 60.0;
             clip.audio_data.source = clip.audio_data.audioContext.createBufferSource();
             clip.audio_data.source.buffer = clip.audio_data.audioBuffer;
             clip.audio_data.source.connect(clip.audio_data.audioContext.destination);
-            clip.audio_data.source.start();
-            clip.audio_data.source.onended = () => {
-                this.playing = this.playing.filter(id => id !== audio_media_id);
-            };
+            var sampleRate = clip.audio_data.audioBuffer.sampleRate;  // Get the sample rate from the buffer
+            clip.audio_data.source.start(0, startTime, endTime);
+            this.last_frame = frame;
             
         } else {
             console.warn(`AudioManager: AudioClip buffer with id "${audio_media_id}" not found.`);

app/pages/PageEnigma/js/timeline.ts

@@ -552,13 +552,12 @@ export class TimeLine {
           }
         } else if (
           element.type === ClipType.AUDIO &&
-          element.group !== ClipGroup.CHARACTER &&
-          this.is_playing
+          element.group !== ClipGroup.CHARACTER
         ) {
           if (this.scrubber_frame_position + 1 >= element.length) {
             this.audio_engine.stopClip(element.media_id);
           } else {
-            this.audio_engine.playClip(element.media_id);
+            this.audio_engine.playClip(element.media_id, this.scrubber_frame_position, element.offset);
           }
         } else if (
           element.type === ClipType.AUDIO &&