From 50fa76eb644bc9fe2de7525f0f144c4393341af7 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Wed, 21 Oct 2020 02:19:02 +0800 Subject: updates before push --- src/client/views/collections/TabDocView.tsx | 2 +- .../collections/collectionFreeForm/MarqueeView.tsx | 1 + src/client/views/nodes/PresBox.tsx | 85 +++++++++++++--------- .../views/presentationview/PresElementBox.scss | 4 +- .../views/presentationview/PresElementBox.tsx | 17 ++++- 5 files changed, 66 insertions(+), 43 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx index cd84d2d78..9e25bb607 100644 --- a/src/client/views/collections/TabDocView.tsx +++ b/src/client/views/collections/TabDocView.tsx @@ -144,7 +144,7 @@ export class TabDocView extends React.Component { if (!curPresDocView) { CollectionDockingView.AddSplit(curPres, "right"); } - DocumentManager.Instance.jumpToDocument(doc, false, undefined, Cast(doc.context, Doc, null)); + DocumentManager.Instance.jumpToDocument(doc, false, undefined); } } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 7c64fd429..f95c21972 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -397,6 +397,7 @@ export class MarqueeView extends React.Component this.layoutDoc.presStatus = PresStatus.Edit; this.layoutDoc._gridGap = 0; this.layoutDoc._yMargin = 0; + document.addEventListener("keydown", this.keyEvents, true); this.turnOffEdit(true); DocListCastAsync((Doc.UserDoc().myPresentations as Doc).data).then(pres => !pres?.includes(this.rootDoc) && Doc.AddDocToList(Doc.UserDoc().myPresentations as Doc, "data", this.rootDoc)); @@ -561,22 +562,24 @@ export class PresBox extends ViewBoxBaseComponent * When the movement dropdown is changes */ @undoBatch - updateMovement = action((movement: any, activeItem: Doc, targetDoc: Doc) => { - switch (movement) { - case PresMovement.Zoom: //Pan and zoom - activeItem.presMovement = PresMovement.Zoom; - break; - case PresMovement.Pan: //Pan - activeItem.presMovement = PresMovement.Pan; - break; - case PresMovement.Jump: //Jump Cut - activeItem.presJump = true; - activeItem.presMovement = PresMovement.Jump; - break; - case PresMovement.None: default: - activeItem.presMovement = PresMovement.None; - break; - } + updateMovement = action((movement: any) => { + if (this._selectedArray) this._selectedArray.forEach((doc) => { + switch (movement) { + case PresMovement.Zoom: //Pan and zoom + doc.presMovement = PresMovement.Zoom; + break; + case PresMovement.Pan: //Pan + doc.presMovement = PresMovement.Pan; + break; + case PresMovement.Jump: //Jump Cut + doc.presJump = true; + doc.presMovement = PresMovement.Jump; + break; + case PresMovement.None: default: + doc.presMovement = PresMovement.None; + break; + } + }) }); setMovementName = action((movement: any, activeItem: Doc): string => { @@ -685,7 +688,7 @@ export class PresBox extends ViewBoxBaseComponent // Key for when the presentaiton is active @undoBatch - keyEvents = action(async (e: KeyboardEvent) => { + keyEvents = action((e: KeyboardEvent) => { if (e.target instanceof HTMLInputElement) return; let handled = false; const anchorNode = document.activeElement as HTMLDivElement; @@ -713,16 +716,22 @@ export class PresBox extends ViewBoxBaseComponent if (this.layoutDoc.presStatus === "manual") this.startAutoPres(this.itemIndex); else if (this.layoutDoc.presStatus === "auto") if (this._presTimer) clearTimeout(this._presTimer); handled = true; - } if (e.keyCode === 8) { // delete selected items + } if (e.keyCode === 8) { // delete (backspace) selected items if (this.layoutDoc.presStatus === "edit") { - await Promise.all(this._selectedArray.map((doc, i): boolean => { - const removed: boolean = this.removeDocument(doc); - console.log("Is removed? : " + i + " | " + removed); - return removed; - })); - action(() => this._selectedArray = []); - action(() => this._eleArray = []); - action(() => this._dragArray = []); + + let result: any = []; + runInAction(() => { + for (let doc of this._selectedArray) { + setTimeout(() => { + const removed: boolean = this.removeDocument(doc); + result.push(removed) + console.log("Is removed? : " + " | " + removed); + }, 100); + } + this._selectedArray = [] + this._eleArray = [] + this._dragArray = [] + }); handled = true; } } if (handled) { @@ -737,8 +746,8 @@ export class PresBox extends ViewBoxBaseComponent } if ((e.keyCode === 39 || e.keyCode === 40) && e.shiftKey) { // left(37) / a(65) / up(38) to go back if (this.layoutDoc.presStatus === "edit" && this._selectedArray.length > 0) { const index = this.childDocs.indexOf(this._selectedArray[this._selectedArray.length]); - if ((index - 1) > 0) { - this._selectedArray.push(this.childDocs[index - 1]); + if ((index + 1) < this._selectedArray.length) { + this._selectedArray.push(this.childDocs[index + 1]); } } handled = true; @@ -852,7 +861,9 @@ export class PresBox extends ViewBoxBaseComponent if (change) timeInMS += change; if (timeInMS < 100) timeInMS = 100; if (timeInMS > 10000) timeInMS = 10000; - if (this.activeItem) this.activeItem.presTransition = timeInMS; + if (this._selectedArray) this._selectedArray.forEach((doc) => { + doc.presTransition = timeInMS; + }) } // Converts seconds to ms and updates presDuration @@ -862,7 +873,9 @@ export class PresBox extends ViewBoxBaseComponent if (change) timeInMS += change; if (timeInMS < 100) timeInMS = 100; if (timeInMS > 20000) timeInMS = 20000; - if (this.activeItem) this.activeItem.presDuration = timeInMS; + if (this._selectedArray) this._selectedArray.forEach((doc) => { + doc.presDuration = timeInMS; + }) } @@ -883,10 +896,10 @@ export class PresBox extends ViewBoxBaseComponent {this.setMovementName(activeItem.presMovement, activeItem)}
e.stopPropagation()} style={{ display: this.openMovementDropdown ? "grid" : "none" }}> -
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.None, activeItem, targetDoc)}>None
-
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Zoom, activeItem, targetDoc)}>Pan and Zoom
-
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Pan, activeItem, targetDoc)}>Pan
-
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Jump, activeItem, targetDoc)}>Jump cut
+
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.None)}>None
+
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Zoom)}>Pan and Zoom
+
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Pan)}>Pan
+
e.stopPropagation()} onClick={() => this.updateMovement(PresMovement.Jump)}>Jump cut
@@ -972,9 +985,9 @@ export class PresBox extends ViewBoxBaseComponent
-
this.applyTo(this._selectedArray)}> + {/*
this.applyTo(this._selectedArray)}> Apply to selected -
+
*/}
this.applyTo(this.childDocs)}> Apply to all
diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss index 60fe33f3f..6152c56e9 100644 --- a/src/client/views/presentationview/PresElementBox.scss +++ b/src/client/views/presentationview/PresElementBox.scss @@ -174,13 +174,13 @@ $slide-active: #5B9FDD; justify-content: center; align-content: center; width: 100px; - height: 40px; + height: 30px; position: absolute; background-color: $dark-blue; z-index: 4000; border-radius: 10px; box-shadow: black 0.4vw 0.4vw 0.8vw; - + line-height: 30px; } .presItem-miniSlide { diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 61d6e9027..f136d7f8e 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -22,6 +22,7 @@ import { undoBatch } from "../../util/UndoManager"; import { EditableView } from "../EditableView"; import { DocUtils } from "../../documents/Documents"; import { DateField } from "../../../fields/DateField"; +import { DocumentManager } from "../../util/DocumentManager"; export const presSchema = createSchema({ presentationTargetDoc: Doc, @@ -162,7 +163,7 @@ export class PresElementBox extends ViewBoxBaseComponent { - const miniView: boolean = PresBox.Instance.toolbarWidth <= 100; + const miniView: boolean = this.toolbarWidth <= 100; const activeItem = this.rootDoc; const dragArray = PresBox.Instance._dragArray; const dragData = new DragManager.DocumentDragData(PresBox.Instance.sortArray().map(doc => doc)); @@ -278,11 +279,19 @@ export class PresElementBox extends ViewBoxBaseComponent= 300; - const miniView: boolean = PresBox.Instance.toolbarWidth <= 100; + const toolbarWidth: number = this.toolbarWidth; + const showMore: boolean = this.toolbarWidth >= 300; + const miniView: boolean = this.toolbarWidth <= 100; const targetDoc: Doc = this.targetDoc; const activeItem: Doc = this.rootDoc; return ( -- cgit v1.2.3-70-g09d2