diff options
Diffstat (limited to 'src/client/views/nodes/trails/PresBox.tsx')
| -rw-r--r-- | src/client/views/nodes/trails/PresBox.tsx | 125 |
1 files changed, 99 insertions, 26 deletions
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx index 077db9077..d85f0b640 100644 --- a/src/client/views/nodes/trails/PresBox.tsx +++ b/src/client/views/nodes/trails/PresBox.tsx @@ -90,13 +90,21 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { @observable _expandBoolean: boolean = false; private _disposers: { [name: string]: IReactionDisposer } = {}; + + @observable static startMarquee: boolean = false; // onclick "+ new slide" in presentation mode, set as true, then when marquee selection finish, onPointerUp automatically triggers PinWithView @observable private transitionTools: boolean = false; @observable private newDocumentTools: boolean = false; @observable private progressivizeTools: boolean = false; @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<number[], Doc> + @computed get childDocs() { return DocListCast(this.rootDoc.presentationLinearizedDocuments); } + @observable _treeViewMap: Map<number, Doc> = new Map<number, Doc>(); + @computed get tagDocs() { const tagDocs: Doc[] = []; for (const doc of this.childDocs) { @@ -132,6 +140,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { { 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<Doc>(); } @computed get selectedDocumentView() { if (SelectionManager.Views().length) return SelectionManager.Views()[0]; @@ -212,6 +222,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { } //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); @@ -375,7 +386,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { self._eleArray.splice(0, self._eleArray.length, ...eleViewCache); }); const openInTab = (doc: Doc, finished?: () => void) => { - collectionDocView ? collectionDocView.props.addDocTab(doc, "") : this.props.addDocTab(doc, ":left"); + collectionDocView ? collectionDocView.props.addDocTab(doc, "") : this.props.addDocTab(doc, ""); this.layoutDoc.presCollection = targetDoc; // this still needs some fixing setTimeout(resetSelection, 500); @@ -387,7 +398,12 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { }; // If openDocument is selected then it should open the document for the user if (activeItem.openDocument) { - LightboxView.SetLightboxDoc(targetDoc); + // LightboxView.SetLightboxDoc(targetDoc); + // activeItem: "slide in the sidebar" --> maps to target document (targetDoc) in the canvas + console.log(activeItem); + console.log("openDocument triggered"); + + openInTab(targetDoc); } else if (curDoc.presMovement === PresMovement.Pan && targetDoc) { LightboxView.SetLightboxDoc(undefined); await DocumentManager.Instance.jumpToDocument(targetDoc, false, openInTab, [srcContext], undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection, undefined, true); // documents open in new tab instead of on right @@ -735,6 +751,10 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { //Regular click @action selectElement = async (doc: Doc) => { + console.log("tree docs are:", this._treeViewMap); + console.log("child docs are:", this.childDocs); + console.log("linearized docs:", this.rootDoc.presentationLinearizedDocuments); + 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); @@ -2404,6 +2424,45 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { else this.pauseAutoPres(); } + @action + startMarqueeCreateSlide = () => { + PresBox.startMarquee = true; + } + + AddToMap = (treeViewDoc: Doc, index: number[]): Doc[] => { + var indexNum = 0; + for (let i = 0; i < index.length; i++) { + indexNum += (index[i] * (10 ** (-i))); + } + this._treeViewMap.set(indexNum, treeViewDoc); + console.log(String(index), treeViewDoc) + this.props.Document.presentationLinearizedDocuments = new List<Doc>(this.sort(this._treeViewMap)); // this is a flat array of Docs + console.log(this.props.Document.presentationLinearizedDocuments) + return this.childDocs; + } + + RemFromMap = (treeViewDoc: Doc, index: number[]): Doc[] => { + var indexNum = 0; + for (let i = 0; i < index.length; i++) { + indexNum += (index[i] * (10 ** (-i))); + } + console.log(String(index), treeViewDoc) + this._treeViewMap.delete(indexNum) + this.props.Document.presentationLinearizedDocuments = new List<Doc>(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<number, Doc>): 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; @@ -2437,33 +2496,47 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() { {this.toolbar} {this.newDocumentToolbarDropdown} <div className="presBox-listCont"> - {mode !== CollectionViewType.Invalid ? - <CollectionView {...this.props} - ContainingCollectionDoc={this.props.Document} - PanelWidth={this.props.PanelWidth} - PanelHeight={this.panelHeight} - childIgnoreNativeSize={true} - moveDocument={returnFalse} - childFitWidth={returnTrue} - childOpacity={returnOne} - childLayoutTemplate={this.childLayoutTemplate} - filterAddDocument={this.addDocumentFilter} - removeDocument={returnFalse} - dontRegisterView={true} - focus={this.selectElement} - ScreenToLocalTransform={this.getTransform} - /> - : (null) + <div className="Slide" style={{ height: `calc(100% - 100px)` }}> + {mode !== CollectionViewType.Invalid ? + <CollectionView {...this.props} + ContainingCollectionDoc={this.props.Document} + PanelWidth={this.props.PanelWidth} + PanelHeight={this.panelHeight} + childIgnoreNativeSize={true} + moveDocument={returnFalse} + childFitWidth={returnTrue} + childOpacity={returnOne} + childLayoutTemplate={this.childLayoutTemplate} + filterAddDocument={this.addDocumentFilter} + removeDocument={returnFalse} + dontRegisterView={true} + focus={this.selectElement} + ScreenToLocalTransform={this.getTransform} + // TODO: [AL] implement AddToMap, RemFromMap functions (outside this) + AddToMap={this.AddToMap} + RemFromMap={this.RemFromMap} + hierarchyIndex={[]} + /> : (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> </div>; } } -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 |
