From 54e8450ea88a03bee23cbad3321b5f6bac465e33 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Tue, 12 May 2020 13:56:14 -0400 Subject: fixed issues with preselements not updating. fixed focus issues with stacking view for Presentations --- src/client/documents/Documents.ts | 1 + .../views/collections/CollectionStackingView.tsx | 7 ++-- src/client/views/nodes/LabelBox.scss | 1 + src/client/views/nodes/PresBox.tsx | 45 ++++++++++++---------- .../views/presentationview/PresElementBox.tsx | 22 +++++------ 5 files changed, 40 insertions(+), 36 deletions(-) (limited to 'src') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 95b8daafc..125a531f4 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -127,6 +127,7 @@ export interface DocumentOptions { borderRounding?: string; boxShadow?: string; dontRegisterChildViews?: boolean; + lookupField?: ScriptField; // script that returns the value of a field. This script is passed the rootDoc, layoutDoc, field, and container of the document. see PresBox. "onDoubleClick-rawScript"?: string; // onDoubleClick script in raw text form "onClick-rawScript"?: string; // onClick script in raw text form "onCheckedClick-rawScript"?: string; // onChecked script in raw text form diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index 97459d910..821a6d476 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -175,8 +175,8 @@ export class CollectionStackingView extends CollectionSubView(StackingDocument) focusDocument = (doc: Doc, willZoom: boolean, scale?: number, afterFocus?: () => boolean) => { - Doc.BrushDoc(this.props.Document); - this.props.focus(this.props.Document); + Doc.BrushDoc(doc); + this.props.focus(doc); Doc.linkFollowHighlight(doc); const found = this._mainCont && Array.from(this._mainCont.getElementsByClassName("documentView-node")).find((node: any) => node.id === doc[Id]); @@ -186,8 +186,7 @@ export class CollectionStackingView extends CollectionSubView(StackingDocument) smoothScroll(500, this._mainCont!, localTop[1] + this._mainCont!.scrollTop); } afterFocus && setTimeout(() => { - if (afterFocus?.()) { - } + if (afterFocus?.()) { } }, 500); } diff --git a/src/client/views/nodes/LabelBox.scss b/src/client/views/nodes/LabelBox.scss index 9e3ff96a7..b605df262 100644 --- a/src/client/views/nodes/LabelBox.scss +++ b/src/client/views/nodes/LabelBox.scss @@ -4,6 +4,7 @@ border-radius: inherit; display: flex; flex-direction: column; + position: absolute; } .labelBox-mainButton { diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index 5ff71e922..e203c7efa 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -30,7 +30,7 @@ export class PresBox extends ViewBoxBaseComponent public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresBox, fieldKey); } @observable _isChildActive = false; @computed get childDocs() { return DocListCast(this.dataDoc[this.fieldKey]); } - @computed get currentIndex() { return NumCast(this.presElement?.currentIndex); } + @computed get itemIndex() { return NumCast(this.rootDoc._itemIndex); } @computed get presElement() { return Cast(Doc.UserDoc().presElement, Doc, null); } constructor(props: any) { super(props); @@ -42,10 +42,8 @@ export class PresBox extends ViewBoxBaseComponent // this is a design choice -- we could write this data to the presElements which would require a reaction to keep it up to date, and it would prevent // the preselement docs from being part of multiple presentations since they would all have the same field, or we'd have to keep per-presentation data // stored on each pres element. - (this.presElement as Doc).lookupField = ScriptField.MakeScript( - `if (field === 'indexInPres') return docList(container[container.presentationFieldKey]).indexOf(data);` + - `if (field === 'presCollapsedHeight') return container._viewType === '${CollectionViewType.Stacking}' ? 50 : 46;` + - "return undefined;", { field: "string", data: Doc.name, container: Doc.name }); + (this.presElement as Doc).lookupField = ScriptField.MakeFunction("lookupPresBoxField(container, field, data)", + { 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 } @@ -61,15 +59,15 @@ export class PresBox extends ViewBoxBaseComponent @action next = () => { this.updateCurrentPresentation(); - if (this.childDocs[this.currentIndex + 1] !== undefined) { - let nextSelected = this.currentIndex + 1; - this.gotoDocument(nextSelected, this.currentIndex); + if (this.childDocs[this.itemIndex + 1] !== undefined) { + let nextSelected = this.itemIndex + 1; + this.gotoDocument(nextSelected, this.itemIndex); for (nextSelected = nextSelected + 1; nextSelected < this.childDocs.length; nextSelected++) { if (!this.childDocs[nextSelected].groupButton) { break; } else { - this.gotoDocument(nextSelected, this.currentIndex); + this.gotoDocument(nextSelected, this.itemIndex); } } } @@ -79,18 +77,18 @@ export class PresBox extends ViewBoxBaseComponent @action back = () => { this.updateCurrentPresentation(); - const docAtCurrent = this.childDocs[this.currentIndex]; + const docAtCurrent = this.childDocs[this.itemIndex]; if (docAtCurrent) { //check if any of the group members had used zooming in including the current document //If so making sure to zoom out, which goes back to state before zooming action - let prevSelected = this.currentIndex; + let prevSelected = this.itemIndex; let didZoom = docAtCurrent.zoomButton; for (; !didZoom && prevSelected > 0 && this.childDocs[prevSelected].groupButton; prevSelected--) { didZoom = this.childDocs[prevSelected].zoomButton; } prevSelected = Math.max(0, prevSelected - 1); - this.gotoDocument(prevSelected, this.currentIndex); + this.gotoDocument(prevSelected, this.itemIndex); } } @@ -194,10 +192,10 @@ export class PresBox extends ViewBoxBaseComponent this.updateCurrentPresentation(); Doc.UnBrushAllDocs(); if (index >= 0 && index < this.childDocs.length) { - this.presElement.currentIndex = index; + this.rootDoc._itemIndex = index; - if (!this.presElement.presStatus) { - this.presElement.presStatus = true; + if (!this.layoutDoc.presStatus) { + this.layoutDoc.presStatus = true; this.startPresentation(index); } @@ -210,12 +208,12 @@ export class PresBox extends ViewBoxBaseComponent //The function that starts or resets presentaton functionally, depending on status flag. startOrResetPres = () => { this.updateCurrentPresentation(); - if (this.presElement.presStatus) { + if (this.layoutDoc.presStatus) { this.resetPresentation(); } else { - this.presElement.presStatus = true; + this.layoutDoc.presStatus = true; this.startPresentation(0); - this.gotoDocument(0, this.currentIndex); + this.gotoDocument(0, this.itemIndex); } } @@ -225,7 +223,7 @@ export class PresBox extends ViewBoxBaseComponent this.updateCurrentPresentation(); this.childDocs.forEach(doc => (doc.presentationTargetDoc as Doc).opacity = 1); this.rootDoc._itemIndex = 0; - this.presElement.presStatus = false; + this.layoutDoc.presStatus = false; } //The function that starts the presentation, also checking if actions should be applied @@ -281,7 +279,7 @@ export class PresBox extends ViewBoxBaseComponent } childLayoutTemplate = () => this.rootDoc._viewType !== CollectionViewType.Stacking ? undefined : this.presElement; removeDocument = (doc: Doc) => Doc.RemoveDocFromList(this.dataDoc, this.fieldKey, doc); - selectElement = (doc: Doc) => this.gotoDocument(this.childDocs.indexOf(doc), NumCast(this.rootDoc._itemIndex)); + selectElement = (doc: Doc) => this.gotoDocument(this.childDocs.indexOf(doc), NumCast(this.itemIndex)); getTransform = () => this.props.ScreenToLocalTransform().translate(-5, -65);// listBox padding-left and pres-box-cont minHeight panelHeight = () => this.props.PanelHeight() - 20; active = (outsideReaction?: boolean) => ((InkingControl.Instance.selectedTool === InkTool.None && !this.layoutDoc.isBackground) && @@ -329,5 +327,10 @@ export class PresBox extends ViewBoxBaseComponent ; } } -Scripting.addGlobal(function lookupPresBoxField(presLayout: Doc, data: Doc, fieldKey: string) { +Scripting.addGlobal(function lookupPresBoxField(container: Doc, field: string, data: Doc) { + if (field === 'indexInPres') return DocListCast(container[StrCast(container.presentationFieldKey)]).indexOf(data); + if (field === 'presCollapsedHeight') return container._viewType === CollectionViewType.Stacking ? 50 : 46; + if (field === 'presStatus') return container.presStatus; + if (field === '_itemIndex') return container._itemIndex; + return undefined; }); diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 6d7602268..e13a5f2f7 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -41,8 +41,8 @@ export class PresElementBox extends ViewBoxBaseComponent= this.currentIndex && this.targetDoc) { + if (this.indexInPres >= this.itemIndex && this.targetDoc) { this.targetDoc.opacity = 1; } } else { - if (this.presStatus && this.indexInPres > this.currentIndex && this.targetDoc) { + if (this.presStatus && this.indexInPres > this.itemIndex && this.targetDoc) { this.targetDoc.opacity = 0; } } @@ -82,12 +82,12 @@ export class PresElementBox extends ViewBoxBaseComponent