From 314ed039ea4d5128c84de8ec1f06c1ccb0d0e3ec Mon Sep 17 00:00:00 2001 From: Aubrey-Li Date: Mon, 2 May 2022 20:29:48 -0400 Subject: PresBox indexing rework --- .../views/collections/CollectionTreeView.tsx | 10 +++- src/client/views/collections/CollectionView.tsx | 4 ++ src/client/views/collections/TreeView.tsx | 35 ++++++++++++-- src/client/views/nodes/trails/PresBox.tsx | 54 ++++++++++++++++++---- 4 files changed, 91 insertions(+), 12 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index 41970eb96..5dafb08c0 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -37,6 +37,10 @@ export type collectionTreeViewProps = { treeViewSkipFields?: string[]; // prevents specific fields from being displayed (see LinkBox) onCheckedClick?: () => ScriptField; onChildClick?: () => ScriptField; + // TODO: [AL] add these fields + AddToMap?: (treeViewDoc: Doc, index: number[]) => Doc[]; + RemFromMap?: (treeViewDoc: Doc, index: number[]) => Doc[]; + hierarchyIndex?: number[]; }; @observer @@ -250,7 +254,11 @@ export class CollectionTreeView extends CollectionSubView Doc[]; + RemFromMap?: (treeViewDoc: Doc, index: number[]) => Doc[]; + hierarchyIndex?: number[]; } @observer export class CollectionView extends ViewBoxAnnotatableComponent() { diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx index c0037ff1b..304d68a20 100644 --- a/src/client/views/collections/TreeView.tsx +++ b/src/client/views/collections/TreeView.tsx @@ -63,6 +63,10 @@ export interface TreeViewProps { onChildClick?: () => ScriptField; skipFields?: string[]; firstLevel: boolean; + // TODO: [AL] add these + AddToMap?: (treeViewDoc: Doc, index: number[]) => Doc[]; + RemFromMap?: (treeViewDoc: Doc, index: number[]) => Doc[]; + hierarchyIndex?: number[]; } const treeBulletWidth = function () { return Number(TREE_BULLET_WIDTH.replace("px", "")); }; @@ -190,6 +194,13 @@ export class TreeView extends React.Component { this._treeEle && this.props.unobserveHeight(this._treeEle); document.removeEventListener("pointermove", this.onDragMove, true); document.removeEventListener("pointermove", this.onDragUp, true); + // TODO: [AL] add these + this.props.RemFromMap?.(this.doc, this.props.hierarchyIndex!); + } + + componentDidMount() { + // TODO: [AL] add these + this.props.AddToMap?.(this.doc, this.props.hierarchyIndex!); } onDragUp = (e: PointerEvent) => { @@ -356,7 +367,12 @@ export class TreeView extends React.Component { this.props.dropAction, this.props.addDocTab, this.titleStyleProvider, this.props.ScreenToLocalTransform, this.props.isContentActive, this.props.panelWidth, this.props.renderDepth, this.props.treeViewHideHeaderFields, [...this.props.renderedIds, doc[Id]], this.props.onCheckedClick, this.props.onChildClick, this.props.skipFields, false, this.props.whenChildContentsActiveChanged, - this.props.dontRegisterView, emptyFunction, emptyFunction, this.childContextMenuItems()); + this.props.dontRegisterView, emptyFunction, emptyFunction, this.childContextMenuItems(), + // TODO: [AL] Add these + this.props.AddToMap, + this.props.RemFromMap, + this.props.hierarchyIndex + ); } else { contentElement = { StrCast(this.doc.childDropAction, this.props.dropAction) as dropActionType, this.props.addDocTab, this.titleStyleProvider, this.props.ScreenToLocalTransform, this.props.isContentActive, this.props.panelWidth, this.props.renderDepth, this.props.treeViewHideHeaderFields, [...this.props.renderedIds, this.doc[Id]], this.props.onCheckedClick, this.props.onChildClick, this.props.skipFields, false, this.props.whenChildContentsActiveChanged, - this.props.dontRegisterView, emptyFunction, emptyFunction, this.childContextMenuItems())} + this.props.dontRegisterView, emptyFunction, emptyFunction, this.childContextMenuItems(), + // TODO: [AL] add these + this.props.AddToMap, + this.props.RemFromMap, + this.props.hierarchyIndex, + )} ; } else if (this.treeViewExpandedView === "fields") { return
    @@ -946,7 +967,11 @@ export class TreeView extends React.Component { dontRegisterView: boolean | undefined, observerHeight: (ref: any) => void, unobserveHeight: (ref: any) => void, - contextMenuItems: ({ script: ScriptField, filter: ScriptField, label: string, icon: string }[]) + contextMenuItems: ({ script: ScriptField, filter: ScriptField, label: string, icon: string }[]), + // TODO: [AL] add these + AddToMap?: (treeViewDoc: Doc, index: number[]) => Doc[], + RemFromMap?: (treeViewDoc: Doc, index: number[]) => Doc[], + hierarchyIndex?: number[], ) { const viewSpecScript = Cast(containerCollection.viewSpecScript, ScriptField); if (viewSpecScript) { @@ -987,6 +1012,10 @@ export class TreeView extends React.Component { dataDoc={pair.data} containerCollection={containerCollection} prevSibling={docs[i]} + // TODO: [AL] add these + hierarchyIndex={[...hierarchyIndex!, i]} + AddToMap={AddToMap} + RemFromMap={RemFromMap} treeView={treeView} indentDocument={indent} outdentDocument={outdent} diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx index 4fa52565e..60d54c433 100644 --- a/src/client/views/nodes/trails/PresBox.tsx +++ b/src/client/views/nodes/trails/PresBox.tsx @@ -98,7 +98,13 @@ export class PresBox extends ViewBoxBaseComponent() { @observable private openMovementDropdown: boolean = false; @observable private openEffectDropdown: boolean = false; @observable private presentTools: boolean = false; - @computed get childDocs() { return DocListCast(this.rootDoc[this.fieldKey]); } + // @computed get childDocs() { return DocListCast(this.rootDoc[this.fieldKey]); } + // TODO: [AL] add childDocs() and treeMap fields + // @computed get childDocs() { return DocListCast(this.rootDoc.presentationaLinearizedDocuments); } + //_treeViewMap:Map + @computed get childDocs() { return DocListCast(this.rootDoc.presentationLinearizedDocuments); } + @observable _treeViewMap: Map = new Map(); + @computed get tagDocs() { const tagDocs: Doc[] = []; for (const doc of this.childDocs) { @@ -134,6 +140,8 @@ export class PresBox extends ViewBoxBaseComponent() { { field: "string", data: Doc.name, container: Doc.name }); } this.props.Document.presentationFieldKey = this.fieldKey; // provide info to the presElement script so that it can look up rendering information about the presBox + //TODO: [AL] change this + this.props.Document.presentationLinearizedDocuments = new List(); } @computed get selectedDocumentView() { if (SelectionManager.Views().length) return SelectionManager.Views()[0]; @@ -214,6 +222,7 @@ export class PresBox extends ViewBoxBaseComponent() { } //TODO: al: it seems currently that tempMedia doesn't stop onslidechange after clicking the button; the time the tempmedia stop depends on the start & end time + // TODO: to handle child slides (entering into subtrail and exiting), also the next() and back() functions // No more frames in current doc and next slide is defined, therefore move to next slide nextSlide = (activeNext: Doc) => { const targetNext = Cast(activeNext.presentationTargetDoc, Doc, null); @@ -741,7 +750,8 @@ export class PresBox extends ViewBoxBaseComponent() { //Regular click @action selectElement = async (doc: Doc) => { - console.log("got here", this.childDocs.indexOf(doc)) + console.log("child docs are:", doc); + console.log("got here", this.childDocs.indexOf(doc)); const context = Cast(doc.context, Doc, null); this.gotoDocument(this.childDocs.indexOf(doc), this.activeItem); if (doc.presPinView || doc.presentationTargetDoc === this.layoutDoc.presCollection) setTimeout(() => this.updateCurrentPresentation(context), 0); @@ -2416,6 +2426,29 @@ export class PresBox extends ViewBoxBaseComponent() { PresBox.startMarquee = true; } + AddToMap = (treeViewDoc: Doc, index: number[]): Doc[] => { + this._treeViewMap.set(String(index), treeViewDoc); + this.props.Document.presentationaLinearizedDocuments = new List(this.sort(this._treeViewMap)); // this is a flat array of Docs + return this.childDocs; + } + + RemFromMap = (treeViewDoc: Doc, index: number[]): Doc[] => { + this._treeViewMap.delete(String(index)) + this.props.Document.presentationaLinearizedDocuments = new List(this.sort(this._treeViewMap)); + return this.childDocs; + } + + // TODO: [AL] implement sort function for an array of numbers (e.g. arr[1,2,4] v arr[1,2,1]) + sort = (treeViewMap: Map): Doc[] => { + // TODO + const sortedMap = [...treeViewMap.entries()].sort(); + var sortedDocs = []; + for (var kv of sortedMap) { + sortedDocs.push(kv[1]); + } + return sortedDocs; + } + render() { // calling this method for keyEvents this.isPres; @@ -2465,6 +2498,10 @@ export class PresBox extends ViewBoxBaseComponent() { dontRegisterView={true} focus={this.selectElement} ScreenToLocalTransform={this.getTransform} + // TODO: [AL] implement AddToMap, RemFromMap functions (outside this) + AddToMap={this.AddToMap} + RemFromMap={this.RemFromMap} + hierarchyIndex={[]} /> : (null) } @@ -2480,11 +2517,12 @@ export class PresBox extends ViewBoxBaseComponent() { ; } } -ScriptingGlobals.add(function lookupPresBoxField(container: Doc, field: string, data: Doc) { - if (field === 'indexInPres') return DocListCast(container[StrCast(container.presentationFieldKey)]).indexOf(data); - if (field === 'presCollapsedHeight') return [CollectionViewType.Tree || CollectionViewType.Stacking].includes(container._viewType as any) ? 35 : 31; - if (field === 'presStatus') return container.presStatus; - if (field === '_itemIndex') return container._itemIndex; - if (field === 'presBox') return container; +// this func communicates with PresBoxElement to send information of the doc +ScriptingGlobals.add(function lookupPresBoxField(presBoxDoc: Doc, field: string, presEleDoc: Doc) { + if (field === 'indexInPres') return DocListCast(presBoxDoc.presentationLinearizedDocuments).indexOf(presEleDoc); + if (field === 'presCollapsedHeight') return [CollectionViewType.Tree || CollectionViewType.Stacking].includes(presBoxDoc._viewType as any) ? 35 : 31; + if (field === 'presStatus') return presBoxDoc.presStatus; + if (field === '_itemIndex') return presBoxDoc._itemIndex; + if (field === 'presBox') return presBoxDoc; return undefined; }); \ No newline at end of file -- cgit v1.2.3-70-g09d2