aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/CollectionStackedTimeline.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2021-08-30 10:23:13 -0400
committerbobzel <zzzman@gmail.com>2021-08-30 10:23:13 -0400
commit962a1a3f1ae9a55c5aea630d3252cecb740fa15c (patch)
tree9f5f234786af112a475ea5be962e2e2907fb2dfe /src/client/views/collections/CollectionStackedTimeline.tsx
parent584926578067f023b52c7754e65bc289f2a745e6 (diff)
parent2d2e027f11253834a337680bbfd1ac549bb2a1f0 (diff)
merged with master - fixed warnings and errors.
Diffstat (limited to 'src/client/views/collections/CollectionStackedTimeline.tsx')
-rw-r--r--src/client/views/collections/CollectionStackedTimeline.tsx79
1 files changed, 42 insertions, 37 deletions
diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx
index 51e05e278..d98d966d8 100644
--- a/src/client/views/collections/CollectionStackedTimeline.tsx
+++ b/src/client/views/collections/CollectionStackedTimeline.tsx
@@ -141,25 +141,26 @@ export class CollectionStackedTimeline extends CollectionSubView<
}
componentWillUnmount() {
document.removeEventListener("keydown", this.keyEvents, true);
- if (CollectionStackedTimeline.SelectingRegion === this)
+ if (CollectionStackedTimeline.SelectingRegion === this) {
runInAction(
() => (CollectionStackedTimeline.SelectingRegion = undefined)
);
+ }
}
anchorStart = (anchor: Doc) =>
- NumCast(anchor._timecodeToShow, NumCast(anchor[this.props.startTag]));
+ NumCast(anchor._timecodeToShow, NumCast(anchor[this.props.startTag]))
anchorEnd = (anchor: Doc, val: any = null) => {
const endVal = NumCast(anchor[this.props.endTag], val);
return NumCast(
anchor._timecodeToHide,
endVal === undefined ? null : endVal
);
- };
+ }
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;
@@ -190,7 +191,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
}
}
}
- };
+ }
getLinkData(l: Doc) {
let la1 = l.anchor1 as Doc;
@@ -279,12 +280,12 @@ export class CollectionStackedTimeline extends CollectionSubView<
this.props.setTime(((clientX - rect.x) / rect.width) * this.duration)
:
this.props.setTime(((clientX - rect.x) / rect.width) * this.props.trimDuration + this.trimStart)
- )
+ );
}
);
}
- };
+ }
@action
trimLeft = (e: React.PointerEvent): void => {
@@ -312,7 +313,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
}
})
);
- };
+ }
@action
trimRight = (e: React.PointerEvent): void => {
@@ -340,7 +341,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
}
})
);
- };
+ }
@undoBatch
@action
@@ -395,12 +396,13 @@ export class CollectionStackedTimeline extends CollectionSubView<
}
}
return { select: true };
- };
+ }
@action
clickAnchor = (anchorDoc: Doc, clientX: number) => {
- if (anchorDoc.isLinkButton)
+ if (anchorDoc.isLinkButton) {
LinkManager.FollowLink(undefined, anchorDoc, this.props, false);
+ }
const seekTimeInSeconds = this.anchorStart(anchorDoc) - 0.25;
const endTime = this.anchorEnd(anchorDoc);
if (
@@ -415,14 +417,15 @@ export class CollectionStackedTimeline extends CollectionSubView<
this.props.setTime(this.toTimeline(clientX - rect.x, rect.width));
}
} else {
- if (this.layoutDoc.autoPlayAnchors)
+ if (this.layoutDoc.autoPlayAnchors) {
this.props.playFrom(seekTimeInSeconds, endTime);
+ }
else {
this.props.setTime(seekTimeInSeconds);
}
}
return { select: true };
- };
+ }
// makes sure no anchors overlaps each other by setting the correct position and width
getLevel = (
@@ -456,17 +459,17 @@ export class CollectionStackedTimeline extends CollectionSubView<
placed.push({ anchorStartTime: x1, anchorEndTime: x2, level });
return level;
- };
+ }
dictationHeightPercent = 50;
dictationHeight = () =>
- (this.props.PanelHeight() * (100 - this.dictationHeightPercent)) / 100;
+ (this.props.PanelHeight() * (100 - this.dictationHeightPercent)) / 100
timelineContentHeight = () =>
- (this.props.PanelHeight() * this.dictationHeightPercent) / 100;
+ (this.props.PanelHeight() * this.dictationHeightPercent) / 100
dictationScreenToLocalTransform = () =>
this.props
.ScreenToLocalTransform()
- .translate(0, -this.timelineContentHeight());
+ .translate(0, -this.timelineContentHeight())
@computed get renderDictation() {
const dictation = Cast(this.dataDoc[this.props.dictationKey], Doc, null);
return !dictation ? null : (
@@ -552,7 +555,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
const top = (d.level / maxLevel) * this.timelineContentHeight();
const timespan = end - start;
const width = (timespan / this.props.trimDuration) * timelineContentWidth;
- const height = this.timelineContentHeight() / maxLevel
+ const height = this.timelineContentHeight() / maxLevel;
return this.props.Document.hideAnchors ? null : (
<div
className={"collectionStackedTimeline-marker-timeline"}
@@ -723,17 +726,19 @@ class StackedTimelineAnchor extends React.Component<StackedTimelineAnchorProps>
const changeAnchor = (anchor: Doc, left: boolean, time: number) => {
const timelineOnly =
Cast(anchor[this.props.startTag], "number", null) !== undefined;
- if (timelineOnly)
+ if (timelineOnly) {
Doc.SetInPlace(
anchor,
left ? this.props.startTag : this.props.endTag,
time,
true
);
- else
+ }
+ else {
left
? (anchor._timecodeToShow = time)
: (anchor._timecodeToHide = time);
+ }
return false;
};
setupMoveUpEvents(
@@ -746,13 +751,13 @@ class StackedTimelineAnchor extends React.Component<StackedTimelineAnchorProps>
},
emptyFunction
);
- };
+ }
@action
computeTitle = () => {
const start = Math.max(NumCast(this.props.mark[this.props.startTag]), this.props.trimStart) - this.props.trimStart;
const end = Math.min(NumCast(this.props.mark[this.props.endTag]), this.props.trimEnd) - this.props.trimStart;
- return `#${formatTime(start)}-${formatTime(end)}`
+ return `#${formatTime(start)}-${formatTime(end)}`;
}
renderInner = computedFn(function (
@@ -824,21 +829,21 @@ class StackedTimelineAnchor extends React.Component<StackedTimelineAnchorProps>
{inner.view}
{!inner.anchor.view ||
!SelectionManager.IsSelected(inner.anchor.view) ? null : (
- <>
- <div
- key="left"
- className="collectionStackedTimeline-left-resizer"
- onPointerDown={(e) => this.onAnchorDown(e, this.props.mark, true)}
- />
- <div
- key="right"
- className="collectionStackedTimeline-resizer"
- onPointerDown={(e) =>
- this.onAnchorDown(e, this.props.mark, false)
- }
- />
- </>
- )}
+ <>
+ <div
+ key="left"
+ className="collectionStackedTimeline-left-resizer"
+ onPointerDown={(e) => this.onAnchorDown(e, this.props.mark, true)}
+ />
+ <div
+ key="right"
+ className="collectionStackedTimeline-resizer"
+ onPointerDown={(e) =>
+ this.onAnchorDown(e, this.props.mark, false)
+ }
+ />
+ </>
+ )}
</>
);
}