From d788f0fbafbf0270ea801eed14cc0996e1d6d7ab Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 23 Sep 2021 22:01:00 -0400
Subject: renamed props for stackedTimeline

---
 .../collections/CollectionStackedTimeline.tsx      | 58 +++++++++++-----------
 src/client/views/nodes/AudioBox.tsx                |  7 +--
 src/client/views/nodes/VideoBox.tsx                |  6 +--
 3 files changed, 36 insertions(+), 35 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx
index 12d70c05d..8b937c278 100644
--- a/src/client/views/collections/CollectionStackedTimeline.tsx
+++ b/src/client/views/collections/CollectionStackedTimeline.tsx
@@ -50,7 +50,7 @@ import { DragManager } from "../../util/DragManager";
 type PanZoomDocument = makeInterface<[]>;
 const PanZoomDocument = makeInterface();
 export type CollectionStackedTimelineProps = {
-    duration: number;
+    clipDuration: number;
     Play: () => void;
     Pause: () => void;
     playLink: (linkDoc: Doc) => void;
@@ -67,7 +67,7 @@ export type CollectionStackedTimelineProps = {
     clipEnd: number;
     trimStart: () => number;
     trimEnd: () => number;
-    trimDuration: number;
+    trimDuration: () => number;
     setStartTrim: (newStart: number) => void;
     setEndTrim: (newEnd: number) => void;
 };
@@ -91,7 +91,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
     get minLength() {
         const rect = this._timeline?.getBoundingClientRect();
         if (rect) {
-            return 0.05 * this.duration;
+            return 0.05 * this.clipDuration;
         }
         return 0;
     }
@@ -104,8 +104,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
         return this.props.trimEnd();
     }
 
-    get duration() {
-        return this.props.duration;
+    get clipDuration() {
+        return this.props.clipDuration;
     }
 
     @computed get currentTime() {
@@ -116,8 +116,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
             <div
                 className="collectionStackedTimeline-selector"
                 style={{
-                    left: `${((Math.min(this._markerStart, this._markerEnd) - this.trimStart) / this.props.trimDuration) * 100}%`,
-                    width: `${(Math.abs(this._markerStart - this._markerEnd) / this.props.trimDuration) * 100}%`,
+                    left: `${((Math.min(this._markerStart, this._markerEnd) - this.trimStart) / this.props.trimDuration()) * 100}%`,
+                    width: `${(Math.abs(this._markerStart - this._markerEnd) / this.props.trimDuration()) * 100}%`,
                 }}
             />
         );
@@ -166,7 +166,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
     toTimeline = (screen_delta: number, width: number) => {
         return Math.max(
             this.trimStart,
-            Math.min(this.trimEnd, (screen_delta / width) * this.props.trimDuration + this.trimStart));
+            Math.min(this.trimEnd, (screen_delta / width) * this.props.trimDuration() + this.trimStart));
     }
 
     rangeClickScript = () => CollectionStackedTimeline.RangeScript;
@@ -283,10 +283,10 @@ export class CollectionStackedTimeline extends CollectionSubView<
                 undefined,
                 () => {
                     !wasPlaying &&
-                        (this.props.trimming && this.duration ?
-                            this.props.setTime(((clientX - rect.x) / rect.width) * this.duration)
+                        (this.props.trimming && this.clipDuration ?
+                            this.props.setTime(((clientX - rect.x) / rect.width) * this.clipDuration)
                             :
-                            this.props.setTime(((clientX - rect.x) / rect.width) * this.props.trimDuration + this.trimStart)
+                            this.props.setTime(((clientX - rect.x) / rect.width) * this.props.trimDuration() + this.trimStart)
                         );
                 }
             );
