added code for editing the original waveform, not a clip when trimming is activated.

3 files changed, 26 insertions, 14 deletions

diff --git a/src/client/views/AudioWaveform.tsx b/src/client/views/AudioWaveform.tsx
index 1e676e1f0..7d83ea3dc 100644
--- a/src/client/views/AudioWaveform.tsx
+++ b/src/client/views/AudioWaveform.tsx
@@ -17,6 +17,8 @@ export interface AudioWaveformProps {
     mediaPath: string;
     layoutDoc: Doc;
     trimming: boolean;
+    clipStart: number;
+    clipEnd: number;
     PanelHeight: () => number;
 }
 
@@ -28,20 +30,22 @@ export class AudioWaveform extends React.Component<AudioWaveformProps> {
         return Math.max(50, this.props.PanelHeight());
     }
 
-    @computed get clipStart() { return NumCast(this.props.layoutDoc.clipStart); }
-    @computed get clipEnd() { return NumCast(this.props.layoutDoc.clipEnd, this.props.rawDuration); }
-    @computed get audioBuckets() { return Cast(this.props.layoutDoc.audioBuckets, listSpec("number"), []); }
-    @computed get audioBucketRange() { return Cast(this.props.layoutDoc.audioBucketRange, listSpec("number"), [-1, -1]); }
+    @computed get clipStart() { return this.props.clipStart; }
+    @computed get clipEnd() { return this.props.clipEnd; }
+    audioBucketField = (start: number, end: number) => { return "audioBuckets-" + start.toFixed(2) + "-" + end.toFixed(2); }
+    @computed get audioBuckets() { return Cast(this.props.layoutDoc[this.audioBucketField(this.clipStart, this.clipEnd)], listSpec("number"), []); }
     componentWillUnmount() {
         this._disposer?.();
     }
     componentDidMount() {
-        this._disposer = reaction(() => [this.clipStart, this.clipEnd, this.audioBuckets.length, ...this.audioBucketRange],
+        this._disposer = reaction(() => [this.clipStart, this.clipEnd, this.audioBuckets.length],
             (range) => {
-                if (range[2] !== AudioWaveform.NUMBER_OF_BUCKETS || range[3] !== range[0] || range[4] !== range[1]) {
-                    this.props.layoutDoc.audioBucketRange = new List<number>([range[0], range[1]]); // setting these values here serves as a "lock" to prevent multiple attempts to create the waveform at nearly the same time.
-                    this.props.layoutDoc.audioBuckets = new List<number>(numberRange(AudioWaveform.NUMBER_OF_BUCKETS));
-                    setTimeout(this.createWaveformBuckets);
+                if (range[2] !== AudioWaveform.NUMBER_OF_BUCKETS) {
+                    if (!this.props.layoutDoc[this.audioBucketField(range[0], range[1])]) {
+                        // setting these values here serves as a "lock" to prevent multiple attempts to create the waveform at nerly the same time.
+                        this.props.layoutDoc[this.audioBucketField(range[0], range[1])] = new List<number>(numberRange(AudioWaveform.NUMBER_OF_BUCKETS));
+                        setTimeout(this.createWaveformBuckets);
+                    }
                 }
             }, { fireImmediately: true });
 
@@ -74,8 +78,7 @@ export class AudioWaveform extends React.Component<AudioWaveformProps> {
                                     0
                                 ) / 2
                         );
-                        this.props.layoutDoc.audioBucketRange = new List<number>([this.clipStart, this.clipEnd]);
-                        this.props.layoutDoc.audioBuckets = new List<number>(bucketList);
+                        this.props.layoutDoc[this.audioBucketField(this.clipStart, this.clipEnd)] = new List<number>(bucketList);
                     })
                 );
             }
diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx
index 929bfa055..e00e66295 100644
--- a/src/client/views/collections/CollectionStackedTimeline.tsx
+++ b/src/client/views/collections/CollectionStackedTimeline.tsx
@@ -547,6 +547,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
                     duration={this.clipDuration}
                     mediaPath={this.props.mediaPath}
                     layoutDoc={this.layoutDoc}
+                    clipStart={this.props.clipStart}
+                    clipEnd={this.props.clipEnd}
                     PanelHeight={this.timelineContentHeight}
                     trimming={this.props.trimming}
                 />
diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx
index f6d6ff440..6a25ffaeb 100644
--- a/src/client/views/nodes/AudioBox.tsx
+++ b/src/client/views/nodes/AudioBox.tsx
@@ -577,9 +577,16 @@ export class AudioBox extends ViewBoxAnnotatableComponent<
                 PanelWidth={this.timelineWidth}
                 PanelHeight={this.timelineHeight}
                 rawDuration={this.rawDuration}
-                clipStart={this.clipStart}
-                clipEnd={this.clipEnd}
-                clipDuration={this.duration}
+
+                // this edits the entire waveform when trimming is activated
+                clipStart={this._trimming ? 0 : this.clipStart}
+                clipEnd={this._trimming ? this.rawDuration : this.clipEnd}
+                clipDuration={this._trimming ? this.rawDuration : this.duration}
+                // this edits just the current waveform clip when trimming is activated
+                // clipStart={this.clipStart}
+                // clipEnd={this.clipEnd}
+                // clipDuration={this.duration}
+
                 trimming={this._trimming}
                 trimStart={this.trimStartFunc}
                 trimEnd={this.trimEndFunc}