fixed dropping label markers on timelines to not disappear. made all timeline markers draggable when the timeline is active (without needing to be selected).

1 files changed, 12 insertions, 14 deletions

diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx
index fb0a0ec1d..43f78cf78 100644
--- a/src/client/views/collections/CollectionStackedTimeline.tsx
+++ b/src/client/views/collections/CollectionStackedTimeline.tsx
@@ -363,7 +363,9 @@ export class CollectionStackedTimeline extends CollectionSubView<
         const timelinePt = this.toTimeline(x, this.props.PanelWidth());
         for (let i = 0; i < docDragData.droppedDocuments.length; i++) {
             const d = Doc.GetProto(docDragData.droppedDocuments[i]);
-            d._timecodeToHide = timelinePt + NumCast(d._timecodeToHide) - NumCast(d._timecodeToShow);
+            if (d._timecodeToHide !== undefined) {
+                d._timecodeToHide = timelinePt + NumCast(d._timecodeToHide) - NumCast(d._timecodeToShow);
+            }
             d._timecodeToShow = timelinePt;
         }
 
@@ -497,14 +499,9 @@ export class CollectionStackedTimeline extends CollectionSubView<
     }
 
     dictationHeightPercent = 50;
-    dictationHeight = () =>
-        (this.props.PanelHeight() * (100 - this.dictationHeightPercent)) / 100
-    timelineContentHeight = () =>
-        (this.props.PanelHeight() * this.dictationHeightPercent) / 100
-    dictationScreenToLocalTransform = () =>
-        this.props
-            .ScreenToLocalTransform()
-            .translate(0, -this.timelineContentHeight())
+    dictationHeight = () => (this.props.PanelHeight() * (100 - this.dictationHeightPercent)) / 100
+    timelineContentHeight = () => (this.props.PanelHeight() * this.dictationHeightPercent) / 100
+    dictationScreenToLocalTransform = () => this.props.ScreenToLocalTransform().translate(0, -this.timelineContentHeight())
     @computed get renderDictation() {
         const dictation = Cast(this.dataDoc[this.props.dictationKey], Doc, null);
         return !dictation ? null : (
@@ -558,6 +555,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
         );
     }
 
+    isContentActive = () => this.props.isSelected() || this.props.isContentActive();
     currentTimecode = () => this.currentTime;
     render() {
         const timelineContentWidth = this.props.PanelWidth();
@@ -571,14 +569,12 @@ export class CollectionStackedTimeline extends CollectionSubView<
             anchor,
         }));
         const maxLevel = overlaps.reduce((m, o) => Math.max(m, o.level), 0) + 2;
-        const isActive =
-            this.props.isContentActive() || this.props.isSelected(false);
         return (<div ref={this.createDashEventsTarget} style={{ pointerEvents: SnappingManager.GetIsDragging() ? "all" : undefined }}>
             <div
                 className="collectionStackedTimeline"
                 ref={(timeline: HTMLDivElement | null) => (this._timeline = timeline)}
-                onClick={(e) => isActive && StopEvent(e)}
-                onPointerDown={(e) => isActive && this.onPointerDownTimeline(e)}
+                onClick={(e) => this.isContentActive() && StopEvent(e)}
+                onPointerDown={(e) => this.isContentActive() && this.onPointerDownTimeline(e)}
             >
                 {drawAnchors.map((d) => {
                     const start = this.anchorStart(d.anchor);
@@ -618,6 +614,7 @@ export class CollectionStackedTimeline extends CollectionSubView<
                                 height={height}
                                 toTimeline={this.toTimeline}
                                 layoutDoc={this.layoutDoc}
+                                isDocumentActive={this.props.childDocumentsActive ? this.props.isDocumentActive : this.isContentActive}
                                 currentTimecode={this.currentTimecode}
                                 _timeline={this._timeline}
                                 stackedTimeline={this}
@@ -691,6 +688,7 @@ interface StackedTimelineAnchorProps {
     endTag: string;
     renderDepth: number;
     layoutDoc: Doc;
+    isDocumentActive?: () => boolean;
     ScreenToLocalTransform: () => Transform;
     _timeline: HTMLDivElement | null;
     focus: DocFocusFunc;
@@ -833,7 +831,7 @@ class StackedTimelineAnchor extends React.Component<StackedTimelineAnchorProps>
                     renderDepth={this.props.renderDepth + 1}
                     LayoutTemplate={undefined}
                     LayoutTemplateString={LabelBox.LayoutStringWithTitle(LabelBox, "data", this.computeTitle())}
-                    isDocumentActive={returnFalse}
+                    isDocumentActive={this.props.isDocumentActive}
                     PanelWidth={() => width}
                     PanelHeight={() => height}
                     ScreenToLocalTransform={() =>