From 1f94d6b33f81b1b2e6140f58f4de749eb4e74478 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 8 Nov 2021 11:07:05 -0500 Subject: fixed vertical height of timeline for video. fixed initial display of timeline by not assigning clipEnd in DidMount --- .../collections/CollectionStackedTimeline.scss | 2 +- .../collections/CollectionStackedTimeline.tsx | 33 ++++++++++++---------- src/client/views/collections/TabDocView.tsx | 4 +-- 3 files changed, 21 insertions(+), 18 deletions(-) (limited to 'src/client/views/collections') diff --git a/src/client/views/collections/CollectionStackedTimeline.scss b/src/client/views/collections/CollectionStackedTimeline.scss index fce105a44..36aa36978 100644 --- a/src/client/views/collections/CollectionStackedTimeline.scss +++ b/src/client/views/collections/CollectionStackedTimeline.scss @@ -1,7 +1,7 @@ @import "../global/globalCssVariables.scss"; .timeline-container { - height: calc(100% - 50px); + height: 100%; overflow-x: auto; overflow-y: hidden; border: none; diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx index ced8a68e8..f5c3676e8 100644 --- a/src/client/views/collections/CollectionStackedTimeline.tsx +++ b/src/client/views/collections/CollectionStackedTimeline.tsx @@ -127,8 +127,11 @@ export class CollectionStackedTimeline extends CollectionSubView< } componentDidMount() { - this.layoutDoc.clipStart = 0; - this.layoutDoc.clipEnd = this.props.rawDuration; + // bcz: setting these shouldn't be necessary since they are the default values of this.clipStart and this.clipEnd. + // also, setting anything on the Document in DidMount or the constructor is not good form since it means that + // someone who has viewing but not edit permissions would not be able to do the assignment. + // this.layoutDoc.clipStart = 0; + // this.layoutDoc.clipEnd = this.props.rawDuration; document.addEventListener("keydown", this.keyEvents, true); } @@ -915,19 +918,19 @@ class StackedTimelineAnchor extends React.Component {inner.view} {!inner.anchor.view || !SelectionManager.IsSelected(inner.anchor.view) ? null : ( - <> -
this.onAnchorDown(e, this.props.mark, true)} - /> -
this.onAnchorDown(e, this.props.mark, false)} - /> - - )} + <> +
this.onAnchorDown(e, this.props.mark, true)} + /> +
this.onAnchorDown(e, this.props.mark, false)} + /> + + )} ); } diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx index 9f24d60d8..6e1d9b067 100644 --- a/src/client/views/collections/TabDocView.tsx +++ b/src/client/views/collections/TabDocView.tsx @@ -220,8 +220,8 @@ export class TabDocView extends React.Component { if (!pinProps?.audioRange && duration !== undefined) { pinDoc.mediaStart = "manual"; pinDoc.mediaStop = "manual"; - pinDoc.presStartTime = doc.clipStart; - pinDoc.presEndTime = doc.clipEnd; + pinDoc.presStartTime = NumCast(doc.clipStart); + pinDoc.presEndTime = NumCast(doc.clipEnd, duration); } //save position if (pinProps?.setPosition || pinDoc.isInkMask) { -- cgit v1.2.3-70-g09d2