From d818ef151ca65008e5c6bb5e92b709decb3026d8 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 14 Apr 2025 18:35:49 -0400
Subject: fixed how templates are expanded to avoid template sub-component
 conflicts by changing how field keys are named.   fixed various Cast
 functions to be more typesafe by including undefined as part of return type. 
 overhaul of Doc.MakeClone, MakeCopy, FindRefernces - makeClone is no longer
 async.  fixed inlined docs in text docs.

---
 src/client/views/nodes/trails/PresBox.tsx | 187 +++++++++++++++---------------
 1 file changed, 92 insertions(+), 95 deletions(-)

(limited to 'src/client/views/nodes/trails/PresBox.tsx')

diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index 23155ebf3..11f35b8ef 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -149,7 +149,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     setIsLoading =              action((input?: boolean) => { this._isLoading = !!input; }); // prettier-ignore
     setShowAIGalleryVisibilty = action((visible: boolean) => { this._showAIGallery = visible; }); // prettier-ignore
     setBezierControlPoints = action((newPoints: { p1: number[]; p2: number[] }) => {
-        this.setEaseFunc(this.activeItem, `cubic-bezier(${newPoints.p1[0]}, ${newPoints.p1[1]}, ${newPoints.p2[0]}, ${newPoints.p2[1]})`);
+        this.activeItem && this.setEaseFunc(this.activeItem, `cubic-bezier(${newPoints.p1[0]}, ${newPoints.p1[1]}, ${newPoints.p2[0]}, ${newPoints.p2[1]})`);
     });
 
     @computed get showEaseFunctions() {
@@ -158,7 +158,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
     @computed
     get currCPoints() {
-        return EaseFuncToPoints(this.activeItem.presentation_easeFunc ? StrCast(this.activeItem.presentation_easeFunc) : 'ease');
+        return EaseFuncToPoints(this.activeItem?.presentation_easeFunc ? StrCast(this.activeItem.presentation_easeFunc) : 'ease');
     }
 
     @computed
@@ -175,7 +175,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         return DocListCast(this.Document[this.presFieldKey]);
     }
     @computed get tagDocs() {
-        return this.childDocs.map(doc => Cast(doc.presentation_targetDoc, Doc, null));
+        return this.childDocs.map(doc => DocCast(doc.presentation_targetDoc)!).filter(doc => doc);
     }
     @computed get itemIndex() {
         return NumCast(this.Document._itemIndex);
@@ -187,11 +187,11 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         return DocCast(this.activeItem?.presentation_targetDoc);
     }
     public static targetRenderedDoc = (doc: Doc) => {
-        const targetDoc = Cast(doc?.presentation_targetDoc, Doc, null);
+        const targetDoc = DocCast(doc?.presentation_targetDoc);
         return targetDoc?.layout_unrendered ? DocCast(targetDoc.annotationOn) : targetDoc;
     };
     @computed get scrollable() {
-        if ([DocumentType.PDF, DocumentType.WEB, DocumentType.RTF].includes(this.targetDoc.type as DocumentType) || this.targetDoc._type_collection === CollectionViewType.Stacking) return true;
+        if ([DocumentType.PDF, DocumentType.WEB, DocumentType.RTF].includes(this.targetDoc?.type as DocumentType) || this.targetDoc?._type_collection === CollectionViewType.Stacking) return true;
         return false;
     }
     @computed get selectedDocumentView() {
@@ -273,8 +273,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     };
 
     stopTempMedia = (targetDocField: FieldResult) => {
-        const targetDoc = DocCast(DocCast(targetDocField).annotationOn) ?? DocCast(targetDocField);
-        if ([DocumentType.VID, DocumentType.AUDIO].includes(targetDoc.type as DocumentType)) {
+        const targetDoc = DocCast(DocCast(targetDocField)?.annotationOn) ?? DocCast(targetDocField);
+        if ([DocumentType.VID, DocumentType.AUDIO].includes(targetDoc?.type as DocumentType)) {
             const targMedia = DocumentView.getDocumentView(targetDoc);
             targMedia?.ComponentView?.Pause?.();
         }
@@ -295,13 +295,13 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         this.setIsLoading(true);
         const slideDefaults: { [key: string]: FieldResult } = { presentation_transition: 500, config_zoom: 1 };
         const currSlideProperties = gptSlideProperties.reduce(
-            (prev, key) => { prev[key] = Field.toString(this.activeItem[key]) ?? prev[key]; return prev; }, 
+            (prev, key) => { prev[key] = Field.toString(this.activeItem?.[key]) ?? prev[key]; return prev; }, 
             slideDefaults); // prettier-ignore
 
         gptTrailSlideCustomization(input, JSON.stringify(currSlideProperties))
             .then(res =>
                 (Object.entries(JSON.parse(res)) as string[][]).forEach(([key, val]) => {
-                    this.activeItem[key] = (+val).toString() === val ? +val : (val ?? this.activeItem[key]);
+                    this.activeItem && (this.activeItem[key] = (+val).toString() === val ? +val : (val ?? this.activeItem[key]));
                 })
             )
             .catch(e => console.error(e))
@@ -325,7 +325,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                         const serial = nextSelected + 1 < this.childDocs.length && NumCast(this.childDocs[nextSelected + 1].presentation_groupWithUp) > 1;
                         if (serial) {
                             this.gotoDocument(nextSelected, this.activeItem, true, async () => {
-                                const waitTime = NumCast(this.activeItem.presentation_duration);
+                                const waitTime = NumCast(this.activeItem?.presentation_duration);
                                 await new Promise<void>(res => {
                                     setTimeout(res, Math.max(0, waitTime));
                                 });
@@ -346,7 +346,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     progressivizedItems = (doc: Doc) => {
         const targetList = PresBox.targetRenderedDoc(doc);
         if (doc.presentation_indexed !== undefined && targetList) {
-            const listItems = (Cast(targetList[Doc.LayoutFieldKey(targetList)], listSpec(Doc), null)?.filter(d => d instanceof Doc) as Doc[]) ?? DocListCast(targetList[Doc.LayoutFieldKey(targetList) + '_annotations']);
+            const listItems = (Cast(targetList[Doc.LayoutDataKey(targetList)], listSpec(Doc), null)?.filter(d => d instanceof Doc) as Doc[]) ?? DocListCast(targetList[Doc.LayoutDataKey(targetList) + '_annotations']);
             return listItems.filter(ldoc => !ldoc.layout_unrendered);
         }
         return undefined;
@@ -364,7 +364,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     next = () => {
         const progressiveReveal = (first: boolean) => {
             const presIndexed = Cast(this.activeItem?.presentation_indexed, 'number', null);
-            if (presIndexed !== undefined) {
+            if (presIndexed !== undefined && this.activeItem) {
                 const listItems = this.progressivizedItems(this.activeItem);
                 const listItemDoc = listItems?.[presIndexed];
                 if (listItems && listItemDoc) {
@@ -395,7 +395,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         if (this.childDocs[this.itemIndex + 1] !== undefined) {
             // Case 1: No more frames in current doc and next slide is defined, therefore move to next slide
             const slides = DocListCast(this.Document[StrCast(this.presFieldKey, 'data')]);
-            const curLast = this.selectedArray.size ? Math.max(...Array.from(this.selectedArray).map(d => slides.indexOf(DocCast(d)))) : this.itemIndex;
+            const curLast = this.selectedArray.size ? Math.max(...Array.from(this.selectedArray).map(d => slides.indexOf(DocCast(d) ?? d))) : this.itemIndex;
 
             // before moving onto next slide, run the subroutines :)
             const currentDoc = this.childDocs[this.itemIndex];
@@ -422,7 +422,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const { activeItem } = this;
         let prevSelected = this.itemIndex;
         // Functionality for group with up
-        let didZoom = activeItem.presentation_movement;
+        let didZoom = activeItem?.presentation_movement;
         for (; prevSelected > 0 && this.childDocs[Math.max(0, prevSelected - 1)].presentation_groupWithUp; prevSelected--) {
             didZoom = didZoom === 'none' ? this.childDocs[prevSelected].presentation_movement : didZoom;
         }
@@ -452,7 +452,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 this.stopTempMedia(from.presentation_targetDoc);
             }
             // If next slide is audio / video 'Play automatically' then the next slide should be played
-            if (this.layoutDoc.presentation_status !== PresStatus.Edit && (this.targetDoc.type === DocumentType.AUDIO || this.targetDoc.type === DocumentType.VID) && this.activeItem.presentation_mediaStart === 'auto') {
+            if (this.layoutDoc.presentation_status !== PresStatus.Edit && (this.targetDoc?.type === DocumentType.AUDIO || this.targetDoc?.type === DocumentType.VID) && this.activeItem?.presentation_mediaStart === 'auto') {
                 this.startTempMedia(this.targetDoc, this.activeItem);
             }
             if (!group) this.clearSelectedArray();
@@ -516,8 +516,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const activeFrame = activeItem.config_activeFrame ?? activeItem.config_currentFrame;
         if (activeFrame !== undefined) {
             const frameTime = NumCast(activeItem.presentation_transition, 500);
-            const acontext = activeItem.config_activeFrame !== undefined ? DocCast(DocCast(activeItem.presentation_targetDoc).embedContainer) : DocCast(activeItem.presentation_targetDoc);
-            const context = DocCast(acontext)?.annotationOn ? DocCast(DocCast(acontext).annotationOn) : acontext;
+            const acontext = activeItem.config_activeFrame !== undefined ? DocCast(DocCast(activeItem?.presentation_targetDoc)?.embedContainer) : DocCast(activeItem.presentation_targetDoc);
+            const context = DocCast(acontext)?.annotationOn ? DocCast(DocCast(acontext)?.annotationOn) : acontext;
             if (context) {
                 const ffview = CollectionFreeFormView.from(DocumentView.getFirstDocumentView(context));
                 if (ffview?.childDocs) {
@@ -528,7 +528,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         }
         if ((pinDataTypes?.dataview && activeItem.config_data !== undefined) || (!pinDataTypes && activeItem.config_data !== undefined)) {
             bestTarget._dataTransition = `all ${transTime}ms`;
-            const fkey = Doc.LayoutFieldKey(bestTarget);
+            const fkey = Doc.LayoutDataKey(bestTarget);
             const setData = bestTargetView?.ComponentView?.setData;
             if (setData) setData(activeItem.config_data);
             else {
@@ -553,7 +553,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             }
         }
         if (pinDataTypes?.clippable || (!pinDataTypes && activeItem.config_clipWidth !== undefined)) {
-            const fkey = '_' + Doc.LayoutFieldKey(bestTarget);
+            const fkey = '_' + Doc.LayoutDataKey(bestTarget);
             if (bestTarget[fkey + '_clipWidth'] !== activeItem.config_clipWidth) {
                 bestTarget[fkey + '_clipWidth'] = activeItem.config_clipWidth;
                 changed = true;
@@ -655,7 +655,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             }
         }
         if (pinDataTypes?.dataannos || (!pinDataTypes && activeItem.config_annotations !== undefined)) {
-            const fkey = Doc.LayoutFieldKey(bestTarget);
+            const fkey = Doc.LayoutDataKey(bestTarget);
             const oldItems = DocListCast(bestTarget[fkey + '_annotations']).filter(doc => doc.layout_unrendered);
             const newItems = DocListCast(activeItem.config_annotations).map(doc => {
                 doc.hidden = false;
@@ -672,7 +672,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         }
         if (pinDataTypes?.poslayoutview || (!pinDataTypes && activeItem.config_pinLayoutData !== undefined)) {
             changed = true;
-            const layoutField = Doc.LayoutFieldKey(bestTarget);
+            const layoutField = Doc.LayoutDataKey(bestTarget);
             const transitioned = new Set<Doc>();
             StrListCast(activeItem.config_pinLayoutData)
                 .map(str => JSON.parse(str) as { id: string; x: number; y: number; back: string; fill: string; w: number; h: number; data: string; text: string })
@@ -740,7 +740,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const { activeItem, targetDoc } = this;
         const finished = (options: FocusViewOptions) => {
             afterNav?.(options);
-            targetDoc[Animation] = undefined;
+            targetDoc && (targetDoc[Animation] = undefined);
         };
         const selViewCache = Array.from(this.selectedArray);
         const dragViewCache = Array.from(this._dragArray);
@@ -756,7 +756,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             }
             finished(options);
         });
-        PresBox.NavigateToTarget(targetDoc, activeItem, resetSelection);
+        targetDoc && activeItem && PresBox.NavigateToTarget(targetDoc, activeItem, resetSelection);
     };
 
     static NavigateToTarget(targetDoc: Doc, activeItem: Doc, finished?: (options: FocusViewOptions) => void) {
@@ -806,42 +806,44 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     @action
     doHideBeforeAfter = () => {
         this.childDocs.forEach((doc, index) => {
-            const curDoc = Cast(doc, Doc, null);
-            const tagDoc = PresBox.targetRenderedDoc(curDoc);
-            const itemIndexes = this.getAllIndexes(this.tagDocs, curDoc);
-            let opacity = index === this.itemIndex ? 1 : undefined;
-            if (curDoc.presentation_hide) {
-                if (index !== this.itemIndex) {
-                    opacity = 1;
+            const curDoc = DocCast(doc);
+            if (curDoc) {
+                const tagDoc = PresBox.targetRenderedDoc(curDoc) ?? curDoc;
+                const itemIndexes = this.getAllIndexes(this.tagDocs, curDoc);
+                let opacity = index === this.itemIndex ? 1 : undefined;
+                if (curDoc.presentation_hide) {
+                    if (index !== this.itemIndex) {
+                        opacity = 1;
+                    }
                 }
-            }
-            const hidingIndBef = itemIndexes.find(item => item >= this.itemIndex) ?? itemIndexes.slice().reverse().lastElement();
-            if (curDoc.presentation_hideBefore && index === hidingIndBef) {
-                if (index > this.itemIndex) {
-                    opacity = 0;
-                } else if (index === this.itemIndex || !curDoc.presentation_hideAfter) {
-                    opacity = 1;
+                const hidingIndBef = itemIndexes.find(item => item >= this.itemIndex) ?? itemIndexes.slice().reverse().lastElement();
+                if (curDoc.presentation_hideBefore && index === hidingIndBef) {
+                    if (index > this.itemIndex) {
+                        opacity = 0;
+                    } else if (index === this.itemIndex || !curDoc.presentation_hideAfter) {
+                        opacity = 1;
+                    }
                 }
-            }
-            const hidingIndAft =
-                itemIndexes
-                    .slice()
-                    .reverse()
-                    .find(item => item <= this.itemIndex) ?? itemIndexes.lastElement();
-            if (curDoc.presentation_hideAfter && index === hidingIndAft) {
-                if (index < this.itemIndex) {
-                    opacity = 0;
-                } else if (index === this.itemIndex || !curDoc.presentation_hideBefore) {
-                    opacity = 1;
+                const hidingIndAft =
+                    itemIndexes
+                        .slice()
+                        .reverse()
+                        .find(item => item <= this.itemIndex) ?? itemIndexes.lastElement();
+                if (curDoc.presentation_hideAfter && index === hidingIndAft) {
+                    if (index < this.itemIndex) {
+                        opacity = 0;
+                    } else if (index === this.itemIndex || !curDoc.presentation_hideBefore) {
+                        opacity = 1;
+                    }
                 }
-            }
-            const hidingInd = itemIndexes.find(item => item === this.itemIndex);
-            if (curDoc.presentation_hide && index === hidingInd) {
-                if (index === this.itemIndex) {
-                    opacity = 0;
+                const hidingInd = itemIndexes.find(item => item === this.itemIndex);
+                if (curDoc.presentation_hide && index === hidingInd) {
+                    if (index === this.itemIndex) {
+                        opacity = 0;
+                    }
                 }
+                opacity !== undefined && (tagDoc.opacity = opacity === 1 ? undefined : opacity);
             }
-            opacity !== undefined && (tagDoc.opacity = opacity === 1 ? undefined : opacity);
         });
     };
 
@@ -940,7 +942,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
     initializePresState = (startIndex: number) => {
         this.childDocs.forEach((doc, index) => {
-            const tagDoc = PresBox.targetRenderedDoc(doc);
+            const tagDoc = PresBox.targetRenderedDoc(doc) ?? doc;
             if (doc.presentation_hideBefore && index > startIndex) tagDoc.opacity = 0;
             if (doc.presentation_hideAfter && index < startIndex) tagDoc.opacity = 0;
             if (doc.presentation_indexed !== undefined && index >= startIndex) {
@@ -969,7 +971,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             this.layoutDoc.presentation_status = PresStatus.Autoplay;
             this.initializePresState(startIndex);
             const func = () => {
-                const delay = NumCast(this.activeItem.presentation_duration, this.activeItem.type === DocumentType.SCRIPTING ? 0 : 2500) + NumCast(this.activeItem.presentation_transition);
+                const delay = NumCast(this.activeItem?.presentation_duration, this.activeItem?.type === DocumentType.SCRIPTING ? 0 : 2500) + NumCast(this.activeItem?.presentation_transition);
                 this._presTimer = setTimeout(() => {
                     if (this.next() === false) this.layoutDoc.presentation_status = this._exitTrail?.() ?? PresStatus.Manual;
                     this.layoutDoc.presentation_status === PresStatus.Autoplay && func();
@@ -1060,7 +1062,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         return !results.some(r => !r);
     };
 
-    childLayoutTemplate = () => Docs.Create.PresElementBoxDocument();
+    childLayoutTemplate = () => Docs.Create.PresSlideDocument();
     removeDocument = (doc: Doc | Doc[]) =>
         !toList(doc)
             .map(d => Doc.RemoveDocFromList(this.Document, this.fieldKey, d))
@@ -1077,13 +1079,14 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
      */
     @computed get listOfSelected() {
         return Array.from(this.selectedArray).map((doc, index) => {
-            const curDoc = Cast(doc, Doc, null);
+            const curDoc = DocCast(doc);
+            if (!curDoc) return null;
             const tagDoc = Cast(curDoc.presentation_targetDoc, Doc, null);
             if (curDoc && curDoc === this.activeItem)
                 return (
                     <div key={doc[Id]} className="selectedList-items">
                         <b>
-                            {index + 1}. {StrCast(curDoc.title)})
+                            {index + 1}. {StrCast(curDoc.title)}
                         </b>
                     </div>
                 );
@@ -1277,7 +1280,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const presCollection = collection;
         const dv = DocumentView.getDocumentView(presCollection);
         this.childDocs.forEach((doc, index) => {
-            const tagDoc = PresBox.targetRenderedDoc(doc);
+            const tagDoc = PresBox.targetRenderedDoc(doc) ?? doc;
             const srcContext = Cast(tagDoc.embedContainer, Doc, null);
             const labelCreator = (top: number, left: number, edge: number, fontSize: number) => (
                 <div className="pathOrder" key={tagDoc.id + 'pres' + index} style={{ top, left, width: edge, height: edge, fontSize }} onClick={() => this.selectElement(doc)}>
@@ -1526,17 +1529,19 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     // Applies the slide transiiton settings to all docs in the array
     @undoBatch
     applyTo = (array: Doc[]) => {
-        this.updateMovement(this.activeItem.presentation_movement as PresMovement, true);
-        this.updateEffect(this.activeItem.presentation_effect as PresEffect, false, true);
-        this.updateEffect(this.activeItem.presBulletEffect as PresEffect, true, true);
-        this.updateEffectDirection(this.activeItem.presentation_effectDirection as PresEffectDirection, true);
-        const { presentation_transition: pt, presentation_duration: pd, presentation_hideBefore: ph, presentation_hideAfter: pa } = this.activeItem;
-        array.forEach(curDoc => {
-            curDoc.presentation_transition = pt;
-            curDoc.presentation_duration = pd;
-            curDoc.presentation_hideBefore = ph;
-            curDoc.presentation_hideAfter = pa;
-        });
+        if (this.activeItem) {
+            this.updateMovement(this.activeItem.presentation_movement as PresMovement, true);
+            this.updateEffect(this.activeItem.presentation_effect as PresEffect, false, true);
+            this.updateEffect(this.activeItem.presBulletEffect as PresEffect, true, true);
+            this.updateEffectDirection(this.activeItem.presentation_effectDirection as PresEffectDirection, true);
+            const { presentation_transition: pt, presentation_duration: pd, presentation_hideBefore: ph, presentation_hideAfter: pa } = this.activeItem;
+            array.forEach(curDoc => {
+                curDoc.presentation_transition = pt;
+                curDoc.presentation_duration = pd;
+                curDoc.presentation_hideBefore = ph;
+                curDoc.presentation_hideAfter = pa;
+            });
+        }
     };
 
     @computed get visibilityDurationDropdown() {
@@ -1673,15 +1678,15 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                                 onClick={() => {
                                     activeItem.presentation_indexed = activeItem.presentation_indexed === undefined ? 0 : undefined;
                                     activeItem.presentation_hideBefore = activeItem.presentation_indexed !== undefined;
-                                    const tagDoc = PresBox.targetRenderedDoc(this.activeItem);
+                                    const tagDoc = PresBox.targetRenderedDoc(activeItem) ?? activeItem;
                                     const type = DocCast(tagDoc?.annotationOn)?.type ?? tagDoc.type;
                                     activeItem.presentation_indexedStart = type === DocumentType.COL ? 1 : 0;
                                     // a progressivized slide doesn't have sub-slides, but rather iterates over the data list of the target being progressivized.
                                     // to avoid creating a new slide to correspond to each of the target's data list, we create a computedField to refernce the target's data list.
-                                    let dataField = Doc.LayoutFieldKey(tagDoc);
+                                    let dataField = Doc.LayoutDataKey(tagDoc);
                                     if (Cast(tagDoc[dataField], listSpec(Doc), null)?.filter(d => d instanceof Doc) === undefined) dataField += '_annotations';
 
-                                    if (DocCast(activeItem.presentation_targetDoc).annotationOn) activeItem.data = ComputedField.MakeFunction(`this.presentation_targetDoc.annotationOn?.["${dataField}"]`);
+                                    if (DocCast(activeItem.presentation_targetDoc)?.annotationOn) activeItem.data = ComputedField.MakeFunction(`this.presentation_targetDoc.annotationOn?.["${dataField}"]`);
                                     else activeItem.data = ComputedField.MakeFunction(`this.presentation_targetDoc?.["${dataField}"]`);
                                 }}>
                                 Enable
@@ -1797,12 +1802,13 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                                 onClick={() => {
                                     this.updateEffect(elem.effect, false);
                                     this.updateEffectDirection(elem.direction);
-                                    this.updateEffectTiming(this.activeItem, {
-                                        type: SpringType.CUSTOM,
-                                        stiffness: elem.stiffness,
-                                        damping: elem.damping,
-                                        mass: elem.mass,
-                                    });
+                                    this.activeItem &&
+                                        this.updateEffectTiming(this.activeItem, {
+                                            type: SpringType.CUSTOM,
+                                            stiffness: elem.stiffness,
+                                            damping: elem.damping,
+                                            mass: elem.mass,
+                                        });
                                 }}>
                                 <SlideEffect dir={elem.direction} presEffect={elem.effect} springSettings={elem} infinite>
                                     <div className="presBox-effect-demo-box" style={{ backgroundColor: springPreviewColors[i] }} />
@@ -1947,8 +1953,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                                     formLabelPlacement="left"
                                     closeOnSelect
                                     items={easeItems}
-                                    selectedVal={this.activeItem.presentation_easeFunc ? (StrCast(this.activeItem.presentation_easeFunc).startsWith('cubic') ? 'custom' : StrCast(this.activeItem.presentation_easeFunc)) : 'ease'}
-                                    setSelectedVal={val => typeof val === 'string' && this.setEaseFunc(this.activeItem, val !== 'custom' ? val : TIMING_DEFAULT_MAPPINGS.ease)}
+                                    selectedVal={this.activeItem?.presentation_easeFunc ? (StrCast(this.activeItem.presentation_easeFunc).startsWith('cubic') ? 'custom' : StrCast(this.activeItem.presentation_easeFunc)) : 'ease'}
+                                    setSelectedVal={val => typeof val === 'string' && this.activeItem && this.setEaseFunc(this.activeItem, val !== 'custom' ? val : TIMING_DEFAULT_MAPPINGS.ease)}
                                     dropdownType={DropdownType.SELECT}
                                     type={Type.TERT}
                                 />
@@ -2145,9 +2151,9 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     @computed get mediaOptionsDropdown() {
         const { activeItem } = this;
         if (activeItem && this.targetDoc) {
-            const renderTarget = PresBox.targetRenderedDoc(this.activeItem);
+            const renderTarget = PresBox.targetRenderedDoc(this.activeItem ?? this.targetDoc) ?? this.targetDoc;
             const clipStart = NumCast(renderTarget.clipStart);
-            const clipEnd = NumCast(renderTarget.clipEnd, clipStart + NumCast(renderTarget[Doc.LayoutFieldKey(renderTarget) + '_duration']));
+            const clipEnd = NumCast(renderTarget.clipEnd, clipStart + NumCast(renderTarget[Doc.LayoutDataKey(renderTarget) + '_duration']));
             const configClipEnd = NumCast(activeItem.config_clipEnd) < NumCast(activeItem.config_clipStart) ? clipEnd - clipStart : NumCast(activeItem.config_clipEnd);
             return (
                 <div className="presBox-ribbon" onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
@@ -2699,7 +2705,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const presEnd =
             !this.layoutDoc.presLoop &&
             this.itemIndex === this.childDocs.length - 1 &&
-            (this.activeItem.presentation_indexed === undefined || NumCast(this.activeItem.presentation_indexed) === (this.progressivizedItems(this.activeItem)?.length ?? 0));
+            (this.activeItem?.presentation_indexed === undefined || NumCast(this.activeItem.presentation_indexed) === (this.progressivizedItems(this.activeItem)?.length ?? 0));
         const presStart: boolean = !this.layoutDoc.presLoop && this.itemIndex === 0;
         const inOverlay = Doc.IsInMyOverlay(this.Document);
         // Case 1: There are still other frames and should go through all frames before going to next slide
@@ -2892,7 +2898,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const presEnd =
             !this.layoutDoc.presLoop &&
             this.itemIndex === this.childDocs.length - 1 &&
-            (this.activeItem.presentation_indexed === undefined || NumCast(this.activeItem.presentation_indexed) === (this.progressivizedItems(this.activeItem)?.length ?? 0));
+            (this.activeItem?.presentation_indexed === undefined || NumCast(this.activeItem.presentation_indexed) === (this.progressivizedItems(this.activeItem)?.length ?? 0));
         const presStart = !this.layoutDoc.presLoop && this.itemIndex === 0;
         return this._props.addDocTab === returnFalse ? ( // bcz: hack!! - addDocTab === returnFalse only when this is being rendered by the OverlayView which means the doc is a mini player
             <div
@@ -2984,16 +2990,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
                             />
                         ) : null}
                     </div>
-                    {/* {
-                        // if the document type is a presentation, then the collection stacking view has a "+ new slide" button at the bottom of the stack
-                        <Tooltip title={<div className="dash-tooltip">{'Click on document to pin to presentaiton or make a marquee selection to pin your desired view'}</div>}>
-                            <button className="add-slide-button" onPointerDown={this.startMarqueeCreateSlide}>
-                                + NEW SLIDE
-                            </button>
-                        </Tooltip>
-                    } */}
                 </div>
-                {/* presbox chatbox */}
                 {this._chatActive && <div className="presBox-chatbox" />}
             </div>
         );
-- 
cgit v1.2.3-70-g09d2

