aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/trails/PresBox.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2023-11-29 10:02:34 -0500
committerbobzel <zzzman@gmail.com>2023-11-29 10:02:34 -0500
commitba3b3f6f261074bd3f35012bde8730f5d4a36905 (patch)
tree6f6c7b141f8bc5881113378801d4b2940cfde36a /src/client/views/nodes/trails/PresBox.tsx
parentac360607bee82f0fef769eada99dc0b3f85ae70a (diff)
numerous changes to fix bugs and to fix/remove old or hacky code. fixed doc dec resizing. moving this.rootDoc => this.Document . fixing template artifacts.
Diffstat (limited to 'src/client/views/nodes/trails/PresBox.tsx')
-rw-r--r--src/client/views/nodes/trails/PresBox.tsx97
1 files changed, 45 insertions, 52 deletions
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index 789509784..bb0ed0943 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -75,7 +75,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
constructor(props: any) {
super(props);
if (!PresBox.navigateToDocScript) {
- PresBox.navigateToDocScript = ScriptField.MakeFunction('navigateToDoc(self.presentation_targetDoc, self)')!;
+ PresBox.navigateToDocScript = ScriptField.MakeFunction('navigateToDoc(this.presentation_targetDoc, self)')!;
}
}
@@ -114,16 +114,16 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
return StrCast(this.layoutDoc.presFieldKey, 'data');
}
@computed get childDocs() {
- return DocListCast(this.rootDoc[this.presFieldKey]);
+ return DocListCast(this.Document[this.presFieldKey]);
}
@computed get tagDocs() {
return this.childDocs.map(doc => Cast(doc.presentation_targetDoc, Doc, null));
}
@computed get itemIndex() {
- return NumCast(this.rootDoc._itemIndex);
+ return NumCast(this.Document._itemIndex);
}
@computed get activeItem() {
- return DocCast(this.childDocs[NumCast(this.rootDoc._itemIndex)]);
+ return DocCast(this.childDocs[NumCast(this.Document._itemIndex)]);
}
@computed get targetDoc() {
return Cast(this.activeItem?.presentation_targetDoc, Doc, null);
@@ -142,13 +142,13 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
}
@computed get selectedDocumentView() {
if (SelectionManager.Views().length) return SelectionManager.Views()[0];
- if (this.selectedArray.size) return DocumentManager.Instance.getDocumentView(this.rootDoc);
+ if (this.selectedArray.size) return DocumentManager.Instance.getDocumentView(this.Document);
}
@computed get isPres() {
- return this.selectedDoc === this.rootDoc;
+ return this.selectedDoc === this.Document;
}
@computed get selectedDoc() {
- return this.selectedDocumentView?.rootDoc;
+ return this.selectedDocumentView?.Document;
}
isActiveItemTarget = (layoutDoc: Doc) => this.activeItem?.presentation_targetDoc === layoutDoc;
clearSelectedArray = () => this.selectedArray.clear();
@@ -170,7 +170,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
() => this.selectedDoc,
selected => {
document.removeEventListener('keydown', PresBox.keyEventsWrapper, true);
- (this._presKeyEvents = selected === this.rootDoc) && document.addEventListener('keydown', PresBox.keyEventsWrapper, true);
+ (this._presKeyEvents = selected === this.Document) && document.addEventListener('keydown', PresBox.keyEventsWrapper, true);
},
{ fireImmediately: true }
);
@@ -188,17 +188,10 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
);
this.props.setContentView?.(this);
this._unmounting = false;
- if (this.props.renderDepth > 0) {
- runInAction(() => {
- this.rootDoc._forceRenderEngine = computeTimelineLayout.name;
- this.layoutDoc._gridGap = 0;
- this.layoutDoc._yMargin = 0;
- });
- }
this.turnOffEdit(true);
this._disposers.selection = reaction(
() => SelectionManager.Views().slice(),
- views => (!PresBox.Instance || views.some(view => view.props.Document === this.rootDoc)) && this.updateCurrentPresentation(),
+ views => (!PresBox.Instance || views.some(view => view.Document === this.Document)) && this.updateCurrentPresentation(),
{ fireImmediately: true }
);
this._disposers.editing = reaction(
@@ -213,7 +206,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
@action
updateCurrentPresentation = (pres?: Doc) => {
- Doc.ActivePresentation = pres ?? this.rootDoc;
+ Doc.ActivePresentation = pres ?? this.Document;
PresBox.Instance = this;
};
@@ -321,7 +314,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
if (progressiveReveal(false)) return true;
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.rootDoc[StrCast(this.presFieldKey, 'data')]);
+ 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;
// before moving onto next slide, run the subroutines :)
@@ -356,7 +349,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
// Case 2: There are no other frames so it should go to the previous slide
prevSelected = Math.max(0, prevSelected - 1);
this.nextSlide(prevSelected);
- this.rootDoc._itemIndex = prevSelected;
+ this.Document._itemIndex = prevSelected;
} else if (this.childDocs[this.itemIndex - 1] === undefined && this.layoutDoc.presLoop) {
// Case 3: Pres loop is on so it should go to the last slide
this.nextSlide(this.childDocs.length - 1);
@@ -370,7 +363,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
public gotoDocument = action((index: number, from?: Doc, group?: boolean, finished?: () => void) => {
Doc.UnBrushAllDocs();
if (index >= 0 && index < this.childDocs.length) {
- this.rootDoc._itemIndex = index;
+ this.Document._itemIndex = index;
if (from?.mediaStopTriggerList && this.layoutDoc.presentation_status !== PresStatus.Edit) {
DocListCast(from.mediaStopTriggerList).forEach(this.stopTempMedia);
}
@@ -410,7 +403,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
playAnnotation = (anno: AudioField) => {};
@action
static restoreTargetDocView(bestTargetView: Opt<DocumentView>, activeItem: Doc, transTime: number, pinDocLayout: boolean = BoolCast(activeItem.config_pinLayout), pinDataTypes?: pinDataTypes, targetDoc?: Doc) {
- const bestTarget = bestTargetView?.rootDoc ?? (targetDoc?.layout_unrendered ? DocCast(targetDoc?.annotationOn) : targetDoc);
+ const bestTarget = bestTargetView?.Document ?? (targetDoc?.layout_unrendered ? DocCast(targetDoc?.annotationOn) : targetDoc);
if (!bestTarget) return;
let changed = false;
if (pinDocLayout) {
@@ -441,7 +434,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
const ffview = DocumentManager.Instance.getFirstDocumentView(context)?.CollectionFreeFormView;
if (ffview?.childDocs) {
PresBox.Instance._keyTimer = CollectionFreeFormView.gotoKeyframe(PresBox.Instance._keyTimer, ffview.childDocs, transTime);
- ffview.rootDoc._currentFrame = NumCast(activeFrame);
+ ffview.layoutDoc._currentFrame = NumCast(activeFrame);
}
}
}
@@ -600,7 +593,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
});
setTimeout(() => Array.from(transitioned).forEach(action(doc => (doc._dataTransition = undefined))), transTime + 10);
}
- if ((pinDataTypes?.pannable || (!pinDataTypes && (activeItem.config_viewBounds !== undefined || activeItem.config_panX !== undefined || activeItem.config_viewScale !== undefined))) && !bestTarget._isGroup) {
+ if ((pinDataTypes?.pannable || (!pinDataTypes && (activeItem.config_viewBounds !== undefined || activeItem.config_panX !== undefined || activeItem.config_viewScale !== undefined))) && !bestTarget.isGroup) {
const contentBounds = Cast(activeItem.config_viewBounds, listSpec('number'));
if (contentBounds) {
const viewport = { panX: (contentBounds[0] + contentBounds[2]) / 2, panY: (contentBounds[1] + contentBounds[3]) / 2, width: contentBounds[2] - contentBounds[0], height: contentBounds[3] - contentBounds[1] };
@@ -755,7 +748,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
const eleViewCache = Array.from(this._eleArray);
const resetSelection = action(() => {
if (!this.props.isSelected()) {
- const presDocView = DocumentManager.Instance.getDocumentView(this.rootDoc);
+ const presDocView = DocumentManager.Instance.getDocumentView(this.Document);
if (presDocView) SelectionManager.SelectView(presDocView, false);
this.clearSelectedArray();
selViewCache.forEach(doc => this.addToSelectedArray(doc));
@@ -897,7 +890,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
}
});
LightboxView.Instance.SetLightboxDoc(undefined);
- Doc.RemFromMyOverlay(this.rootDoc);
+ Doc.RemFromMyOverlay(this.Document);
return PresStatus.Edit;
};
};
@@ -936,7 +929,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
// The function allows for expanding the view of pres on toggle
@action toggleExpandMode = () => {
runInAction(() => (this._expandBoolean = !this._expandBoolean));
- this.rootDoc.expandBoolean = this._expandBoolean;
+ this.Document.expandBoolean = this._expandBoolean;
this.childDocs.forEach(doc => {
doc.presentation_expandInlineButton = this._expandBoolean;
});
@@ -986,16 +979,16 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
*/
@action
enterMinimize = () => {
- this.updateCurrentPresentation(this.rootDoc);
+ this.updateCurrentPresentation(this.Document);
clearTimeout(this._presTimer);
const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
this.props.removeDocument?.(this.layoutDoc);
- return PresBox.OpenPresMinimized(this.rootDoc, [pt[0] + (this.props.PanelWidth() - 250), pt[1] + 10]);
+ return PresBox.OpenPresMinimized(this.Document, [pt[0] + (this.props.PanelWidth() - 250), pt[1] + 10]);
};
exitMinimize = () => {
if (Doc.IsInMyOverlay(this.layoutDoc)) {
- Doc.RemFromMyOverlay(this.rootDoc);
- CollectionDockingView.AddSplit(this.rootDoc, OpenWhereMod.right);
+ Doc.RemFromMyOverlay(this.Document);
+ CollectionDockingView.AddSplit(this.Document, OpenWhereMod.right);
}
return PresStatus.Edit;
};
@@ -1021,8 +1014,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
const type_collection = e.target.selectedOptions[0].value as CollectionViewType;
this.layoutDoc.presFieldKey = this.fieldKey + (type_collection === CollectionViewType.Tree ? '-linearized' : '');
// pivot field may be set by the user in timeline view (or some other way) -- need to reset it here
- [CollectionViewType.Tree || CollectionViewType.Stacking].includes(type_collection) && (this.rootDoc._pivotField = undefined);
- this.rootDoc._type_collection = type_collection;
+ [CollectionViewType.Tree || CollectionViewType.Stacking].includes(type_collection) && (this.Document._pivotField = undefined);
+ this.Document._type_collection = type_collection;
if (this.isTreeOrStack) {
this.layoutDoc._gridGap = 0;
}
@@ -1083,7 +1076,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
return true;
};
childLayoutTemplate = () => Docs.Create.PresElementBoxDocument();
- removeDocument = (doc: Doc) => Doc.RemoveDocFromList(this.rootDoc, this.fieldKey, doc);
+ removeDocument = (doc: Doc) => Doc.RemoveDocFromList(this.Document, this.fieldKey, doc);
getTransform = () => this.props.ScreenToLocalTransform().translate(-5, -65); // listBox padding-left and pres-box-cont minHeight
panelHeight = () => this.props.PanelHeight() - 40;
/**
@@ -1123,7 +1116,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
@action
selectPres = () => {
- const presDocView = DocumentManager.Instance.getDocumentView(this.rootDoc);
+ const presDocView = DocumentManager.Instance.getDocumentView(this.Document);
presDocView && SelectionManager.SelectView(presDocView, false);
};
@@ -1139,7 +1132,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
if (noNav) {
const index = this.childDocs.indexOf(doc);
if (index >= 0 && index < this.childDocs.length) {
- this.rootDoc._itemIndex = index;
+ this.Document._itemIndex = index;
}
} else {
this.gotoDocument(this.childDocs.indexOf(doc), this.activeItem);
@@ -1237,8 +1230,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
case 'ArrowRight':
if (e.shiftKey && this.itemIndex < this.childDocs.length - 1) {
// TODO: update to work properly
- this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) + 1;
- this.addToSelectedArray(this.childDocs[this.rootDoc._itemIndex]);
+ this.Document._itemIndex = NumCast(this.Document._itemIndex) + 1;
+ this.addToSelectedArray(this.childDocs[this.Document._itemIndex]);
} else {
this.next();
if (this._presTimer) {
@@ -1254,8 +1247,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
case 'ArrowLeft':
if (e.shiftKey && this.itemIndex !== 0) {
// TODO: update to work properly
- this.rootDoc._itemIndex = NumCast(this.rootDoc._itemIndex) - 1;
- this.addToSelectedArray(this.childDocs[this.rootDoc._itemIndex]);
+ this.Document._itemIndex = NumCast(this.Document._itemIndex) - 1;
+ this.addToSelectedArray(this.childDocs[this.Document._itemIndex]);
} else {
this.back();
if (this._presTimer) {
@@ -1640,8 +1633,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
let dataField = Doc.LayoutFieldKey(tagDoc);
if (Cast(tagDoc[dataField], listSpec(Doc), null)?.filter(d => d instanceof Doc) === undefined) dataField = dataField + '_annotations';
- if (DocCast(activeItem.presentation_targetDoc).annotationOn) activeItem.data = ComputedField.MakeFunction(`self.presentation_targetDoc.annotationOn?.["${dataField}"]`);
- else activeItem.data = ComputedField.MakeFunction(`self.presentation_targetDoc?.["${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}"]`);
}}
checked={Cast(activeItem.presentation_indexed, 'number', null) !== undefined ? true : false}
/>
@@ -2221,7 +2214,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
const tab = tabMap && Array.from(tabMap).find(tab => tab.DashDoc.type === DocumentType.COL)?.DashDoc;
const presCollection = DocumentManager.GetContextPath(this.activeItem).reverse().lastElement().presentation_targetDoc ?? tab;
const data = Cast(presCollection?.data, listSpec(Doc));
- const config_data = Cast(this.rootDoc.data, listSpec(Doc));
+ const config_data = Cast(this.Document.data, listSpec(Doc));
if (data && config_data) {
data.push(doc);
this.props.pinToPres(doc, {});
@@ -2297,11 +2290,11 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
@computed get toolbar() {
const propIcon = SettingsManager.propertiesWidth > 0 ? 'angle-double-right' : 'angle-double-left';
const propTitle = SettingsManager.propertiesWidth > 0 ? 'Close Presentation Panel' : 'Open Presentation Panel';
- const mode = StrCast(this.rootDoc._type_collection) as CollectionViewType;
+ const mode = StrCast(this.Document._type_collection) as CollectionViewType;
const isMini: boolean = this.toolbarWidth <= 100;
const activeColor = SettingsManager.userVariantColor;
const inactiveColor = lightOrDark(SettingsManager.userBackgroundColor) === Colors.WHITE ? Colors.WHITE : SettingsManager.userBackgroundColor;
- return mode === CollectionViewType.Carousel3D || Doc.IsInMyOverlay(this.rootDoc) ? null : (
+ return mode === CollectionViewType.Carousel3D || Doc.IsInMyOverlay(this.Document) ? null : (
<div id="toolbarContainer" className={'presBox-toolbar'}>
{/* <Tooltip title={<><div className="dash-tooltip">{"Add new slide"}</div></>}><div className={`toolbar-button ${this.newDocumentTools ? "active" : ""}`} onClick={action(() => this.newDocumentTools = !this.newDocumentTools)}>
<FontAwesomeIcon icon={"plus"} />
@@ -2340,12 +2333,12 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
* presentPanel: The button to start the presentation / open minimized view of the presentation
*/
@computed get topPanel() {
- const mode = StrCast(this.rootDoc._type_collection) as CollectionViewType;
+ const mode = StrCast(this.Document._type_collection) as CollectionViewType;
const isMini: boolean = this.toolbarWidth <= 100;
return (
<div
- className={`presBox-buttons${Doc.IsInMyOverlay(this.rootDoc) ? ' inOverlay' : ''}`}
- style={{ background: Doc.ActivePresentation === this.rootDoc ? Colors.LIGHT_BLUE : undefined, display: !this.rootDoc._chromeHidden ? 'none' : undefined }}>
+ className={`presBox-buttons${Doc.IsInMyOverlay(this.Document) ? ' inOverlay' : ''}`}
+ style={{ background: Doc.ActivePresentation === this.Document ? Colors.LIGHT_BLUE : undefined, display: !this.Document._chromeHidden ? 'none' : undefined }}>
{isMini ? null : (
<select className="presBox-viewPicker" style={{ display: this.layoutDoc.presentation_status === 'edit' ? 'block' : 'none' }} onPointerDown={e => e.stopPropagation()} onChange={this.viewChanged} value={mode}>
<option onPointerDown={StopEvent} value={CollectionViewType.Stacking}>
@@ -2398,7 +2391,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
this.itemIndex === this.childDocs.length - 1 &&
(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.rootDoc);
+ const inOverlay = Doc.IsInMyOverlay(this.Document);
// Case 1: There are still other frames and should go through all frames before going to next slide
return (
<div className="presPanelOverlay" style={{ display: this.layoutDoc.presentation_status !== 'edit' ? 'inline-flex' : 'none' }}>
@@ -2569,7 +2562,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
render() {
// needed to ensure that the childDocs are loaded for looking up fields
this.childDocs.slice();
- const mode = StrCast(this.rootDoc._type_collection) as CollectionViewType;
+ const mode = StrCast(this.Document._type_collection) as CollectionViewType;
const presEnd =
!this.layoutDoc.presLoop &&
this.itemIndex === this.childDocs.length - 1 &&
@@ -2579,7 +2572,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
<div className="miniPres" onClick={e => e.stopPropagation()} onPointerEnter={action(e => (this._forceKeyEvents = true))}>
<div
className="presPanelOverlay"
- style={{ display: 'inline-flex', height: 30, background: Doc.ActivePresentation === this.rootDoc ? 'green' : '#323232', top: 0, zIndex: 3000000, boxShadow: this._presKeyEvents ? '0 0 0px 3px ' + Colors.MEDIUM_BLUE : undefined }}>
+ style={{ display: 'inline-flex', height: 30, background: Doc.ActivePresentation === this.Document ? 'green' : '#323232', top: 0, zIndex: 3000000, boxShadow: this._presKeyEvents ? '0 0 0px 3px ' + Colors.MEDIUM_BLUE : undefined }}>
<Tooltip title={<div className="dash-tooltip">{'Loop'}</div>}>
<div
className="presPanel-button"
@@ -2617,7 +2610,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
</div>
</div>
) : (
- <div className="presBox-cont" style={{ minWidth: Doc.IsInMyOverlay(this.rootDoc) ? PresBox.minimizedWidth : undefined }}>
+ <div className="presBox-cont" style={{ minWidth: Doc.IsInMyOverlay(this.Document) ? PresBox.minimizedWidth : undefined }}>
{this.topPanel}
{this.toolbar}
{this.newDocumentToolbarDropdown}
@@ -2637,7 +2630,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
childOpacity={returnOne}
childClickScript={PresBox.navigateToDocScript}
childLayoutTemplate={this.childLayoutTemplate}
- childXPadding={Doc.IsComicStyle(this.rootDoc) ? 20 : undefined}
+ childXPadding={Doc.IsComicStyle(this.Document) ? 20 : undefined}
filterAddDocument={this.addDocumentFilter}
removeDocument={returnFalse}
dontRegisterView={true}