@@ -305,7 +305,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
                 if (rect && this.props.isContentActive()) {
                     this.props.setStartTrim(Math.min(
                         Math.max(
-                            this.trimStart + (e.movementX / rect.width) * this.duration,
+                            this.trimStart + (e.movementX / rect.width) * this.clipDuration,
                             0
                         ),
                         this.trimEnd - this.minLength
@@ -333,8 +333,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
                 if (rect && this.props.isContentActive()) {
                     this.props.setEndTrim(Math.max(
                         Math.min(
-                            this.trimEnd + (e.movementX / rect.width) * this.duration,
-                            this.props.clipStart + this.duration
+                            this.trimEnd + (e.movementX / rect.width) * this.clipDuration,
+                            this.props.clipStart + this.clipDuration
                         ),
                         this.trimStart + this.minLength
                     ));
@@ -344,7 +344,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
             emptyFunction,
             action((e, doubleTap) => {
                 if (doubleTap) {
-                    this.props.setEndTrim(this.duration);
+                    this.props.setEndTrim(this.clipDuration);
                 }
             })
         );
@@ -362,8 +362,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
         const timelineContentWidth = this.props.PanelWidth();
         for (let i = 0; i < docDragData.droppedDocuments.length; i++) {
             const d = Doc.GetProto(docDragData.droppedDocuments[i]);
-            d._timecodeToHide = x / timelineContentWidth * this.props.trimDuration + NumCast(d._timecodeToHide) - NumCast(d._timecodeToShow);
-            d._timecodeToShow = x / timelineContentWidth * this.props.trimDuration;
+            d._timecodeToHide = x / timelineContentWidth * this.props.trimDuration() + NumCast(d._timecodeToHide) - NumCast(d._timecodeToShow);
+            d._timecodeToShow = x / timelineContentWidth * this.props.trimDuration();
         }
 
         return true;
@@ -469,7 +469,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
         const x1 = this.anchorStart(m);
         const x2 = this.anchorEnd(
             m,
-            x1 + (10 / timelineContentWidth) * this.duration
+            x1 + (10 / timelineContentWidth) * this.clipDuration
         );
         let max = 0;
         const overlappedLevels = new Set(
@@ -544,7 +544,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
             <div className="collectionStackedTimeline-waveform">
                 <AudioWaveform
                     rawDuration={this.props.rawDuration}
-                    duration={this.duration}
+                    duration={this.clipDuration}
                     mediaPath={this.props.mediaPath}
                     layoutDoc={this.layoutDoc}
                     PanelHeight={this.timelineContentHeight}
@@ -581,14 +581,14 @@ export class CollectionStackedTimeline extends CollectionSubView<
                     const start = this.anchorStart(d.anchor);
                     const end = this.anchorEnd(
                         d.anchor,
-                        start + (10 / timelineContentWidth) * this.duration
+                        start + (10 / timelineContentWidth) * this.clipDuration
                     );
                     const left = this.props.trimming ?
-                        ((start - this.props.clipStart) / this.duration) * timelineContentWidth
-                        : Math.max((start - this.trimStart) / this.props.trimDuration * timelineContentWidth, 0);
+                        ((start - this.props.clipStart) / this.clipDuration) * timelineContentWidth
+                        : Math.max((start - this.trimStart) / this.props.trimDuration() * timelineContentWidth, 0);
                     const top = (d.level / maxLevel) * this.timelineContentHeight() + 15;
                     const timespan = end - start;
-                    const width = (timespan / this.duration) * timelineContentWidth;
+                    const width = (timespan / this.clipDuration) * timelineContentWidth;
                     const height = (this.timelineContentHeight()) / maxLevel;
                     return this.props.Document.hideAnchors ? null : (
                         <div
@@ -633,7 +633,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
                     className="collectionStackedTimeline-current"
                     style={{
                         left: this.props.trimming
-                            ? `${((this.currentTime - this.props.clipStart) / this.duration) * 100}%`
+                            ? `${((this.currentTime - this.props.clipStart) / this.clipDuration) * 100}%`
                             : `${(this.currentTime - this.trimStart) / (this.trimEnd - this.trimStart) * 100}%`,
                     }}
                 />
@@ -642,14 +642,14 @@ export class CollectionStackedTimeline extends CollectionSubView<
                     <>
                         <div
                             className="collectionStackedTimeline-trim-shade"
-                            style={{ width: `${((this.trimStart - this.props.clipStart) / this.duration) * 100}%` }}
+                            style={{ width: `${((this.trimStart - this.props.clipStart) / this.clipDuration) * 100}%` }}
                         ></div>
 
                         <div
                             className="collectionStackedTimeline-trim-controls"
                             style={{
-                                left: `${((this.trimStart - this.props.clipStart) / this.duration) * 100}%`,
-                                width: `${((this.trimEnd - this.trimStart) / this.duration) * 100
+                                left: `${((this.trimStart - this.props.clipStart) / this.clipDuration) * 100}%`,
+                                width: `${((this.trimEnd - this.trimStart) / this.clipDuration) * 100
                                     }%`,
                             }}
                         >
@@ -666,8 +666,8 @@ export class CollectionStackedTimeline extends CollectionSubView<
                         <div
                             className="collectionStackedTimeline-trim-shade"
                             style={{
-                                left: `${((this.trimEnd - this.props.clipStart) / this.duration) * 100}%`,
-                                width: `${((this.duration - this.trimEnd) / this.duration) * 100
+                                left: `${((this.trimEnd - this.props.clipStart) / this.clipDuration) * 100}%`,
+                                width: `${((this.clipDuration - this.trimEnd) / this.clipDuration) * 100
                                     }%`,
                             }}
                         ></div>
diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx
index 918933194..f6d6ff440 100644
--- a/src/client/views/nodes/AudioBox.tsx
+++ b/src/client/views/nodes/AudioBox.tsx
@@ -546,6 +546,7 @@ export class AudioBox extends ViewBoxAnnotatableComponent<
     timelineWidth = () => this.props.PanelWidth() - AudioBox.playheadWidth;
     trimEndFunc = () => this.trimEnd;
     trimStartFunc = () => this.trimStart;
+    trimDurationFunc = () => this.trimDuration;
     @computed get renderTimeline() {
         return (
             <CollectionStackedTimeline
@@ -560,8 +561,6 @@ export class AudioBox extends ViewBoxAnnotatableComponent<
                 focus={DocUtils.DefaultFocus}
                 bringToFront={emptyFunction}
                 CollectionView={undefined}
-                rawDuration={this.rawDuration}
-                duration={this.duration}
                 playFrom={this.playFrom}
                 setTime={this.setAnchorTime}
                 playing={this.playing}
@@ -577,12 +576,14 @@ export class AudioBox extends ViewBoxAnnotatableComponent<
                 playLink={this.playLink}
                 PanelWidth={this.timelineWidth}
                 PanelHeight={this.timelineHeight}
+                rawDuration={this.rawDuration}
                 clipStart={this.clipStart}
                 clipEnd={this.clipEnd}
+                clipDuration={this.duration}
                 trimming={this._trimming}
                 trimStart={this.trimStartFunc}
                 trimEnd={this.trimEndFunc}
-                trimDuration={this.trimDuration}
+                trimDuration={this.trimDurationFunc}
                 setStartTrim={this.setStartTrim}
                 setEndTrim={this.setEndTrim}
             />
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index 2485e7658..8b33842ff 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -538,8 +538,6 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
                 endTag={"_timecodeToHide" /* videoEnd */}
                 bringToFront={emptyFunction}
                 CollectionView={undefined}
-                duration={this.duration}
-                rawDuration={this.duration}
                 playFrom={this.playFrom}
                 setTime={this.setAnchorTime}
                 playing={this.playing}
@@ -551,12 +549,14 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
                 Pause={this.Pause}
                 playLink={this.playLink}
                 PanelHeight={this.timelineHeight}
+                rawDuration={this.duration}
+                clipDuration={this.duration}
                 clipStart={0}
                 clipEnd={this.duration}
                 trimming={false}
                 trimStart={returnZero}
                 trimEnd={this.trimEndFunc}
-                trimDuration={this.duration}
+                trimDuration={this.trimEndFunc}
                 setStartTrim={emptyFunction}
                 setEndTrim={emptyFunction}
             />
-- 
cgit v1.2.3-70-g09d2