From d962dad895c8b7d480f33480eac17c45b5251bc5 Mon Sep 17 00:00:00 2001 From: usodhi <61431818+usodhi@users.noreply.github.com> Date: Mon, 3 Aug 2020 13:04:25 +0530 Subject: close button calculation includes collection+doc and slightly more efficient hopefully --- src/client/views/DocumentDecorations.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'src/client/views') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 3896ad519..48e5c050c 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -587,7 +587,11 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> if (SnappingManager.GetIsDragging() || bounds.r - bounds.x < 2 || bounds.x === Number.MAX_VALUE || !seldoc || this._hidden || isNaN(bounds.r) || isNaN(bounds.b) || isNaN(bounds.x) || isNaN(bounds.y)) { return (null); } - const canDelete = SelectionManager.SelectedDocuments().map(docView => GetEffectiveAcl(docView.props.ContainingCollectionDoc)).some(permission => permission === AclAdmin || permission === AclEdit); + const canDelete = SelectionManager.SelectedDocuments().some(docView => { + const docAcl = GetEffectiveAcl(docView.props.Document); + const collectionAcl = GetEffectiveAcl(docView.props.ContainingCollectionDoc); + return [docAcl, collectionAcl].some(acl => [AclAdmin, AclEdit].includes(acl)); + }); const minimal = bounds.r - bounds.x < 100 ? true : false; const maximizeIcon = minimal ? (
Show context menu
} placement="top"> -- cgit v1.2.3-70-g09d2 From 2a5ed028c356e122acade2b695cdb56f727c681f Mon Sep 17 00:00:00 2001 From: usodhi <61431818+usodhi@users.noreply.github.com> Date: Tue, 4 Aug 2020 01:38:55 +0530 Subject: reinstated collection acl inheritance --- src/client/views/DocComponent.tsx | 19 ++++++++++--------- src/client/views/collections/CollectionView.tsx | 19 ++++++++----------- 2 files changed, 18 insertions(+), 20 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx index 804c7a8d4..34144d3eb 100644 --- a/src/client/views/DocComponent.tsx +++ b/src/client/views/DocComponent.tsx @@ -154,15 +154,16 @@ export function ViewBoxAnnotatableComponent

{ - // const dataDoc = d[DataSym]; - // dataDoc[AclSym] = d[AclSym] = this.props.Document[AclSym]; - // for (const [key, value] of Object.entries(this.props.Document[AclSym])) { - // dataDoc[key] = d[key] = this.AclMap.get(value); - // } - // }); - // } + if (this.props.Document[AclSym]) { + added.forEach(d => { + const dataDoc = d[DataSym]; + dataDoc[AclSym] = d[AclSym] = this.props.Document[AclSym]; + for (const [key, value] of Object.entries(this.props.Document[AclSym])) { + dataDoc[key] = d[key] = this.AclMap.get(value); + } + }); + } + if (effectiveAcl === AclAddonly) { added.map(doc => Doc.AddDocToList(targetDataDoc, this.annotationKey, doc)); } diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index 89034a0c0..44875ac1e 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -17,7 +17,7 @@ import { listSpec } from '../../../fields/Schema'; import { ComputedField, ScriptField } from '../../../fields/ScriptField'; import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from '../../../fields/Types'; import { ImageField } from '../../../fields/URLField'; -import { TraceMobx, GetEffectiveAcl, SharingPermissions } from '../../../fields/util'; +import { TraceMobx, GetEffectiveAcl, SharingPermissions, distributeAcls } from '../../../fields/util'; import { emptyFunction, emptyPath, returnEmptyFilter, returnFalse, returnOne, returnZero, setupMoveUpEvents, Utils } from '../../../Utils'; import { Docs, DocUtils } from '../../documents/Documents'; import { DocumentType } from '../../documents/DocumentTypes'; @@ -147,16 +147,13 @@ export class CollectionView extends Touchable { - // // const dataDoc = d[DataSym]; - // for (const [key, value] of Object.entries(this.props.Document[AclSym])) { - // // key.substring(4).replace("_", ".") !== Doc.CurrentUserEmail && distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); - // distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); - // } - // }); - // } + if (this.props.Document[AclSym]) { + added.forEach(d => { + for (const [key, value] of Object.entries(this.props.Document[AclSym])) { + distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); + } + }); + } if (effectiveAcl === AclAddonly) { added.map(doc => Doc.AddDocToList(targetDataDoc, this.props.fieldKey, doc)); -- cgit v1.2.3-70-g09d2 From 13c85ceb6637e5dbecbc1a9be3dd5915b3e4b95d Mon Sep 17 00:00:00 2001 From: usodhi <61431818+usodhi@users.noreply.github.com> Date: Tue, 4 Aug 2020 17:32:13 +0530 Subject: owner's acl set when sharing menu opened --- src/client/util/SharingManager.tsx | 7 +++++-- src/client/views/DocComponent.tsx | 11 +++++------ 2 files changed, 10 insertions(+), 8 deletions(-) (limited to 'src/client/views') diff --git a/src/client/util/SharingManager.tsx b/src/client/util/SharingManager.tsx index adfc8c2bf..97f94692d 100644 --- a/src/client/util/SharingManager.tsx +++ b/src/client/util/SharingManager.tsx @@ -88,7 +88,7 @@ export default class SharingManager extends React.Component<{}> { this.isOpen = true; this.permissions = SharingPermissions.Edit; }); - + this.targetDoc!.author === Doc.CurrentUserEmail && !this.targetDoc![`ACL-${Doc.CurrentUserEmail.replace(".", "_")}`] && distributeAcls(`ACL-${Doc.CurrentUserEmail.replace(".", "_")}`, SharingPermissions.Admin, this.targetDoc!); } public close = action(() => { @@ -221,7 +221,10 @@ export default class SharingManager extends React.Component<{}> { const key = user.email.replace('.', '_'); const ACL = `ACL-${key}`; - target.author === Doc.CurrentUserEmail && distributeAcls(ACL, permission as SharingPermissions, target); + + if (target.author === Doc.CurrentUserEmail) { + distributeAcls(ACL, permission as SharingPermissions, target); + } if (permission !== SharingPermissions.None) { Doc.IndexOf(target, DocListCast(notificationDoc[storage])) === -1 && Doc.AddDocToList(notificationDoc, storage, target); diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx index 34144d3eb..831c246d1 100644 --- a/src/client/views/DocComponent.tsx +++ b/src/client/views/DocComponent.tsx @@ -1,4 +1,4 @@ -import { Doc, Opt, DataSym, AclReadonly, AclAddonly, AclPrivate, AclEdit, AclSym, DocListCastAsync, DocListCast } from '../../fields/Doc'; +import { Doc, Opt, DataSym, AclReadonly, AclAddonly, AclPrivate, AclEdit, AclSym, DocListCastAsync, DocListCast, AclAdmin } from '../../fields/Doc'; import { Touchable } from './Touchable'; import { computed, action, observable } from 'mobx'; import { Cast, BoolCast, ScriptCast } from '../../fields/Types'; @@ -7,7 +7,7 @@ import { InteractionUtils } from '../util/InteractionUtils'; import { List } from '../../fields/List'; import { DateField } from '../../fields/DateField'; import { ScriptField } from '../../fields/ScriptField'; -import { GetEffectiveAcl, SharingPermissions } from '../../fields/util'; +import { GetEffectiveAcl, SharingPermissions, distributeAcls } from '../../fields/util'; /// DocComponent returns a generic React base class used by views that don't have 'fieldKey' props (e.g.,CollectionFreeFormDocumentView, DocumentView) @@ -96,7 +96,8 @@ export function ViewBoxAnnotatableComponent

ScriptCast((this.layoutDoc as any).lookupField)?.script.run({ self: this.layoutDoc, data: this.rootDoc, field: field }).result; @@ -156,10 +157,8 @@ export function ViewBoxAnnotatableComponent

{ - const dataDoc = d[DataSym]; - dataDoc[AclSym] = d[AclSym] = this.props.Document[AclSym]; for (const [key, value] of Object.entries(this.props.Document[AclSym])) { - dataDoc[key] = d[key] = this.AclMap.get(value); + distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); } }); } -- cgit v1.2.3-70-g09d2 From 2b8fd3bbc922fdb9b82ed5cabe6308b37077fb9e Mon Sep 17 00:00:00 2001 From: usodhi <61431818+usodhi@users.noreply.github.com> Date: Wed, 5 Aug 2020 13:23:47 +0530 Subject: comments and minor changes --- src/client/util/CurrentUserUtils.ts | 2 +- src/client/views/MainView.tsx | 2 +- .../collections/collectionFreeForm/PropertiesView.tsx | 19 +++++++++++++++++++ src/client/views/nodes/DocumentView.tsx | 4 ++-- 4 files changed, 23 insertions(+), 4 deletions(-) (limited to 'src/client/views') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 8023df8b4..aceab9dd2 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -824,7 +824,7 @@ export class CurrentUserUtils { // Right sidebar is where mobile uploads are contained static setupRightSidebar(doc: Doc) { if (doc["sidebar-sharing"] === undefined) { - doc["sidebar-sharing"] = new PrefetchProxy(Docs.Create.StackingDocument([], { title: "Mobile Uploads" })); + doc["sidebar-sharing"] = new PrefetchProxy(Docs.Create.StackingDocument([], { title: "Shared Documents", childDropAction: "alias" })); } } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 66545ea1f..61520bc36 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -408,7 +408,7 @@ export class MainView extends React.Component { } sidebarScreenToLocal = () => new Transform(0, (CollectionMenu.Instance.Pinned ? -35 : 0), 1); //sidebarScreenToLocal = () => new Transform(0, (RichTextMenu.Instance.Pinned ? -35 : 0) + (CollectionMenu.Instance.Pinned ? -35 : 0), 1); - mainContainerXf = () => this.sidebarScreenToLocal().translate(0, -this._buttonBarHeight); + mainContainerXf = () => this.sidebarScreenToLocal().translate(-55, 0); @computed get closePosition() { return 55 + this.flyoutWidth; } @computed get flyout() { diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index f5e0cd077..31962837c 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -266,11 +266,17 @@ export class PropertiesView extends React.Component { } } + /** + * Handles the changing of a user's permissions from the permissions panel. + */ @undoBatch changePermissions = (e: any, user: string) => { SharingManager.Instance.shareFromPropertiesSidebar(user, e.currentTarget.value as SharingPermissions, this.selectedDoc!); } + /** + * @returns the options for the permissions dropdown. + */ getPermissionsSelect(user: string) { return ; } + /** + * @returns the notification icon. On clicking, it should notify someone of a document been shared with them. + */ @computed get notifyIcon() { return

Notify with message
}>
@@ -291,6 +300,9 @@ export class PropertiesView extends React.Component { ; } + /** + * ... next to the owner that opens the main SharingManager interface on click. + */ @computed get expansionIcon() { return
{"Show more permissions"}
}>
{ @@ -303,6 +315,9 @@ export class PropertiesView extends React.Component { ; } + /** + * @returns a row of the permissions panel + */ sharingItem(name: string, effectiveAcl: symbol, permission?: string) { return
{name}
@@ -314,6 +329,9 @@ export class PropertiesView extends React.Component {
; } + /** + * @returns the sharing and permissiosn panel. + */ @computed get sharingTable() { const AclMap = new Map([ [AclPrivate, SharingPermissions.None], @@ -333,6 +351,7 @@ export class PropertiesView extends React.Component { } } + // shifts the current user and the owner to the top of the doc. tableEntries.unshift(this.sharingItem("Me", effectiveAcl, Doc.CurrentUserEmail === this.selectedDoc!.author ? "Owner" : StrCast(this.selectedDoc![`ACL-${Doc.CurrentUserEmail.replace(".", "_")}`]))); if (Doc.CurrentUserEmail !== this.selectedDoc!.author) tableEntries.unshift(this.sharingItem(StrCast(this.selectedDoc!.author), effectiveAcl, "Owner")); diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 81738f234..60075d5cf 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -179,7 +179,8 @@ export class DocumentView extends DocComponent(Docu RadialMenu.Instance.openMenu(pt.pageX - 15, pt.pageY - 15); // RadialMenu.Instance.addItem({ description: "Open Fields", event: () => this.props.addDocTab(Docs.Create.KVPDocument(this.props.Document, { _width: 300, _height: 300 }), "onRight"), icon: "map-pin", selected: -1 }); - RadialMenu.Instance.addItem({ description: "Delete", event: () => { this.props.ContainingCollectionView?.removeDocument(this.props.Document), RadialMenu.Instance.closeMenu(); }, icon: "external-link-square-alt", selected: -1 }); + const effectiveAcl = GetEffectiveAcl(this.props.Document); + (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) && RadialMenu.Instance.addItem({ description: "Delete", event: () => { this.props.ContainingCollectionView?.removeDocument(this.props.Document), RadialMenu.Instance.closeMenu(); }, icon: "external-link-square-alt", selected: -1 }); // RadialMenu.Instance.addItem({ description: "Open in a new tab", event: () => this.props.addDocTab(this.props.Document, "onRight"), icon: "trash", selected: -1 }); RadialMenu.Instance.addItem({ description: "Pin", event: () => this.props.pinToPres(this.props.Document), icon: "map-pin", selected: -1 }); RadialMenu.Instance.addItem({ description: "Open", event: () => MobileInterface.Instance.handleClick(this.props.Document), icon: "trash", selected: -1 }); @@ -762,7 +763,6 @@ export class DocumentView extends DocComponent(Docu moreItems.push({ description: "Copy ID", event: () => Utils.CopyText(Utils.prepend("/doc/" + this.props.Document[Id])), icon: "fingerprint" }); Doc.AreProtosEqual(this.props.Document, Doc.UserDoc()) && moreItems.push({ description: "Toggle Always Show Link End", event: () => Doc.UserDoc()["documentLinksButton-hideEnd"] = !Doc.UserDoc()["documentLinksButton-hideEnd"], icon: "eye" }); } - //GetEffectiveAcl(this.props.Document) === AclEdit && moreItems.push({ description: "Delete", event: this.deleteClicked, icon: "trash" }); const effectiveAcl = GetEffectiveAcl(this.props.Document); (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) && moreItems.push({ description: "Delete", event: this.deleteClicked, icon: "trash" }); -- cgit v1.2.3-70-g09d2 From 6d788ba96d611d580605b87d0e3658f61c57f46e Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Thu, 6 Aug 2020 14:36:48 +0800 Subject: small ui updates for uniformity --- src/client/views/PropertiesButtons.tsx | 9 +++++++-- src/client/views/collections/CollectionDockingView.tsx | 3 +-- 2 files changed, 8 insertions(+), 4 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 29afd447f..642476bc3 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -245,7 +245,7 @@ export class PropertiesButtons extends React.Component<{}, {}> { } return !targetDoc ? (null) :
{"Pin with this view"}
}>
{ if (targetDoc) { DockedFrameRenderer.PinDoc(targetDoc, false); @@ -259,8 +259,13 @@ export class PropertiesButtons extends React.Component<{}, {}> { activeDoc.presPinViewScale = scale; } }}> -
V
+
V
+
{"Pin with view"}
; } diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index 6d4a7f311..af701bfdd 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -873,13 +873,12 @@ export class DockedFrameRenderer extends React.Component { return
-
+
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}>
PresBox.Instance.startOrResetPres(PresBox.Instance.itemIndex)}>
Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length}
- {/*
{this.getCurrentFrame}
*/}
EXIT
-- cgit v1.2.3-70-g09d2 From 0bd77219c2f470f5b2a8680cf9712f5947f22bd1 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Thu, 6 Aug 2020 15:13:43 +0800 Subject: pin with view button UI and other small changes --- src/client/views/PropertiesButtons.tsx | 46 ++++++++++++++++------------------ src/client/views/nodes/PresBox.scss | 10 +++++--- src/client/views/nodes/PresBox.tsx | 7 +++--- 3 files changed, 33 insertions(+), 30 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 642476bc3..002abc5a3 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -237,36 +237,34 @@ export class PropertiesButtons extends React.Component<{}, {}> { @computed get pinWithViewButton() { const targetDoc = this.selectedDoc; - const isPinned = targetDoc && Doc.isDocPinned(targetDoc); if (targetDoc) { const x = targetDoc._panX; const y = targetDoc._panY; const scale = targetDoc._viewScale; } return !targetDoc ? (null) :
{"Pin with this view"}
}> -
{ - if (targetDoc) { - DockedFrameRenderer.PinDoc(targetDoc, false); - const activeDoc = PresBox.Instance.childDocs[PresBox.Instance.childDocs.length - 1]; - const x = targetDoc._panX; - const y = targetDoc._panY; - const scale = targetDoc._viewScale; - activeDoc.presPinView = true; - activeDoc.presPinViewX = x; - activeDoc.presPinViewY = y; - activeDoc.presPinViewScale = scale; - } - }}> - -
V
-
{"Pin with view"}
-
; + <> +
{ + if (targetDoc) { + DockedFrameRenderer.PinDoc(targetDoc, false); + const activeDoc = PresBox.Instance.childDocs[PresBox.Instance.childDocs.length - 1]; + const x = targetDoc._panX; + const y = targetDoc._panY; + const scale = targetDoc._viewScale; + activeDoc.presPinView = true; + activeDoc.presPinViewX = x; + activeDoc.presPinViewY = y; + activeDoc.presPinViewScale = scale; + } + }}> + +
V
+
+
{"View"}
+ + ; } diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss index 16821f5bc..8ce71935c 100644 --- a/src/client/views/nodes/PresBox.scss +++ b/src/client/views/nodes/PresBox.scss @@ -30,7 +30,7 @@ transform: translate(8px, -5px); box-shadow: 1px 1px 4px 4px rgba(0, 0, 0, 0.25); z-index: 1000; - width: 315; + width: calc(100% - 50px); height: max-content; justify-self: center; letter-spacing: normal; @@ -583,6 +583,8 @@ align-items: center; justify-content: center; border-radius: 4px; + padding-left: 7px; + padding-right: 7px; border-bottom-right-radius: 0; border-top-right-radius: 0; } @@ -597,6 +599,8 @@ align-items: center; justify-content: center; border-radius: 4px; + padding-left: 7px; + padding-right: 7px; border-bottom-left-radius: 0; border-top-left-radius: 0; } @@ -722,6 +726,7 @@ position: relative; width: 100%; background: gray; + min-height: 35px; padding-top: 5px; padding-bottom: 5px; display: grid; @@ -782,8 +787,7 @@ .presBox-button.present { display: flex; - min-width: 100px; - width: 100px; + width: max-content; position: absolute; right: 10px; diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index ccf1fb8e3..c3b920b26 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -1064,10 +1064,10 @@ export class PresBox extends ViewBoxBaseComponent
Viewfinder
{/*
Snapshot
*/}
-
+ {/*
Text progressivize
Edit
-
+
*/}
Scroll progressivize
Edit
@@ -1657,6 +1657,7 @@ export class PresBox extends ViewBoxBaseComponent return
-
this.layoutDoc.presStatus = "manual"}>   Present
+
this.layoutDoc.presStatus = "manual"}>
200 ? "inline-flex" : "none" }}>  Present
{ e.stopPropagation; this.togglePresent(); }}> {this.presentDropdown} -- cgit v1.2.3-70-g09d2 From 557bcff59aaec470b045a01600b0c2a6e785c730 Mon Sep 17 00:00:00 2001 From: geireann <60007097+geireann@users.noreply.github.com> Date: Thu, 6 Aug 2020 18:05:24 +0800 Subject: ui changes and commenting code also removed _viewTransition and backgroundColor... --- src/client/util/DocumentManager.ts | 6 +- src/client/views/.DS_Store | Bin 6148 -> 6148 bytes src/client/views/PropertiesButtons.tsx | 4 +- src/client/views/nodes/PresBox.scss | 47 +- src/client/views/nodes/PresBox.tsx | 485 +++++++++++---------- .../views/presentationview/PresElementBox.scss | 8 +- .../views/presentationview/PresElementBox.tsx | 10 +- 7 files changed, 292 insertions(+), 268 deletions(-) (limited to 'src/client/views') diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index d18eac374..523dbfca0 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -127,10 +127,6 @@ export class DocumentManager { CollectionDockingView.AddRightSplit(doc); finished?.(); } - // static openInPlace = (doc: Doc, finished?: () => void) => { - // CollectionDockingView.AddTab(doc); - // finished?.(); - // } public jumpToDocument = async ( targetDoc: Doc, // document to display willZoom: boolean, // whether to zoom doc to take up most of screen @@ -180,7 +176,7 @@ export class DocumentManager { const targetDocContextView = getFirstDocView(targetDocContext); targetDocContext._scrollY = 0; // this will force PDFs to activate and load their annotations / allow scrolling if (targetDocContextView) { // we found a context view and aren't forced to create a new one ... focus on the context first.. - targetDocContext._viewTransition = "transform 10000ms"; + targetDocContext._viewTransition = "transform 500ms"; targetDocContextView.props.focus(targetDocContextView.props.Document, willZoom); // now find the target document within the context diff --git a/src/client/views/.DS_Store b/src/client/views/.DS_Store index 3ce88292c..7a8c419ee 100644 Binary files a/src/client/views/.DS_Store and b/src/client/views/.DS_Store differ diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 002abc5a3..3392371de 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -242,7 +242,7 @@ export class PropertiesButtons extends React.Component<{}, {}> { const y = targetDoc._panY; const scale = targetDoc._viewScale; } - return !targetDoc ? (null) :
{"Pin with this view"}
}> + return !targetDoc ? (null) :
{"Pin with this view"}
} placement="top"> <>
{ activeDoc.presPinViewScale = scale; } }}> - +
V
{"View"}
diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss index 8ce71935c..d5389da35 100644 --- a/src/client/views/nodes/PresBox.scss +++ b/src/client/views/nodes/PresBox.scss @@ -1,3 +1,7 @@ +$light-blue: #AEDDF8; +$dark-blue: #5B9FDD; +$light-background: #ececec; + .presBox-cont { position: absolute; display: block; @@ -20,10 +24,6 @@ margin-top: 3px; } - .presBox-toolbar { - display: none; - } - .presBox-toolbar-dropdown { border-radius: 5px; background-color: white; @@ -40,7 +40,7 @@ font-size: 13; } - .presBox-toolbar.active { + .presBox-toolbar { position: relative; display: inline-flex; align-items: center; @@ -59,7 +59,7 @@ } .toolbar-button.active { - color: #AEDDF8; + color: $light-blue; } .toolbar-transitionButtons { @@ -85,7 +85,6 @@ display: flex; width: max-content; height: 25px; - /* background-color: pink; */ justify-content: center; transform: rotate(90deg); align-items: center; @@ -120,7 +119,7 @@ .dropdown.active { transform: rotate(180deg); - color: #AEDDF8; + color: $light-blue; opacity: 0.8; } @@ -128,10 +127,7 @@ position: relative; display: inline; font-family: Roboto; - /* background-color: white; */ color: black; - width: 100%; - height: max-content; z-index: 100; transition: 0.7s; @@ -157,7 +153,6 @@ margin-left: 5px; margin-top: 5px; margin-bottom: 5px; - /* border-radius: 5px; */ margin-right: 5px; width: max-content; justify-content: center; @@ -176,7 +171,7 @@ // margin-top: 5px; // width: 100%; // max-width: 200px; - + // } // .toolbar-slider:focus { @@ -235,20 +230,20 @@ .toolbar-slider:focus { outline: none; } - + .toolbar-slider::-webkit-slider-runnable-track { - height: 10px; - -webkit-appearance: none; - margin-top: -1px; + height: 10px; + -webkit-appearance: none; + margin-top: -1px; } - + .toolbar-slider::-webkit-slider-thumb { - width: 10px; - -webkit-appearance: none; - height: 10px; - cursor: ew-resize; - background: #5b9ddd; - box-shadow: -100vw 0 0 100vw #aedef8; + width: 10px; + -webkit-appearance: none; + height: 10px; + cursor: ew-resize; + background: #5b9ddd; + box-shadow: -100vw 0 0 100vw #aedef8; } } @@ -751,7 +746,7 @@ min-width: 150px; } - + select { background: #323232; @@ -796,7 +791,7 @@ } } - + .miniPresOverlay { background-color: #323232; color: white; diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index c3b920b26..5d4cde382 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -20,17 +20,10 @@ import { Docs, DocUtils } from "../../documents/Documents"; import { PrefetchProxy } from "../../../fields/Proxy"; import { ScriptField } from "../../../fields/ScriptField"; import { Scripting } from "../../util/Scripting"; -import { InkingStroke } from "../InkingStroke"; -import { HighlightSpanKind } from "typescript"; -import { SearchUtil } from "../../util/SearchUtil"; import { CollectionFreeFormDocumentView } from "./CollectionFreeFormDocumentView"; -import { child } from "serializr"; import { List } from "../../../fields/List"; import { Tooltip } from "@material-ui/core"; import { CollectionFreeFormViewChrome } from "../collections/CollectionMenu"; -import { conformsTo } from "lodash"; -import { translate } from "googleapis/build/src/apis/translate"; -import { DragManager, dropActionType } from "../../util/DragManager"; import { actionAsync } from "mobx-utils"; import { SelectionManager } from "../../util/SelectionManager"; import { AudioBox } from "./AudioBox"; @@ -41,9 +34,26 @@ const PresBoxDocument = makeInterface(documentSchema); @observer export class PresBox extends ViewBoxBaseComponent(PresBoxDocument) { public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresBox, fieldKey); } - private treedropDisposer?: DragManager.DragDropDisposer; static Instance: PresBox; + @observable _isChildActive = false; + @observable _moveOnFromAudio: boolean = false; + @observable _presTimer!: NodeJS.Timeout; + + @observable _selectedArray: Doc[] = []; + @observable _sortedSelectedArray: Doc[] = []; + @observable _eleArray: HTMLElement[] = []; + @observable _dragArray: HTMLElement[] = []; + + @observable private transitionTools: boolean = false; + @observable private newDocumentTools: boolean = false; + @observable private progressivizeTools: boolean = false; + @observable private moreInfoTools: boolean = false; + @observable private playTools: boolean = false; + @observable private presentTools: boolean = false; + @observable private pathBoolean: boolean = false; + @observable private expandBoolean: boolean = false; + @computed get childDocs() { return DocListCast(this.dataDoc[this.fieldKey]); } @computed get itemIndex() { return NumCast(this.rootDoc._itemIndex); } @computed get presElement() { return Cast(Doc.UserDoc().presElement, Doc, null); } @@ -65,18 +75,12 @@ export class PresBox extends ViewBoxBaseComponent } - componentDidMount() { this.rootDoc.presBox = this.rootDoc; this.rootDoc._forceRenderEngine = "timeline"; this.rootDoc._replacedChrome = "replaced"; this.layoutDoc.presStatus = "edit"; this.layoutDoc._gridGap = 5; - // document.addEventListener("keydown", this.keyEvents, false); - } - - componentWillUnmount() { - this.treedropDisposer?.(); } onPointerOver = () => { @@ -91,8 +95,9 @@ export class PresBox extends ViewBoxBaseComponent Doc.UserDoc().activePresentation = this.rootDoc; } - @observable _moveOnFromAudio: boolean = false; - + /** + * Called when the user moves to the next slide in the presentation trail. + */ @undoBatch @action next = () => { @@ -137,6 +142,11 @@ export class PresBox extends ViewBoxBaseComponent } } + /** + * Called when the user moves back + * Design choice: If there are frames within the presentation, moving back will not + * got back through the frames but instead directly to the next point in the presentation. + */ @undoBatch @action back = () => { @@ -149,6 +159,93 @@ export class PresBox extends ViewBoxBaseComponent } } + //The function that is called when a document is clicked or reached through next or back. + //it'll also execute the necessary actions if presentation is playing. + public gotoDocument = action((index: number, fromDoc: number) => { + this.updateCurrentPresentation(); + Doc.UnBrushAllDocs(); + if (index >= 0 && index < this.childDocs.length) { + this.rootDoc._itemIndex = index; + const presTargetDoc = Cast(this.childDocs[this.itemIndex].presentationTargetDoc, Doc, null); + if (presTargetDoc?.lastFrame !== undefined) { + presTargetDoc.currentFrame = 0; + } + this.navigateToElement(this.childDocs[index]); //Handles movement to element + this._selectedArray = [this.childDocs[index]]; //Update selected array + this.onHideDocument(); //Handles hide after/before + } + }); + + /** + * This method makes sure that cursor navigates to the element that + * has the option open and last in the group. + * Design choice: If the next document is not in presCollection or + * presCollection itself then if there is a presCollection it will add + * a new tab. If presCollection is undefined it will open the document + * on the right. + */ + navigateToElement = async (curDoc: Doc) => { + const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); + const targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); + const srcContext = await DocCastAsync(targetDoc.context); + const presCollection = Cast(this.layoutDoc.presCollection, Doc, null); + const collectionDocView = presCollection ? await DocumentManager.Instance.getDocumentView(presCollection) : undefined; + this.turnOffEdit(); + + if (this.itemIndex >= 0) { + if (targetDoc) { + if (srcContext) this.layoutDoc.presCollection = srcContext; + } else if (targetDoc) this.layoutDoc.presCollection = targetDoc; + } + if (collectionDocView) { + if (srcContext && srcContext !== presCollection) { + // Case 1: new srcContext inside of current collection so add a new tab to the current pres collection + collectionDocView.props.addDocTab(srcContext, "inPlace"); + } + } + this.updateCurrentPresentation(); + const docToJump = curDoc; + const willZoom = false; + + //docToJump stayed same meaning, it was not in the group or was the last element in the group + if (targetDoc.zoomProgressivize && this.rootDoc.presStatus !== 'edit') { + this.zoomProgressivizeNext(targetDoc); + } else if (docToJump === curDoc) { + //checking if curDoc has navigation open + if (curDoc.presNavButton && targetDoc) { + await DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined, srcContext); + } else if (curDoc.presZoomButton && targetDoc) { + //awaiting jump so that new scale can be found, since jumping is async + await DocumentManager.Instance.jumpToDocument(targetDoc, true, undefined, srcContext); + } + } else { + //awaiting jump so that new scale can be found, since jumping is async + targetDoc && await DocumentManager.Instance.jumpToDocument(targetDoc, willZoom, undefined, srcContext); + } + // After navigating to the document, if it is added as a presPinView then it will + // adjust the pan and scale to that of the pinView when it was added. + // TODO: Add option to remove presPinView + if (activeItem.presPinView) { + targetDoc._panX = activeItem.presPinViewX; + targetDoc._panY = activeItem.presPinViewY; + targetDoc._viewScale = activeItem.presPinViewScale; + } + // If openDocument is selected then it should open the document for the user + if (collectionDocView && activeItem.openDocument) { + collectionDocView.props.addDocTab(activeItem, "inPlace"); + } + // If website and has presWebsite data associated then on click it should + // go back to that specific website + // TODO: Add progressivize for navigating web (storing websites for given frames) + if (targetDoc.presWebsiteData) { + targetDoc.data = targetDoc.presWebsiteData; + } + } + + /** + * Uses the viewfinder to progressivize through the different views of a single collection. + * @param presTargetDoc: document for which internal zoom is used + */ zoomProgressivizeNext = (presTargetDoc: Doc) => { const srcContext = Cast(presTargetDoc.context, Doc, null); const docView = DocumentManager.Instance.getDocumentView(presTargetDoc); @@ -190,6 +287,10 @@ export class PresBox extends ViewBoxBaseComponent } + /** + * For 'Hide Before' and 'Hide After' buttons making sure that + * they are hidden each time the presentation is updated. + */ @action onHideDocument = () => { this.childDocs.forEach((doc, index) => { @@ -213,97 +314,11 @@ export class PresBox extends ViewBoxBaseComponent }); } - /** - * This method makes sure that cursor navigates to the element that - * has the option open and last in the group. If not in the group, and it has - * the option open, navigates to that element. - */ - navigateToElement = async (curDoc: Doc) => { - const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); - const targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); - const srcContext = await DocCastAsync(targetDoc.context); - const presCollection = Cast(this.layoutDoc.presCollection, Doc, null); - const collectionDocView = presCollection ? await DocumentManager.Instance.getDocumentView(presCollection) : undefined; - this.turnOffEdit(); - - if (this.itemIndex >= 0) { - if (targetDoc) { - if (srcContext) this.layoutDoc.presCollection = srcContext; - } else if (targetDoc) this.layoutDoc.presCollection = targetDoc; - } - if (collectionDocView) { - if (srcContext && srcContext !== presCollection) { - // Case 1: new srcContext inside of current collection so add a new tab to the current pres collection - collectionDocView.props.addDocTab(srcContext, "inPlace"); - } - } - // else if (srcContext) { - // console.log("Case 2: srcContext - not open and collection containing this document exists, so open collection that contains it and then await zooming in on document"); - // this.props.addDocTab(srcContext, "onRight"); - // } else if (!srcContext) { - // console.log("Case 3: !srcContext - no collection containing this document, therefore open document itself on right"); - // this.props.addDocTab(targetDoc, "onRight"); - // } - this.updateCurrentPresentation(); - const docToJump = curDoc; - const willZoom = false; - - //docToJump stayed same meaning, it was not in the group or was the last element in the group - if (targetDoc.zoomProgressivize && this.rootDoc.presStatus !== 'edit') { - this.zoomProgressivizeNext(targetDoc); - } else if (docToJump === curDoc) { - //checking if curDoc has navigation open - if (curDoc.presNavButton && targetDoc) { - await DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined, srcContext); - } else if (curDoc.presZoomButton && targetDoc) { - //awaiting jump so that new scale can be found, since jumping is async - await DocumentManager.Instance.jumpToDocument(targetDoc, true, undefined, srcContext); - } - } else { - //awaiting jump so that new scale can be found, since jumping is async - targetDoc && await DocumentManager.Instance.jumpToDocument(targetDoc, willZoom, undefined, srcContext); - } - if (activeItem.presPinView) { - targetDoc._panX = activeItem.presPinViewX; - targetDoc._panY = activeItem.presPinViewY; - targetDoc._viewScale = activeItem.presPinViewScale; - } - if (collectionDocView && activeItem.openDocument) { - collectionDocView.props.addDocTab(activeItem, "inPlace"); - } - if (targetDoc.presWebsiteData) { - targetDoc.data = targetDoc.presWebsiteData; - } - } - - //The function that is called when a document is clicked or reached through next or back. - //it'll also execute the necessary actions if presentation is playing. - public gotoDocument = action((index: number, fromDoc: number) => { - this.updateCurrentPresentation(); - Doc.UnBrushAllDocs(); - if (index >= 0 && index < this.childDocs.length) { - this.rootDoc._itemIndex = index; - const presTargetDoc = Cast(this.childDocs[this.itemIndex].presentationTargetDoc, Doc, null); - if (presTargetDoc?.lastFrame !== undefined) { - presTargetDoc.currentFrame = 0; - } - this.navigateToElement(this.childDocs[index]); - this._selectedArray = [this.childDocs[index]]; - // this.hideIfNotPresented(index); - // this.showAfterPresented(index); - // this.hideDocumentInPres(); - this.onHideDocument(); - // this.onHideAfterPresClick(); - } - }); - - - @observable _presTimer!: NodeJS.Timeout; - //The function that starts or resets presentaton functionally, depending on status flag. + //The function that starts or resets presentaton functionally, depending on presStatus of the layoutDoc @undoBatch @action - startOrResetPres = (startSlide: number) => { + startPres = (startSlide: number) => { this.updateCurrentPresentation(); const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); @@ -326,15 +341,20 @@ export class PresBox extends ViewBoxBaseComponent //The function that resets the presentation by removing every action done by it. It also //stops the presentaton. + // TODO: Ensure resetPresentation is called when the presentation is closed resetPresentation = () => { this.updateCurrentPresentation(); - this.childDocs.forEach(doc => (doc.presentationTargetDoc as Doc).opacity = 1); this.rootDoc._itemIndex = 0; - // this.layoutDoc.presStatus = false; } - //The function that starts the presentation, also checking if actions should be applied - //directly at start. + @action togglePath = () => this.pathBoolean = !this.pathBoolean; + @action toggleExpand = () => this.expandBoolean = !this.expandBoolean; + + /** + * The function that starts the presentation at the given index, also checking if actions should be applied + * directly at start. + * @param startIndex: index that the presentation will start at + */ startPresentation = (startIndex: number) => { this.updateCurrentPresentation(); this.childDocs.map(doc => { @@ -348,6 +368,10 @@ export class PresBox extends ViewBoxBaseComponent }); } + /** + * The method called to open the presentation as a minimized view + * TODO: Look at old updateMinimize and compare... + */ updateMinimize = () => { const srcContext = Cast(this.rootDoc.presCollection, Doc, null); this.turnOffEdit(); @@ -364,39 +388,52 @@ export class PresBox extends ViewBoxBaseComponent } } + /** + * Called when the user changes the view type + * Either 'List' (stacking) or 'Slides' (carousel) + */ @undoBatch viewChanged = action((e: React.ChangeEvent) => { //@ts-ignore const viewType = e.target.selectedOptions[0].value as CollectionViewType; - viewType === CollectionViewType.Stacking && (this.rootDoc._pivotField = undefined); // pivot field may be set by the user in timeline view (or some other way) -- need to reset it here + // pivot field may be set by the user in timeline view (or some other way) -- need to reset it here + viewType === CollectionViewType.Stacking && (this.rootDoc._pivotField = undefined); this.rootDoc._viewType = viewType; if (viewType === CollectionViewType.Stacking) this.layoutDoc._gridGap = 5; }); + /** + * When the movement dropdown is changes + */ @undoBatch movementChanged = action((movement: string) => { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); - if (movement === 'zoom') { - activeItem.presZoomButton = !activeItem.presZoomButton; - if (activeItem.presZoomButton) activeItem.presMovement = 'Zoom'; - else activeItem.presMovement = 'None'; - activeItem.presNavButton = false; - } else if (movement === 'nav') { - activeItem.presZoomButton = false; - activeItem.presNavButton = !activeItem.presNavButton; - if (activeItem.presNavButton) activeItem.presMovement = 'Pan'; - else activeItem.presMovement = 'None'; - } else if (movement === 'switch') { - targetDoc.presTransition = 0; - activeItem.presSwitchButton = !activeItem.presSwitchButton; - if (activeItem.presSwitchButton) activeItem.presMovement = 'Jump cut'; - else activeItem.presMovement = 'None'; - } else { - activeItem.presMovement = 'None'; - activeItem.presZoomButton = false; - activeItem.presNavButton = false; - activeItem.presSwitchButton = false; + switch (movement) { + case 'zoom': //Pan and zoom + activeItem.presZoomButton = !activeItem.presZoomButton; + if (activeItem.presZoomButton) activeItem.presMovement = 'Zoom'; + else activeItem.presMovement = 'None'; + activeItem.presNavButton = false; + break; + case 'pan': //Pan + activeItem.presZoomButton = false; + activeItem.presNavButton = !activeItem.presNavButton; + if (activeItem.presNavButton) activeItem.presMovement = 'Pan'; + else activeItem.presMovement = 'None'; + break; + case 'jump': //Jump Cut + targetDoc.presTransition = 0; + activeItem.presSwitchButton = !activeItem.presSwitchButton; + if (activeItem.presSwitchButton) activeItem.presMovement = 'Jump cut'; + else activeItem.presMovement = 'None'; + break; + case 'none': default: + activeItem.presMovement = 'None'; + activeItem.presZoomButton = false; + activeItem.presNavButton = false; + activeItem.presSwitchButton = false; + break; } }); @@ -421,13 +458,9 @@ export class PresBox extends ViewBoxBaseComponent active = (outsideReaction?: boolean) => ((Doc.GetSelectedTool() === InkTool.None && !this.layoutDoc.isBackground) && (this.layoutDoc.forceActive || this.props.isSelected(outsideReaction) || this._isChildActive || this.props.renderDepth === 0) ? true : false) - // KEYS - @observable _selectedArray: Doc[] = []; - @observable _sortedSelectedArray: Doc[] = []; - @observable _eleArray: HTMLElement[] = []; - @observable _dragArray: HTMLElement[] = []; - - //TODO: Update to radix / quick sort + /** + * For sorting the array so that the order is maintained when it is dropped. + */ @action sortArray = (): Doc[] => { const sort: Doc[] = this._selectedArray; @@ -439,6 +472,9 @@ export class PresBox extends ViewBoxBaseComponent return sort; } + /** + * Method to get the list of selected items in the order in which they have been selected + */ @computed get listOfSelected() { const list = this._selectedArray.map((doc: Doc, index: any) => { const activeItem = Cast(doc, Doc, null); @@ -478,6 +514,7 @@ export class PresBox extends ViewBoxBaseComponent } } + // Key events when the minimized player is active @action minimizeEvents = (e: KeyboardEvent) => { e.stopPropagation(); @@ -491,7 +528,7 @@ export class PresBox extends ViewBoxBaseComponent } } - //Esc click + // Key for when the presentaiton is active (according to Selection Manager) @action keyEvents = (e: KeyboardEvent) => { e.stopPropagation(); @@ -507,7 +544,7 @@ export class PresBox extends ViewBoxBaseComponent } if (e.keyCode === 39) { // right (39) / d(68) / down(40) to go to next if (this.layoutDoc.presStatus !== "edit") this.next(); } if (e.keyCode === 32) { // spacebar to 'present' or autoplay - if (this.layoutDoc.presStatus !== "edit") this.startOrResetPres(0); + if (this.layoutDoc.presStatus !== "edit") this.startPres(0); else this.layoutDoc.presStatus = "manual"; } if (e.keyCode === 8) { // delete selected items @@ -519,15 +556,9 @@ export class PresBox extends ViewBoxBaseComponent } } - @observable private transitionTools: boolean = false; - @observable private newDocumentTools: boolean = false; - @observable private progressivizeTools: boolean = false; - @observable private moreInfoTools: boolean = false; - @observable private playTools: boolean = false; - @observable private presentTools: boolean = false; - @observable private pathBoolean: boolean = false; - @observable private expandBoolean: boolean = false; - + /** + * + */ @undoBatch @action viewPaths = async () => { @@ -551,16 +582,19 @@ export class PresBox extends ViewBoxBaseComponent const fit = srcContext?._fitToBox; } + // Adds the index in the pres path graphically @computed get order() { const order: JSX.Element[] = []; this.childDocs.forEach((doc, index) => { const targetDoc = Cast(doc.presentationTargetDoc, Doc, null); const srcContext = Cast(targetDoc.context, Doc, null); + // Case A: Document is contained within the colleciton if (this.rootDoc.presCollection === srcContext) { order.push(
{index + 1}
); + // Case B: Document is not inside of the collection } else { order.push(
@@ -571,6 +605,14 @@ export class PresBox extends ViewBoxBaseComponent return order; } + /** + * Method called for viewing paths which adds a single line with + * points at the center of each document added. + * Design choice: When this is called it sets _fitToBox as true so the + * user can have an overview of all of the documents in the collection. + * (Design needed for when documents in presentation trail are in another + * collection) + */ @computed get paths() { let pathPoints = ""; this.childDocs.forEach((doc, index) => { @@ -601,9 +643,6 @@ export class PresBox extends ViewBoxBaseComponent />); } - @action togglePath = () => this.pathBoolean = !this.pathBoolean; - @action toggleExpand = () => this.expandBoolean = !this.expandBoolean; - /** * The function that is called on click to turn fading document after presented option on/off. * It also makes sure that the option swithches from hide-after to this one, since both @@ -627,13 +666,7 @@ export class PresBox extends ViewBoxBaseComponent } } - // WHAT IS THIS? - @action - dropdownToggle = (menu: string) => { - const dropMenu = document.getElementById('presBox' + menu + 'Dropdown'); - if (dropMenu) dropMenu.style.display === 'none' ? dropMenu.style.display = 'block' : dropMenu.style.display = 'none'; - } - + // Converts seconds to ms and updates presTransition setTransitionTime = (number: String) => { const timeInMS = Number(number) * 1000; const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); @@ -641,6 +674,7 @@ export class PresBox extends ViewBoxBaseComponent if (targetDoc) targetDoc.presTransition = timeInMS; } + // Converts seconds to ms and updates presDuration setDurationTime = (number: String) => { const timeInMS = Number(number) * 1000; const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); @@ -648,6 +682,7 @@ export class PresBox extends ViewBoxBaseComponent if (targetDoc) targetDoc.presDuration = timeInMS; } + @computed get transitionDropdown() { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); @@ -660,17 +695,14 @@ export class PresBox extends ViewBoxBaseComponent
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
Movement -
e.stopPropagation()} - // onClick={() => this.dropdownToggle('Movement')} - > +
e.stopPropagation()}> {activeItem.presMovement}
e.stopPropagation()}>
e.stopPropagation()} onClick={() => this.movementChanged('none')}>None
e.stopPropagation()} onClick={() => this.movementChanged('zoom')}>Pan and Zoom
-
e.stopPropagation()} onClick={() => this.movementChanged('nav')}>Pan
-
e.stopPropagation()} onClick={() => this.movementChanged('switch')}>Jump cut
+
e.stopPropagation()} onClick={() => this.movementChanged('pan')}>Pan
+
e.stopPropagation()} onClick={() => this.movementChanged('jump')}>Jump cut
@@ -783,8 +815,8 @@ export class PresBox extends ViewBoxBaseComponent
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
-
Start automatically
-
Start manually
+
activeItem.playAuto = !activeItem.playAuto}>Play automatically
+
activeItem.playAuto = !activeItem.playAuto}>Play on next
activeItem.openDocument = !activeItem.openDocument}>Open document
@@ -838,12 +870,10 @@ export class PresBox extends ViewBoxBaseComponent
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
Slide Title:

- {/*
*/} { e.stopPropagation(); runInAction(() => this.title = e.target.value); }}> - {/*
*/}
Choose type: @@ -941,40 +971,20 @@ export class PresBox extends ViewBoxBaseComponent return doc; } - // Dropdown that appears for autoplay - @computed get playDropdown() { - return ( -
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}> -
this.startOrResetPres(this.itemIndex)}> - Present from current slide -
-
this.startOrResetPres(0)}> - Present from first slide -
-
- ); - } - // Dropdown that appears when the user wants to begin presenting (either minimize or sidebar view) @computed get presentDropdown() { return (
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}> -
+
{ this.updateMinimize; this.layoutDoc.presStatus = "manual"; this.turnOffEdit(); }))}> Minimize
-
{ this.startOrResetPres(0); this.turnOffEdit(); }}> +
{ this.layoutDoc.presStatus = "manual"; this.turnOffEdit(); }))}> Sidebar view
); } - // For toggling the options when the user wants to select play - @action togglePlay = () => { this.playTools = !this.playTools; }; - - // For toggling the options when the user wants to select play - @action togglePresent = () => { this.presentTools = !this.presentTools; }; - // Case in which the document has keyframes to navigate to next key frame @undoBatch @action @@ -986,10 +996,6 @@ export class PresBox extends ViewBoxBaseComponent CollectionFreeFormDocumentView.setupScroll(tagDoc, 0); CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0); } - // let lastFrame: number = 0; - // childDocs.forEach((doc) => { - // if (NumCast(doc.appearFrame) > lastFrame) lastFrame = NumCast(doc.appearFrame); - // }); CollectionFreeFormDocumentView.updateScrollframe(tagDoc, currentFrame); CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0); tagDoc.currentFrame = Math.max(0, (currentFrame || 0) + 1); @@ -1027,6 +1033,9 @@ export class PresBox extends ViewBoxBaseComponent } } + /** + * Returns the collection type as a string for headers + */ @computed get stringType(): string { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); @@ -1587,7 +1596,7 @@ export class PresBox extends ViewBoxBaseComponent const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); if (activeItem) { return ( - <> +
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}>
@@ -1624,7 +1633,7 @@ export class PresBox extends ViewBoxBaseComponent
*/} - +
); } else { return ( @@ -1648,13 +1657,14 @@ export class PresBox extends ViewBoxBaseComponent } } - render() { - this.childDocs.slice(); // needed to insure that the childDocs are loaded for looking up fields + /** + * Top panel containes: + * viewPicker: The option to choose between List and Slides view for the presentaiton trail + * presentPanel: The button to start the presentation / open minimized view of the presentation + */ + @computed get topPanel() { const mode = StrCast(this.rootDoc._viewType) as CollectionViewType; - // const addDocument = (doc: Doc | Doc[], relativeTo?: Doc, before?: boolean) => { - // return add(doc, relativeTo ? relativeTo : docs[i], before !== undefined ? before : false); - // }; - return
+ return (
-
this.layoutDoc.presStatus = "manual"}>
200 ? "inline-flex" : "none" }}>  Present
-
{ e.stopPropagation; this.togglePresent(); }}> +
this.layoutDoc.presStatus = "manual"}> + +
200 ? "inline-flex" : "none" }}>  Present
+
+
{ e.stopPropagation; this.presentTools = !this.presentTools; }}> {this.presentDropdown}
-
- {/* -
this.startOrResetPres(0)}> -   - -
-
{ e.stopPropagation; this.togglePlay(); }}> - - {this.playDropdown} -
- */} -
-
this.startOrResetPres(this.itemIndex)}>
-
-
-
Slide {this.itemIndex + 1} / {this.childDocs.length}
-
-
this.layoutDoc.presStatus = "edit"}> - -
-
+ {this.playButtons} +
+
+ ); + } + + @computed get playButtons() { + const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); + const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); + // Case 1: There are still other frames and should go through all frames before going to next slide + return (
+ {/* +
this.startPres(0)}> +   + +
+
{ e.stopPropagation; this.togglePlay(); }}> + + {this.playDropdown}
+ */} +
+
this.startPres(this.itemIndex)}>
+
+
+
250 ? "inline-flex" : "none" }}> + Slide {this.itemIndex + 1} / {this.childDocs.length} + {targetDoc ?
= 0 ? "inline-flex" : "none" }}> +
{targetDoc.currentFrame}
+
{targetDoc.lastFrame}
+
: null}
-
{this.toolbar}
+
+
this.layoutDoc.presStatus = "edit"}> + +
+
); + } + + render() { + // needed to insure that the childDocs are loaded for looking up fields + this.childDocs.slice(); + const mode = StrCast(this.rootDoc._viewType) as CollectionViewType; + return
+ {this.topPanel} + {this.toolbar} {this.newDocumentToolbarDropdown}
{mode !== CollectionViewType.Invalid ? diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss index fa70b2a41..3d730d7ac 100644 --- a/src/client/views/presentationview/PresElementBox.scss +++ b/src/client/views/presentationview/PresElementBox.scss @@ -1,3 +1,7 @@ +$light-blue: #AEDDF8; +$dark-blue: #5B9FDD; +$light-background: #ececec; + .presElementBox-item { display: grid; grid-template-columns: max-content max-content max-content; @@ -26,7 +30,7 @@ z-index: -1; width: calc(100% + 200px); height: calc(100% + 8px); - background-color: #AEDDF8; + background-color: $light-blue; } .presElementBox-highlightTop { @@ -69,7 +73,7 @@ .presElementBox-active { color: black; border-radius: 6px; - border: solid 2px #5B9FDD; + border: solid 2px $dark-blue; } .presElementBox-buttons { diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 11ffde9dd..092fd1fd3 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -189,7 +189,7 @@ export class PresElementBox extends ViewBoxBaseComponent "darkgrey"} + backgroundColor={this.props.backgroundColor} rootSelected={returnTrue} addDocument={returnFalse} removeDocument={returnFalse} @@ -254,11 +254,8 @@ export class PresElementBox extends ViewBoxBaseComponent { - // const ele: HTMLElement[] = PresBox.Instance._eleArray.map(doc => doc); const activeItem = this.rootDoc; const dragData = new DragManager.DocumentDragData(PresBox.Instance.sortArray().map(doc => doc)); - // let value = this.getValue(this._heading); - // value = typeof value === "string" ? `"${value}"` : value; const dragItem: HTMLElement[] = []; PresBox.Instance._dragArray.map(ele => { const drag = ele; @@ -337,7 +334,6 @@ export class PresElementBox extends ViewBoxBaseComponent
{"Duration"}
}>
300 ? "block" : "none" }}>{this.duration}
{"Remove from presentation"}
}>
e.stopPropagation()} onClick={e => { this.props.removeDocument?.(this.rootDoc); e.stopPropagation(); @@ -363,6 +359,4 @@ export class PresElementBox extends ViewBoxBaseComponent ); } -} - -// this.layoutDoc.title !== "pres element template" \ No newline at end of file +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 988a16c4b69d1d5062bccf70295aa90c490f9e76 Mon Sep 17 00:00:00 2001 From: usodhi <61431818+usodhi@users.noreply.github.com> Date: Thu, 6 Aug 2020 17:18:34 +0530 Subject: a bunch of commented stuff in propertiesview that is to be used for adding in the sharing panel customisation buttons --- .../collectionFreeForm/PropertiesView.scss | 27 ++++++-- .../collectionFreeForm/PropertiesView.tsx | 80 ++++++++++++++++++---- src/client/views/nodes/DocumentView.tsx | 1 + 3 files changed, 90 insertions(+), 18 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss index 7df56115f..7b5d611f3 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.scss +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss @@ -119,6 +119,19 @@ font-size: 10px; padding: 10px; margin-left: 5px; + + .change-buttons { + display: flex; + + button { + width: 5; + height: 5; + } + + input { + width: 100%; + } + } } } @@ -233,11 +246,15 @@ .propertiesView-sharingTable { + // whatever's commented out - add it back in when adding the buttons + + // border: 1.5px solid black; border: 1px solid black; - padding: 5px; - border-radius: 6px; - /* width: 170px; */ - margin-right: 10px; + padding: 5px; // remove when adding buttons + border-radius: 6px; // remove when adding buttons + margin-right: 10px; // remove when adding buttons + // width: 100%; + // display: inline-table; background-color: #ececec; max-height: 130px; overflow-y: scroll; @@ -245,9 +262,11 @@ .propertiesView-sharingTable-item { display: flex; + // padding: 5px; padding: 3px; align-items: center; border-bottom: 0.5px solid grey; + cursor: pointer; &:hover .propertiesView-sharingTable-item-name { overflow-x: unset; diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 31962837c..81202b126 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -2,13 +2,11 @@ import React = require("react"); import { observer } from "mobx-react"; import "./PropertiesView.scss"; import { observable, action, computed, runInAction } from "mobx"; -import { Doc, Field, DocListCast, WidthSym, HeightSym, AclSym, AclPrivate, AclReadonly, AclAddonly, AclEdit, AclAdmin, Opt } from "../../../../fields/Doc"; -import { DocumentView } from "../../nodes/DocumentView"; +import { Doc, Field, WidthSym, HeightSym, AclSym, AclPrivate, AclReadonly, AclAddonly, AclEdit, AclAdmin, Opt, DocCastAsync } from "../../../../fields/Doc"; import { ComputedField } from "../../../../fields/ScriptField"; import { EditableView } from "../../EditableView"; import { KeyValueBox } from "../../nodes/KeyValueBox"; import { Cast, NumCast, StrCast } from "../../../../fields/Types"; -import { listSpec } from "../../../../fields/Schema"; import { ContentFittingDocumentView } from "../../nodes/ContentFittingDocumentView"; import { returnFalse, returnOne, emptyFunction, emptyPath, returnTrue, returnZero, returnEmptyFilter, Utils } from "../../../../Utils"; import { Id } from "../../../../fields/FieldSymbols"; @@ -16,18 +14,18 @@ import { Transform } from "../../../util/Transform"; import { PropertiesButtons } from "../../PropertiesButtons"; import { SelectionManager } from "../../../util/SelectionManager"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { Tooltip, Checkbox, Divider } from "@material-ui/core"; +import { Tooltip, Checkbox } from "@material-ui/core"; import SharingManager from "../../../util/SharingManager"; import { DocumentType } from "../../../documents/DocumentTypes"; -import FormatShapePane from "./FormatShapePane"; import { SharingPermissions, GetEffectiveAcl } from "../../../../fields/util"; import { InkField } from "../../../../fields/InkField"; import { undoBatch } from "../../../util/UndoManager"; import { ColorState, SketchPicker } from "react-color"; -import AntimodeMenu from "../../AntimodeMenu"; import "./FormatShapePane.scss"; -import { discovery_v1 } from "googleapis"; +// import * as fa from '@fortawesome/free-solid-svg-icons'; +// import { library } from "@fortawesome/fontawesome-svg-core"; +// library.add(fa.faPlus, fa.faMinus, fa.faCog); interface PropertiesViewProps { width: number; @@ -58,6 +56,8 @@ export class PropertiesView extends React.Component { @observable openLayout: boolean = true; @observable openAppearance: boolean = true; @observable openTransform: boolean = true; + // @observable selectedUser: string = ""; + // @observable addButtonPressed: boolean = false; @computed get isInk() { return this.selectedDoc?.type === DocumentType.INK; } @@ -277,8 +277,9 @@ export class PropertiesView extends React.Component { /** * @returns the options for the permissions dropdown. */ - getPermissionsSelect(user: string) { + getPermissionsSelect(user: string, permission: string) { return : + : + null} +
*/}
}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 60075d5cf..46eabf15a 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -571,6 +571,7 @@ export class DocumentView extends DocComponent(Docu alert("Can't delete the active workspace"); } else { SelectionManager.DeselectAll(); + this.props.Document.deleted = true; this.props.removeDocument?.(this.props.Document); } } -- cgit v1.2.3-70-g09d2 From 142011ffd5c9ca5aeed85ed8a74e5919e0e5a6dd Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Thu, 6 Aug 2020 20:38:31 +0800 Subject: audio auto play bug fix && some more commenting --- src/client/views/.DS_Store | Bin 6148 -> 10244 bytes src/client/views/MainView.tsx | 6 +- src/client/views/PropertiesButtons.tsx | 8 +- .../views/collections/CollectionDockingView.scss | 15 ++ .../views/collections/CollectionDockingView.tsx | 30 ++-- src/client/views/nodes/PresBox.scss | 79 ++++------- src/client/views/nodes/PresBox.tsx | 151 ++++++++------------- 7 files changed, 127 insertions(+), 162 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/.DS_Store b/src/client/views/.DS_Store index 7a8c419ee..c379549d0 100644 Binary files a/src/client/views/.DS_Store and b/src/client/views/.DS_Store differ diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 007d531c8..51137a080 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -175,10 +175,8 @@ export class MainView extends React.Component { fa.faFillDrip, fa.faLink, fa.faUnlink, fa.faBold, fa.faItalic, fa.faChevronLeft, fa.faUnderline, fa.faStrikethrough, fa.faSuperscript, fa.faSubscript, fa.faIndent, fa.faEyeDropper, fa.faPaintRoller, fa.faBars, fa.faBrush, fa.faShapes, fa.faEllipsisH, fa.faHandPaper, fa.faMap, fa.faUser, faHireAHelper, fa.faDesktop, fa.faTrashRestore, fa.faUsers, fa.faWrench, fa.faCog, fa.faMap, fa.faBellSlash, fa.faExpandAlt, fa.faArchive, fa.faBezierCurve, fa.faCircle, - fa.faLongArrowAltRight, fa.faPenFancy, fa.faAngleDoubleRight, faBuffer, fa.faExpand, fa.faUndo, fa.faSlidersH, fa.faAngleDoubleLeft); - //Pres trail icons (just for the sake of merging) - library.add(fa.faAngleUp, fa.faAngleDown, fa.faPlayCircle, fa.faClock, - fa.faRocket, fa.faExchangeAlt, faBuffer); + fa.faLongArrowAltRight, fa.faPenFancy, fa.faAngleDoubleRight, faBuffer, fa.faExpand, fa.faUndo, fa.faSlidersH, fa.faAngleDoubleLeft, fa.faAngleUp, + fa.faAngleDown, fa.faPlayCircle, fa.faClock, fa.faRocket, fa.faExchangeAlt, faBuffer); this.initEventListeners(); this.initAuthenticationRouters(); } diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 3392371de..55eb6c028 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -243,9 +243,8 @@ export class PropertiesButtons extends React.Component<{}, {}> { const scale = targetDoc._viewScale; } return !targetDoc ? (null) :
{"Pin with this view"}
} placement="top"> - <> +
{ if (targetDoc) { DockedFrameRenderer.PinDoc(targetDoc, false); @@ -262,8 +261,9 @@ export class PropertiesButtons extends React.Component<{}, {}> {
V
-
{"View"}
- + +
{"View"}
+
; } diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss index 98babc3d2..4204ef5bb 100644 --- a/src/client/views/collections/CollectionDockingView.scss +++ b/src/client/views/collections/CollectionDockingView.scss @@ -54,6 +54,21 @@ transition: all 0.3s; } + .miniPres-button-frame { + justify-self: center; + align-self: center; + align-items: center; + display: grid; + grid-template-columns: auto auto auto; + justify-content: space-around; + font-size: 11; + margin-left: 7; + width: 30; + height: 85%; + background-color: rgba(91, 157, 221, 0.4); + border-radius: 5px; + } + .miniPres-divider { width: 0.5px; height: 80%; diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index af701bfdd..7bd79b2ef 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -870,19 +870,25 @@ export class DockedFrameRenderer extends React.Component { return currentFrame; } renderMiniPres() { - return
-
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}> -
-
PresBox.Instance.startOrResetPres(PresBox.Instance.itemIndex)}>
-
-
-
Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length}
-
-
EXIT
+ return ( +
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)} + > + {
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}> +
+
PresBox.Instance.startAutoPres(PresBox.Instance.itemIndex)}>
+
+
+
+ Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length} + {PresBox.Instance.playButtonFrames} +
+
+
EXIT
+
}
-
; + ); } renderMiniMap() { return
; const PresBoxDocument = makeInterface(documentSchema); @@ -37,7 +38,7 @@ export class PresBox extends ViewBoxBaseComponent static Instance: PresBox; @observable _isChildActive = false; - @observable _moveOnFromAudio: boolean = false; + @observable _moveOnFromAudio: boolean = true; @observable _presTimer!: NodeJS.Timeout; @observable _selectedArray: Doc[] = []; @@ -103,7 +104,8 @@ export class PresBox extends ViewBoxBaseComponent next = () => { this.updateCurrentPresentation(); const activeNext = Cast(this.childDocs[this.itemIndex + 1], Doc, null); - const presTargetDoc = Cast(this.childDocs[this.itemIndex].presentationTargetDoc, Doc, null); + const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); + const presTargetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); const childDocs = DocListCast(presTargetDoc[Doc.LayoutFieldKey(presTargetDoc)]); const currentFrame = Cast(presTargetDoc.currentFrame, "number", null); const lastFrame = Cast(presTargetDoc.lastFrame, "number", null); @@ -119,26 +121,16 @@ export class PresBox extends ViewBoxBaseComponent if (presTargetDoc.presProgressivize) CollectionFreeFormDocumentView.updateKeyframe(childDocs, currentFrame || 0); if (presTargetDoc.zoomProgressivize) this.zoomProgressivizeNext(presTargetDoc); // Case 2: Audio or video therefore wait to play the audio or video before moving on - } else if ((presTargetDoc.type === DocumentType.VID || presTargetDoc.type === DocumentType.AUDIO) && !this._moveOnFromAudio) { - if (presTargetDoc.type === DocumentType.AUDIO) { - AudioBox.Instance.playFrom(0); - this._moveOnFromAudio = true; - } - if (presTargetDoc.type === DocumentType.VID) { - this._moveOnFromAudio = true; - } + } else if ((presTargetDoc.type === DocumentType.AUDIO) && !this._moveOnFromAudio) { + AudioBox.Instance.playFrom(0); + this._moveOnFromAudio = true; // Case 3: No more frames in current doc and next slide is defined, therefore move to next slide - } else if (activeNext !== undefined) { - if (!presTargetDoc.presProgressivize) { - const nextTagDoc = Cast(this.childDocs[this.itemIndex + 1].presentationTargetDoc, Doc, null); - const nextChildDocs = DocListCast(nextTagDoc[Doc.LayoutFieldKey(presTargetDoc)]); - nextChildDocs.forEach((doc, i) => { - doc.opacity = 1; - }); - } + } else if (this.childDocs[this.itemIndex + 1] !== undefined) { const nextSelected = this.itemIndex + 1; this.gotoDocument(nextSelected, this.itemIndex); - this._moveOnFromAudio = false; + const targetNext = Cast(activeNext.presentationTargetDoc, Doc, null); + if (activeNext && targetNext.type === DocumentType.AUDIO && activeNext.playAuto) { + } else { this._moveOnFromAudio = false }; } } @@ -318,7 +310,7 @@ export class PresBox extends ViewBoxBaseComponent //The function that starts or resets presentaton functionally, depending on presStatus of the layoutDoc @undoBatch @action - startPres = (startSlide: number) => { + startAutoPres = (startSlide: number) => { this.updateCurrentPresentation(); const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null); @@ -377,13 +369,13 @@ export class PresBox extends ViewBoxBaseComponent this.turnOffEdit(); if (srcContext) { if (srcContext.miniPres) { - document.removeEventListener("keydown", this.minimizeEvents, false); srcContext.miniPres = false; CollectionDockingView.AddRightSplit(this.rootDoc); + document.removeEventListener("keydown", this.minimizeEvents, false); } else { - document.addEventListener("keydown", this.minimizeEvents, false); srcContext.miniPres = true; this.props.addDocTab?.(this.rootDoc, "close"); + document.addEventListener("keydown", this.minimizeEvents, false); } } } @@ -544,7 +536,7 @@ export class PresBox extends ViewBoxBaseComponent } if (e.keyCode === 39) { // right (39) / d(68) / down(40) to go to next if (this.layoutDoc.presStatus !== "edit") this.next(); } if (e.keyCode === 32) { // spacebar to 'present' or autoplay - if (this.layoutDoc.presStatus !== "edit") this.startPres(0); + if (this.layoutDoc.presStatus !== "edit") this.startAutoPres(0); else this.layoutDoc.presStatus = "manual"; } if (e.keyCode === 8) { // delete selected items @@ -688,7 +680,8 @@ export class PresBox extends ViewBoxBaseComponent const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); if (activeItem && targetDoc) { const transitionSpeed = targetDoc.presTransition ? String(Number(targetDoc.presTransition) / 1000) : 0.5; - const duration = targetDoc.presDuration ? String(Number(targetDoc.presDuration) / 1000) : 2; + let duration = targetDoc.presDuration ? String(Number(targetDoc.presDuration) / 1000) : 2; + if (targetDoc.type === DocumentType.AUDIO) duration = NumCast(targetDoc.duration); const effect = targetDoc.presEffect ? targetDoc.presEffect : 'None'; activeItem.presMovement = activeItem.presMovement ? activeItem.presMovement : 'Zoom'; return ( @@ -726,8 +719,8 @@ export class PresBox extends ViewBoxBaseComponent
Slide Duration
{duration} s
- ) => { e.stopPropagation(); this.setDurationTime(e.target.value); }} /> -
+ ) => { e.stopPropagation(); this.setDurationTime(e.target.value); }} /> +
Short
Medium
Long
@@ -816,7 +809,7 @@ export class PresBox extends ViewBoxBaseComponent
activeItem.playAuto = !activeItem.playAuto}>Play automatically
-
activeItem.playAuto = !activeItem.playAuto}>Play on next
+
activeItem.playAuto = !activeItem.playAuto}>Play on next
activeItem.openDocument = !activeItem.openDocument}>Open document
@@ -923,12 +916,14 @@ export class PresBox extends ViewBoxBaseComponent if (freeform && layout) doc = this.createTemplate(layout, title); if (!freeform && !layout) doc = Docs.Create.TextDocument("", { _nativeWidth: 400, _width: 225, title: title }); const presCollection = Cast(this.layoutDoc.presCollection, Doc, null); - const data = Cast(presCollection.data, listSpec(Doc)); + const data = Cast(presCollection?.data, listSpec(Doc)); const presData = Cast(this.rootDoc.data, listSpec(Doc)); if (data && doc && presData) { data.push(doc); DockedFrameRenderer.PinDoc(doc, false); this.gotoDocument(this.childDocs.length, this.itemIndex); + } else { + this.props.addDocTab(doc as Doc, "onRight"); } } @@ -975,7 +970,7 @@ export class PresBox extends ViewBoxBaseComponent @computed get presentDropdown() { return (
e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}> -
{ this.updateMinimize; this.layoutDoc.presStatus = "manual"; this.turnOffEdit(); }))}> +
Minimize
{ this.layoutDoc.presStatus = "manual"; this.turnOffEdit(); }))}> @@ -1108,7 +1103,10 @@ export class PresBox extends ViewBoxBaseComponent } turnOffEdit = () => { - this.childDocs.forEach((doc, index) => { + this.childDocs.forEach((doc) => { + doc.editSnapZoomProgressivize = false; + doc.editZoomProgressivize = false; + doc.editScrollProgressivize = false; const targetDoc = Cast(doc.presentationTargetDoc, Doc, null); targetDoc.editSnapZoomProgressivize = false; targetDoc.editZoomProgressivize = false; @@ -1596,63 +1594,31 @@ export class PresBox extends ViewBoxBaseComponent const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); if (activeItem) { return ( -
-
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}> +
+
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}> +
{"View paths"}
}>
- + 1 ? this.viewPaths : undefined} />
{this.expandBoolean ? "Minimize all" : "Expand all"}
}>
{ this.toggleExpand(); this.childDocs.forEach((doc, ind) => { if (this.expandBoolean) doc.presExpandInlineButton = true; else doc.presExpandInlineButton = false; }); }}>
- {/*
*/} -
- {/*
{"Transitions"}
}>
- -
430 ? "block" : "none" }} className="toolbar-buttonText">  Transitions
- -
-
{"Progressivize"}
}>
- -
430 ? "block" : "none" }} className="toolbar-buttonText">  Progressivize
- -
-
*/} - {/*
- -
-
-
-
-
-
-
-
*/}
); } else { return ( - <> +
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}>
- {/*
- -
-
-
-
-
-
-
-
*/} - +
); } } @@ -1674,13 +1640,16 @@ export class PresBox extends ViewBoxBaseComponent -
+
0 ? 1 : 0.3 }}> -
this.layoutDoc.presStatus = "manual"}> +
{ if (this.childDocs.length > 0) this.layoutDoc.presStatus = "manual" }}>
200 ? "inline-flex" : "none" }}>  Present
-
{ e.stopPropagation; this.presentTools = !this.presentTools; }}> +
{ + if (this.childDocs.length > 0) this.presentTools = !this.presentTools; + }))}> {this.presentDropdown}
@@ -1691,41 +1660,41 @@ export class PresBox extends ViewBoxBaseComponent ); } - @computed get playButtons() { + @computed get playButtonFrames() { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); + return ( + <> + {targetDoc ?
= 0 ? "inline-flex" : "none" }}> +
{targetDoc.currentFrame}
+
+
{targetDoc.lastFrame}
+
: null} + + ); + } + + @computed get playButtons() { // Case 1: There are still other frames and should go through all frames before going to next slide return (
- {/* -
this.startPres(0)}> -   - -
-
{ e.stopPropagation; this.togglePlay(); }}> - - {this.playDropdown} -
- */}
-
this.startPres(this.itemIndex)}>
+
this.startAutoPres(this.itemIndex)}>
250 ? "inline-flex" : "none" }}> Slide {this.itemIndex + 1} / {this.childDocs.length} - {targetDoc ?
= 0 ? "inline-flex" : "none" }}> -
{targetDoc.currentFrame}
-
{targetDoc.lastFrame}
-
: null} + {this.playButtonFrames}
-
this.layoutDoc.presStatus = "edit"}> - -
+ {this.props.PanelWidth() > 250 ?
this.layoutDoc.presStatus = "edit"}>EXIT
+ :
this.layoutDoc.presStatus = "edit"}> + +
}
); } render() { - // needed to insure that the childDocs are loaded for looking up fields + // needed to ensure that the childDocs are loaded for looking up fields this.childDocs.slice(); const mode = StrCast(this.rootDoc._viewType) as CollectionViewType; return
-- cgit v1.2.3-70-g09d2 From 649ce72e3c30bca38e452c87d7f15453745c0785 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Thu, 6 Aug 2020 20:50:28 +0800 Subject: remove console log and texte -> text :basecamp: --- src/client/views/nodes/PresBox.tsx | 2 +- src/client/views/presentationview/PresElementBox.tsx | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index 24918098f..efcea832d 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -941,7 +941,7 @@ export class PresBox extends ViewBoxBaseComponent const subtitle = Docs.Create.TextDocument("Click to change subtitle", { title: "Slide subtitle", _width: 380, _height: 50, x: 10, y: 118, _fontSize: "16pt" }); const header = Docs.Create.TextDocument("Click to change header", { title: "Slide header", _width: 380, _height: 65, x: 10, y: 80, _fontSize: "20pt" }); const contentTitle = Docs.Create.TextDocument("Click to change title", { title: "Slide title", _width: 380, _height: 60, x: 10, y: 10, _fontSize: "24pt" }); - const content = Docs.Create.TextDocument("Click to change texte", { title: "Slide text", _width: 380, _height: 145, x: 10, y: 70, _fontSize: "14pt" }); + const content = Docs.Create.TextDocument("Click to change text", { title: "Slide text", _width: 380, _height: 145, x: 10, y: 70, _fontSize: "14pt" }); const content1 = Docs.Create.TextDocument("Click to change text", { title: "Column 1", _width: 185, _height: 140, x: 10, y: 80, _fontSize: "14pt" }); const content2 = Docs.Create.TextDocument("Click to change text", { title: "Column 2", _width: 185, _height: 140, x: 205, y: 80, _fontSize: "14pt" }); switch (layout) { diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 092fd1fd3..816577847 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -238,7 +238,6 @@ export class PresElementBox extends ViewBoxBaseComponent Date: Thu, 6 Aug 2020 19:51:25 +0530 Subject: alias and acl related fixes --- src/client/documents/Documents.ts | 1 + src/client/views/collections/CollectionView.tsx | 3 ++- .../collectionFreeForm/PropertiesView.tsx | 20 +++++++++++--------- src/fields/Doc.ts | 4 ++-- src/fields/util.ts | 2 +- 5 files changed, 17 insertions(+), 13 deletions(-) (limited to 'src/client/views') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 7719b3eef..61a44a39d 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -565,6 +565,7 @@ export namespace Docs { // without this, if a doc has no annotations but the user has AddOnly privileges, they won't be able to add an annotation because they would have needed to create the field's list which they don't have permissions to do. dataDoc[fieldKey + "-annotations"] = new List(); + dataDoc.aliases = new List(); proto.links = ComputedField.MakeFunction("links(self)"); diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index dcd5a31f6..4d1cb670c 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -151,7 +151,8 @@ export class CollectionView extends Touchable { for (const [key, value] of Object.entries(this.props.Document[AclSym])) { - distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); + if (d.author === Doc.CurrentUserEmail && !d.aliasOf) distributeAcls(key, SharingPermissions.Admin, d, true); + else distributeAcls(key, this.AclMap.get(value) as SharingPermissions, d, true); } }); } diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index d22c00b1f..5634a438a 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -25,6 +25,7 @@ import "./FormatShapePane.scss"; import { discovery_v1 } from "googleapis"; import { PresBox } from "../../nodes/PresBox"; import { DocumentManager } from "../../../util/DocumentManager"; +import FormatShapePane from "./FormatShapePane"; const higflyout = require("@hig/flyout"); export const { anchorPoints } = higflyout; export const Flyout = higflyout.default; @@ -51,8 +52,8 @@ export class PropertiesView extends React.Component { @computed get selectedDocumentView() { if (SelectionManager.SelectedDocuments().length) { return SelectionManager.SelectedDocuments()[0]; - } else if (PresBox.Instance._selectedArray.length >= 1) { - return DocumentManager.Instance.getDocumentView(PresBox.Instance.rootDoc); + } else if (PresBox.Instance?._selectedArray.length >= 1) { + return DocumentManager.Instance.getDocumentView(PresBox.Instance?.rootDoc); } else { return undefined; } } @computed get isPres(): boolean { @@ -72,6 +73,7 @@ export class PropertiesView extends React.Component { @observable openTransform: boolean = true; // @observable selectedUser: string = ""; // @observable addButtonPressed: boolean = false; + //Pres Trails booleans: @observable openAddSlide: boolean = true; @observable openPresentationTools: boolean = true; @@ -957,9 +959,9 @@ export class PropertiesView extends React.Component {
{this.editableTitle}
- {PresBox.Instance._selectedArray.length} selected + {PresBox.Instance?._selectedArray.length} selected
- {PresBox.Instance.listOfSelected} + {PresBox.Instance?.listOfSelected}
@@ -973,7 +975,7 @@ export class PropertiesView extends React.Component {
{this.openAddSlide ?
- {PresBox.Instance.newDocumentDropdown} + {PresBox.Instance?.newDocumentDropdown}
: null}
@@ -986,7 +988,7 @@ export class PropertiesView extends React.Component {
{this.openPresTransitions ?
- {PresBox.Instance.transitionDropdown} + {PresBox.Instance?.transitionDropdown}
: null}
@@ -999,20 +1001,20 @@ export class PropertiesView extends React.Component {
{this.openPresProgressivize ?
- {PresBox.Instance.progressivizeDropdown} + {PresBox.Instance?.progressivizeDropdown}
: null}
runInAction(() => { this.openSlideOptions = !this.openSlideOptions; })} style={{ backgroundColor: this.openSlideOptions ? "black" : "" }}> -     {PresBox.Instance.stringType} options +     {PresBox.Instance?.stringType} options
{this.openSlideOptions ?
- {PresBox.Instance.optionsDropdown} + {PresBox.Instance?.optionsDropdown}
: null}
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts index 6163fedbb..6bfe91378 100644 --- a/src/fields/Doc.ts +++ b/src/fields/Doc.ts @@ -508,9 +508,9 @@ export namespace Doc { alias.aliasOf = doc; alias.title = ComputedField.MakeFunction(`renameAlias(this, ${Doc.GetProto(doc).aliasNumber = NumCast(Doc.GetProto(doc).aliasNumber) + 1})`); alias.author = Doc.CurrentUserEmail; + alias[AclSym] = doc[AclSym]; - if (!doc.aliases) doc.aliases = new List([alias]); - else Doc.AddDocToList(doc, "aliases", alias); + Doc.AddDocToList(doc[DataSym], "aliases", alias); return alias; } diff --git a/src/fields/util.ts b/src/fields/util.ts index 44a3317db..4c71572db 100644 --- a/src/fields/util.ts +++ b/src/fields/util.ts @@ -220,7 +220,7 @@ export function distributeAcls(key: string, acl: SharingPermissions, target: Doc // maps over the aliases of the document if (target.aliases) { DocListCast(target.aliases).map(alias => { - distributeAcls(key, acl, alias); + distributeAcls(key, acl, alias, inheritingFromCollection); }); } -- cgit v1.2.3-70-g09d2 From 33487aa34fd455acf5216cfee7913d6e36f390ed Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Fri, 7 Aug 2020 01:35:46 +0800 Subject: presentaiton options slightly reformatted :pear: --- src/client/views/PropertiesButtons.tsx | 3 +- .../views/collections/CollectionDockingView.tsx | 3 +- .../collectionFreeForm/PropertiesView.scss | 37 +++++++++ .../collectionFreeForm/PropertiesView.tsx | 64 ++++++++-------- src/client/views/nodes/PresBox.scss | 8 +- src/client/views/nodes/PresBox.tsx | 89 ++++++++++------------ .../views/nodes/formattedText/FormattedTextBox.tsx | 19 ++--- .../views/presentationview/PresElementBox.scss | 4 +- .../views/presentationview/PresElementBox.tsx | 3 +- 9 files changed, 128 insertions(+), 102 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 55eb6c028..5c584d270 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -221,8 +221,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
DockedFrameRenderer.PinDoc(targetDoc, isPinned)}> - +
{ return (
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)} > - {
document.addEventListener("keydown", PresBox.Instance.minimizeEvents, false)}> + {
PresBox.Instance.startAutoPres(PresBox.Instance.itemIndex)}>
diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss index 5b41db90e..3ae94efb7 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.scss +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss @@ -405,6 +405,43 @@ } } + + .propertiesView-presTrails { + border-bottom: 1px solid black; + //padding: 8.5px; + + .propertiesView-presTrails-title { + font-weight: bold; + font-size: 12.5px; + padding: 4px; + display: flex; + color: white; + padding-left: 8px; + background-color: rgb(51, 51, 51); + + &:hover { + cursor: pointer; + } + + .propertiesView-presTrails-title-icon { + float: right; + right: 0; + position: absolute; + margin-left: 2px; + margin-right: 9px; + + &:hover { + cursor: pointer; + } + } + } + + .propertiesView-presTrails-content { + font-size: 10px; + padding: 10px; + margin-left: 5px; + } + } } .inking-button { diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 89f48fc65..cef2241c9 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -71,11 +71,10 @@ export class PropertiesView extends React.Component { @observable openAppearance: boolean = true; @observable openTransform: boolean = true; //Pres Trails booleans: - @observable openAddSlide: boolean = true; - @observable openPresentationTools: boolean = true; - @observable openPresTransitions: boolean = true; - @observable openPresProgressivize: boolean = true; - @observable openSlideOptions: boolean = true; + @observable openPresTransitions: boolean = false; + @observable openPresProgressivize: boolean = false; + @observable openAddSlide: boolean = false; + @observable openSlideOptions: boolean = false; @observable inActions: boolean = false; @observable _controlBtn: boolean = false; @@ -874,6 +873,7 @@ export class PropertiesView extends React.Component {
; } if (this.isPres) { + const selectedItem: boolean = PresBox.Instance._selectedArray.length > 0; return
Presentation @@ -890,57 +890,57 @@ export class PropertiesView extends React.Component {
-
-
runInAction(() => { this.openAddSlide = !this.openAddSlide; })} - style={{ backgroundColor: this.openAddSlide ? "black" : "" }}> -     Add new slide -
- -
-
- {this.openAddSlide ?
- {PresBox.Instance.newDocumentDropdown} -
: null} -
-
-
+
runInAction(() => { this.openPresTransitions = !this.openPresTransitions; })} style={{ backgroundColor: this.openPresTransitions ? "black" : "" }}>     Transitions -
+
- {this.openPresTransitions ?
+ {this.openPresTransitions ?
{PresBox.Instance.transitionDropdown}
: null} -
-
-
} + {!selectedItem ? (null) :
+
runInAction(() => { this.openPresProgressivize = !this.openPresProgressivize; })} style={{ backgroundColor: this.openPresProgressivize ? "black" : "" }}>     Progressivize -
+
- {this.openPresProgressivize ?
+ {this.openPresProgressivize ?
{PresBox.Instance.progressivizeDropdown}
: null} -
-
-
} + {!selectedItem ? (null) :
+
runInAction(() => { this.openSlideOptions = !this.openSlideOptions; })} style={{ backgroundColor: this.openSlideOptions ? "black" : "" }}>     {PresBox.Instance.stringType} options -
+
- {this.openSlideOptions ?
+ {this.openSlideOptions ?
{PresBox.Instance.optionsDropdown}
: null} +
} +
+
runInAction(() => { this.openAddSlide = !this.openAddSlide; })} + style={{ backgroundColor: this.openAddSlide ? "black" : "" }}> +     Add new slide +
+ +
+
+ {this.openAddSlide ?
+ {PresBox.Instance.newDocumentDropdown} +
: null}
if (srcContext.miniPres) { srcContext.miniPres = false; CollectionDockingView.AddRightSplit(this.rootDoc); - document.removeEventListener("keydown", this.minimizeEvents, false); } else { srcContext.miniPres = true; this.props.addDocTab?.(this.rootDoc, "close"); - document.addEventListener("keydown", this.minimizeEvents, false); } } } @@ -506,20 +504,6 @@ export class PresBox extends ViewBoxBaseComponent } } - // Key events when the minimized player is active - @action - minimizeEvents = (e: KeyboardEvent) => { - e.stopPropagation(); - e.preventDefault(); - if (e.keyCode === 27) { // Escape key - this.layoutDoc.presStatus = "edit"; - } if (e.keyCode === 37) { // left(37) / a(65) / up(38) to go back - this.back(); - } if (e.keyCode === 39) { // right (39) / d(68) / down(40) to go to next - this.next(); - } - } - // Key for when the presentaiton is active (according to Selection Manager) @action keyEvents = (e: KeyboardEvent) => { @@ -531,10 +515,10 @@ export class PresBox extends ViewBoxBaseComponent else this.layoutDoc.presStatus = "edit"; } if ((e.metaKey || e.altKey) && e.keyCode === 65) { // Ctrl-A to select all if (this.layoutDoc.presStatus === "edit") this._selectedArray = this.childDocs; - } if (e.keyCode === 37) { // left(37) / a(65) / up(38) to go back - if (this.layoutDoc.presStatus !== "edit") this.back(); - } if (e.keyCode === 39) { // right (39) / d(68) / down(40) to go to next - if (this.layoutDoc.presStatus !== "edit") this.next(); + } if (e.keyCode === 37 || e.keyCode === 38) { // left(37) / a(65) / up(38) to go back + this.back(); + } if (e.keyCode === 39 || e.keyCode === 40) { // right (39) / d(68) / down(40) to go to next + this.next(); } if (e.keyCode === 32) { // spacebar to 'present' or autoplay if (this.layoutDoc.presStatus !== "edit") this.startAutoPres(0); else this.layoutDoc.presStatus = "manual"; @@ -720,7 +704,7 @@ export class PresBox extends ViewBoxBaseComponent
{duration} s
) => { e.stopPropagation(); this.setDurationTime(e.target.value); }} /> -
+
Short
Medium
Long
@@ -814,6 +798,20 @@ export class PresBox extends ViewBoxBaseComponent
activeItem.openDocument = !activeItem.openDocument}>Open document
+
+
{ + activeItem.presPinView = !activeItem.presPinView; + if (activeItem.presPinView) { + const x = targetDoc._panX; + const y = targetDoc._panY; + const scale = targetDoc._viewScale; + activeItem.presPinViewX = x; + activeItem.presPinViewY = y; + activeItem.presPinViewScale = scale; + } + }}>Presentation pin view
+
Store original website
@@ -1592,35 +1590,26 @@ export class PresBox extends ViewBoxBaseComponent @computed get toolbar() { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); - if (activeItem) { - return ( -
-
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}> - - -
-
-
{"View paths"}
}>
- 1 ? this.viewPaths : undefined} /> -
-
{this.expandBoolean ? "Minimize all" : "Expand all"}
}> -
{ this.toggleExpand(); this.childDocs.forEach((doc, ind) => { if (this.expandBoolean) doc.presExpandInlineButton = true; else doc.presExpandInlineButton = false; }); }}> - -
- -
-
- ); - } else { - return ( -
-
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}> - - -
-
- ); - } + return ( +
+
{"Add new slide"}
}>
this.newDocumentTools = !this.newDocumentTools)}> + + +
+
+
{"View paths"}
}> +
1 ? 1 : 0.3 }} className={`toolbar-button ${this.pathBoolean ? "active" : ""}`} onClick={this.childDocs.length > 1 ? this.viewPaths : undefined}> + +
+ +
{this.expandBoolean ? "Minimize all" : "Expand all"}
}> +
0 ? 1 : 0.3 }} className={`toolbar-button ${this.expandBoolean ? "active" : ""}`} onClick={() => { if (this.childDocs.length > 0) this.toggleExpand(); this.childDocs.forEach((doc, ind) => { if (this.expandBoolean) doc.presExpandInlineButton = true; else doc.presExpandInlineButton = false; }); }}> + +
+ +
+
+ ); } /** diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index af4bd77c7..cc37cf586 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -577,7 +577,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp const mainBulletText: string[] = []; const mainBulletList: Doc[] = []; if (list) { - const newBullets: Doc[] = this.recursiveProgressivize(1, list); + const newBullets: Doc[] = this.recursiveProgressivize(1, list)[0]; mainBulletList.push.apply(mainBulletList, newBullets); } console.log(mainBulletList.length); @@ -591,7 +591,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp this.props.addDocument?.(doc); } - recursiveProgressivize = (nestDepth: number, list: HTMLCollectionOf, d?: number, y?: number, before?: string): Doc[] => { + recursiveProgressivize = (nestDepth: number, list: HTMLCollectionOf, d?: number, y?: number, before?: string): [Doc[], number] => { const mainBulletList: Doc[] = []; let b = d ? d : 0; let yLoc = y ? y : 0; @@ -607,29 +607,30 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp if (listItem.childElementCount > 1) { b++; nestCount++; - count = before ? count + nestCount + "." : nestCount + "."; yLoc += height; + count = before ? count + nestCount + "." : nestCount + "."; const text = listItem.getElementsByTagName("p")[0].innerText; const length = text.length; - const bullet1 = Docs.Create.TextDocument(count + " " + text, { title: "Slide text", _width: width, _height: height, x: xLoc, y: 10 + (yLoc), _fontSize: fontSize, backgroundColor: "rgba(0,0,0,0)", appearFrame: d ? d : b }); + const bullet1 = Docs.Create.TextDocument(count + " " + text, { title: "Slide text", _width: width, _autoHeight: true, x: xLoc, y: (yLoc), _fontSize: fontSize, backgroundColor: "rgba(0,0,0,0)", appearFrame: d ? d : b }); + // yLoc += NumCast(bullet1._height); mainBulletList.push(bullet1); const newList = this.recursiveProgressivize(nestDepth + 1, listItem.getElementsByTagName("li"), b, yLoc, count); - mainBulletList.push.apply(mainBulletList, newList); - b += newList.length; + mainBulletList.push.apply(mainBulletList, newList[0]); yLoc += newList.length * (55 - ((nestDepth + 1) * 5)); } else { b++; nestCount++; - count = before ? count + nestCount + "." : nestCount + "."; yLoc += height; + count = before ? count + nestCount + "." : nestCount + "."; const text = listItem.innerText; const length = text.length; - const bullet1 = Docs.Create.TextDocument(count + " " + text, { title: "Slide text", _width: width, _height: height, x: xLoc, y: 10 + (yLoc), _fontSize: fontSize, backgroundColor: "rgba(0,0,0,0)", appearFrame: d ? d : b }); + const bullet1 = Docs.Create.TextDocument(count + " " + text, { title: "Slide text", _width: width, _autoHeight: true, x: xLoc, y: (yLoc), _fontSize: fontSize, backgroundColor: "rgba(0,0,0,0)", appearFrame: d ? d : b }); + // yLoc += NumCast(bullet1._height); mainBulletList.push(bullet1); } } }); - return mainBulletList; + return [mainBulletList, yLoc]; } recordDictation = () => { diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss index 3d730d7ac..1e776384a 100644 --- a/src/client/views/presentationview/PresElementBox.scss +++ b/src/client/views/presentationview/PresElementBox.scss @@ -4,7 +4,7 @@ $light-background: #ececec; .presElementBox-item { display: grid; - grid-template-columns: max-content max-content max-content; + grid-template-columns: max-content max-content max-content max-content; background-color: #d5dce2; font-family: Roboto; letter-spacing: normal; @@ -122,7 +122,7 @@ $light-background: #ececec; padding-left: 10px; padding-right: 10px; letter-spacing: normal; - max-width: max-content; + width: max-content; text-overflow: ellipsis; overflow: hidden; white-space: pre; diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx index 816577847..a6dbb76ef 100644 --- a/src/client/views/presentationview/PresElementBox.tsx +++ b/src/client/views/presentationview/PresElementBox.tsx @@ -326,11 +326,12 @@ export class PresElementBox extends ViewBoxBaseComponent {`${this.indexInPres + 1}.`}
-
+
{`${this.targetDoc?.title}`}
{"Movement speed"}
}>
300 ? "block" : "none" }}>{this.transition}
{"Duration"}
}>
300 ? "block" : "none" }}>{this.duration}
 +
{"Presentation pin view"}
}>
300 ? "block" : "none" }}>V
{"Remove from presentation"}
}>
{ -- cgit v1.2.3-70-g09d2 From 985c4eb599859d946833ee4ca42a5743b7d6caf8 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Fri, 7 Aug 2020 02:15:04 +0800 Subject: keyEvent changes :key: :point_down: --- .../collectionFreeForm/PropertiesView.tsx | 2 +- src/client/views/nodes/PresBox.tsx | 39 ++++++++++++++-------- 2 files changed, 26 insertions(+), 15 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index cef2241c9..9c1cbec99 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -51,7 +51,7 @@ export class PropertiesView extends React.Component { @computed get selectedDocumentView() { if (SelectionManager.SelectedDocuments().length) { return SelectionManager.SelectedDocuments()[0]; - } else if (PresBox.Instance._selectedArray.length >= 1) { + } else if (PresBox.Instance._selectedArray.length) { return DocumentManager.Instance.getDocumentView(PresBox.Instance.rootDoc); } else { return undefined; } } diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index a9daba675..7b370e89b 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -27,7 +27,6 @@ import { CollectionFreeFormViewChrome } from "../collections/CollectionMenu"; import { actionAsync } from "mobx-utils"; import { SelectionManager } from "../../util/SelectionManager"; import { AudioBox } from "./AudioBox"; -import { white } from "colors"; type PresBoxSchema = makeInterface<[typeof documentSchema]>; const PresBoxDocument = makeInterface(documentSchema); @@ -74,7 +73,23 @@ export class PresBox extends ViewBoxBaseComponent } this.props.Document.presentationFieldKey = this.fieldKey; // provide info to the presElement script so that it can look up rendering information about the presBox } - + @computed get selectedDocumentView() { + if (SelectionManager.SelectedDocuments().length) { + return SelectionManager.SelectedDocuments()[0]; + } else if (PresBox.Instance._selectedArray.length) { + return DocumentManager.Instance.getDocumentView(PresBox.Instance.rootDoc); + } else { return undefined; } + } + @computed get isPres(): boolean { + if (this.selectedDoc?.type === DocumentType.PRES) { + document.addEventListener("keydown", this.keyEvents, true); + return true; + } else { + document.removeEventListener("keydown", this.keyEvents, true); + return false; + } + } + @computed get selectedDoc() { return this.selectedDocumentView?.rootDoc; } componentDidMount() { this.rootDoc.presBox = this.rootDoc; @@ -84,14 +99,6 @@ export class PresBox extends ViewBoxBaseComponent this.layoutDoc._gridGap = 5; } - onPointerOver = () => { - document.addEventListener("keydown", this.keyEvents, true); - } - - onPointerLeave = () => { - document.removeEventListener("keydown", this.keyEvents, true); - } - updateCurrentPresentation = () => { Doc.UserDoc().activePresentation = this.rootDoc; } @@ -485,9 +492,11 @@ export class PresBox extends ViewBoxBaseComponent //Command click @action multiSelect = (doc: Doc, ref: HTMLElement, drag: HTMLElement) => { - this._selectedArray.push(this.childDocs[this.childDocs.indexOf(doc)]); - this._eleArray.push(ref); - this._dragArray.push(drag); + if (!this._selectedArray.includes(doc)) { + this._selectedArray.push(this.childDocs[this.childDocs.indexOf(doc)]); + this._eleArray.push(ref); + this._dragArray.push(drag); + } } //Shift click @@ -1683,10 +1692,12 @@ export class PresBox extends ViewBoxBaseComponent } render() { + // calling this method for keyEvents + this.isPres; // needed to ensure that the childDocs are loaded for looking up fields this.childDocs.slice(); const mode = StrCast(this.rootDoc._viewType) as CollectionViewType; - return
+ return
{this.topPanel} {this.toolbar} {this.newDocumentToolbarDropdown} -- cgit v1.2.3-70-g09d2 From 002eb8c7cd45bf4ad3e4e1e99ccb70675029678b Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Fri, 7 Aug 2020 03:46:21 +0800 Subject: viewfinder updates (bug fixes) :eyes: --- .../collectionFreeForm/CollectionFreeFormView.tsx | 40 +++++++++------------- src/client/views/nodes/PresBox.tsx | 40 +++++++++++++--------- 2 files changed, 39 insertions(+), 41 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index ffeb3024d..192335abb 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -1495,33 +1495,26 @@ interface CollectionFreeFormViewPannableContentsProps { @observer class CollectionFreeFormViewPannableContents extends React.Component{ @computed get zoomProgressivize() { - if (this.props.zoomProgressivize) { - console.log("should render"); - return ( - <> - {PresBox.Instance.zoomProgressivizeContainer} - - ); - } + if (PresBox.Instance) return ( + <> + {this.props.zoomProgressivize ? PresBox.Instance.zoomProgressivizeContainer : (null)} + + ); } @computed get progressivize() { - if (this.props.progressivize) { - console.log("should render"); - return ( - <> - {PresBox.Instance.progressivizeChildDocs} - - ); - } + if (PresBox.Instance) return ( + <> + {this.props.progressivize ? PresBox.Instance.progressivizeChildDocs : (null)} + + ); } @computed get presPaths() { const presPaths = "presPaths" + (this.props.presPaths ? "" : "-hidden"); - if (this.props.presPaths) { - return ( - <> -
{PresBox.Instance.order}
+ if (PresBox.Instance) return ( + <> + {!this.props.presPaths ? (null) : <>
{PresBox.Instance.order}
@@ -1542,10 +1535,9 @@ class CollectionFreeFormViewPannableContents extends React.Component ; {PresBox.Instance.paths} - - - ); - } + } + + ); } render() { diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index 7b370e89b..230137584 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -1390,8 +1390,10 @@ export class PresBox extends ViewBoxBaseComponent const doc = document.getElementById('resizable'); if (doc && tagDocView) { - const scale = tagDocView.childScaling(); - const scale2 = tagDocView.props.ScreenToLocalTransform().Scale; + const scale2 = tagDocView.childScaling(); + const scale3 = tagDocView.props.ScreenToLocalTransform().Scale; + const scale = NumCast(targetDoc._viewScale); + console.log("scale: " + NumCast(targetDoc._viewScale)); let height = doc.offsetHeight; let width = doc.offsetWidth; let top = doc.offsetTop; @@ -1428,9 +1430,9 @@ export class PresBox extends ViewBoxBaseComponent // } //Bottom right if (this._isDraggingBR) { - const newHeight = height += (e.movementY * scale2); + const newHeight = height += (e.movementY * scale); doc.style.height = newHeight + 'px'; - const newWidth = width += (e.movementX * scale2); + const newWidth = width += (e.movementX * scale); doc.style.width = newWidth + 'px'; // Bottom left } else if (this._isDraggingBL) { @@ -1442,26 +1444,26 @@ export class PresBox extends ViewBoxBaseComponent doc.style.left = newLeft + 'px'; // Top right } else if (this._isDraggingTR) { - const newWidth = width += (e.movementX * tagDocView.props.ScreenToLocalTransform().Scale); + const newWidth = width += (e.movementX * scale); doc.style.width = newWidth + 'px'; - const newHeight = height -= (e.movementY * tagDocView.props.ScreenToLocalTransform().Scale); + const newHeight = height -= (e.movementY * scale); doc.style.height = newHeight + 'px'; - const newTop = top += (e.movementY * tagDocView.props.ScreenToLocalTransform().Scale); + const newTop = top += (e.movementY * scale); doc.style.top = newTop + 'px'; // Top left } else if (this._isDraggingTL) { - const newWidth = width -= (e.movementX * tagDocView.props.ScreenToLocalTransform().Scale); + const newWidth = width -= (e.movementX * scale); doc.style.width = newWidth + 'px'; - const newHeight = height -= (e.movementY * tagDocView.props.ScreenToLocalTransform().Scale); + const newHeight = height -= (e.movementY * scale); doc.style.height = newHeight + 'px'; - const newTop = top += (e.movementY * tagDocView.props.ScreenToLocalTransform().Scale); + const newTop = top += (e.movementY * scale); doc.style.top = newTop + 'px'; - const newLeft = left += (e.movementX * tagDocView.props.ScreenToLocalTransform().Scale); + const newLeft = left += (e.movementX * scale); doc.style.left = newLeft + 'px'; } else if (this._isDragging) { - const newTop = top += (e.movementY * tagDocView.props.ScreenToLocalTransform().Scale); + const newTop = top += (e.movementY * scale); doc.style.top = newTop + 'px'; - const newLeft = left += (e.movementX * tagDocView.props.ScreenToLocalTransform().Scale); + const newLeft = left += (e.movementX * scale); doc.style.left = newLeft + 'px'; } this.updateList(targetDoc, targetDoc["viewfinder-width-indexed"], width); @@ -1501,20 +1503,24 @@ export class PresBox extends ViewBoxBaseComponent @computed get zoomProgressivizeContainer() { const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null); const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null); - if (targetDoc.editZoomProgressivize) { + if (targetDoc) { + const vfLeft: number = this.checkList(targetDoc, targetDoc["viewfinder-left-indexed"]); + const vfWidth: number = this.checkList(targetDoc, targetDoc["viewfinder-width-indexed"]); + const vfTop: number = this.checkList(targetDoc, targetDoc["viewfinder-top-indexed"]); + const vfHeight: number = this.checkList(targetDoc, targetDoc["viewfinder-height-indexed"]); return ( <> -
+ {!targetDoc.editZoomProgressivize ? (null) :
-
+
} ); - } else return null; + } } @computed get progressivizeChildDocs() { -- cgit v1.2.3-70-g09d2 From 1632540870c4a46be31a2ae949714296e8403383 Mon Sep 17 00:00:00 2001 From: Melissa Zhang Date: Thu, 6 Aug 2020 13:04:43 -0700 Subject: fixed LinkMenu position so that list of links stay with doc when zooming --- src/client/views/MainView.tsx | 2 +- src/client/views/linking/LinkMenu.tsx | 23 +++++++++++++++-------- src/client/views/nodes/DocumentLinksButton.tsx | 4 ---- 3 files changed, 16 insertions(+), 13 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 007d531c8..d03cb1bb2 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -790,7 +790,7 @@ export class MainView extends React.Component {
{LinkDescriptionPopup.descriptionPopup ? : null} - {DocumentLinksButton.EditLink ? : (null)} + {DocumentLinksButton.EditLink ? : (null)} {LinkDocPreview.LinkInfo ? : (null)} diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx index 7b5fb0127..8023928a1 100644 --- a/src/client/views/linking/LinkMenu.tsx +++ b/src/client/views/linking/LinkMenu.tsx @@ -19,7 +19,6 @@ interface Props { docView: DocumentView; changeFlyout: () => void; addDocTab: (document: Doc, where: string) => boolean; - location: number[]; } @observer @@ -85,17 +84,25 @@ export class LinkMenu extends React.Component { return linkItems; } + @computed + get position() { + const docView = this.props.docView; + const transform = (docView.props.ScreenToLocalTransform().scale(docView.props.ContentScaling())).inverse(); + const [sptX, sptY] = transform.transformPoint(0, 0); + const [bptX, bptY] = transform.transformPoint(docView.props.PanelWidth(), docView.props.PanelHeight()); + return { x: sptX, y: sptY, r: bptX, b: bptY }; + } + render() { + console.log("computed", this.position.x, this.position.b); const sourceDoc = this.props.docView.props.Document; const groups: Map = LinkManager.Instance.getRelatedGroupedLinks(sourceDoc); return
- {!this._editingLink ?
- {this.renderAllGroups(groups)} -
:
+ {!this._editingLink ? +
+ {this.renderAllGroups(groups)} +
: +
this._editingLink = undefined)} />
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx index cb79e1522..c2f27c85a 100644 --- a/src/client/views/nodes/DocumentLinksButton.tsx +++ b/src/client/views/nodes/DocumentLinksButton.tsx @@ -74,7 +74,6 @@ export class DocumentLinksButton extends React.Component Doc.BrushDoc(this.props.View.Document)); } else if (!this.props.InMenu) { DocumentLinksButton.EditLink = this.props.View; - DocumentLinksButton.EditLinkLoc = [e.clientX + 10, e.clientY]; } } @@ -147,8 +145,6 @@ export class DocumentLinksButton extends React.Component Date: Thu, 6 Aug 2020 13:07:48 -0700 Subject: put LinkMenu above document toolbar so that it doesn't get blocked --- src/client/views/linking/LinkMenu.scss | 1 + src/client/views/linking/LinkMenu.tsx | 3 +-- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss index 98e4171f0..4dc25031d 100644 --- a/src/client/views/linking/LinkMenu.scss +++ b/src/client/views/linking/LinkMenu.scss @@ -6,6 +6,7 @@ position: absolute; top: 0; left: 0; + z-index: 999; .linkMenu-list { diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx index 8023928a1..8ecde959f 100644 --- a/src/client/views/linking/LinkMenu.tsx +++ b/src/client/views/linking/LinkMenu.tsx @@ -4,14 +4,13 @@ import { DocumentView } from "../nodes/DocumentView"; import { LinkEditor } from "./LinkEditor"; import './LinkMenu.scss'; import React = require("react"); -import { Doc, Opt } from "../../../fields/Doc"; +import { Doc } from "../../../fields/Doc"; import { LinkManager } from "../../util/LinkManager"; import { LinkMenuGroup } from "./LinkMenuGroup"; import { faTrash } from '@fortawesome/free-solid-svg-icons'; import { library } from "@fortawesome/fontawesome-svg-core"; import { DocumentLinksButton } from "../nodes/DocumentLinksButton"; import { LinkDocPreview } from "../nodes/LinkDocPreview"; -import { isUndefined } from "util"; library.add(faTrash); -- cgit v1.2.3-70-g09d2 From 0416c6d82f7c63ddef636e587f612108e978d8eb Mon Sep 17 00:00:00 2001 From: Melissa Zhang Date: Thu, 6 Aug 2020 13:13:34 -0700 Subject: change WebDocument proportions/width for consistency across drag & drop and new document toolbar --- src/client/util/CurrentUserUtils.ts | 2 +- src/client/views/collections/CollectionSubView.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) (limited to 'src/client/views') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 1f140e145..61edf8fe4 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -421,7 +421,7 @@ export class CurrentUserUtils { { _width: 250, _height: 250, title: "container" }); } if (doc.emptyWebpage === undefined) { - doc.emptyWebpage = Docs.Create.WebDocument("", { title: "webpage", _nativeWidth: 850, _nativeHeight: 962, _width: 600, UseCors: true }); + doc.emptyWebpage = Docs.Create.WebDocument("", { title: "webpage", _nativeWidth: 850, _nativeHeight: 962, _width: 400, UseCors: true }); } if (doc.activeMobileMenu === undefined) { this.setupActiveMobileMenu(doc); diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx index 4025e25f9..0e40cd21c 100644 --- a/src/client/views/collections/CollectionSubView.tsx +++ b/src/client/views/collections/CollectionSubView.tsx @@ -407,8 +407,8 @@ export function CollectionSubView(schemaCtor: (doc: Doc) => T, moreProps?: title: uriList, _width: 400, _height: 315, - _nativeWidth: 600, - _nativeHeight: 472.5 + _nativeWidth: 850, + _nativeHeight: 962 })); return; } -- cgit v1.2.3-70-g09d2 From be30bb49c7bd2370adb97724381f738b479f5469 Mon Sep 17 00:00:00 2001 From: Melissa Zhang Date: Thu, 6 Aug 2020 14:04:31 -0700 Subject: fixed bug where items deleted with backspace key or MarqueeView don't show up in recently closed --- src/client/views/GlobalKeyHandler.ts | 17 ++++++++++++++--- .../collections/collectionFreeForm/MarqueeView.tsx | 12 +++++++++++- 2 files changed, 25 insertions(+), 4 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts index c9f95a538..3a61e89ce 100644 --- a/src/client/views/GlobalKeyHandler.ts +++ b/src/client/views/GlobalKeyHandler.ts @@ -1,6 +1,6 @@ import { action } from "mobx"; import { DateField } from "../../fields/DateField"; -import { Doc, DocListCast } from "../../fields/Doc"; +import { Doc, DocListCast, AclEdit, AclAdmin } from "../../fields/Doc"; import { Id } from "../../fields/FieldSymbols"; import { InkTool } from "../../fields/InkField"; import { List } from "../../fields/List"; @@ -24,6 +24,7 @@ import PDFMenu from "./pdf/PDFMenu"; import { ContextMenu } from "./ContextMenu"; import GroupManager from "../util/GroupManager"; import { CollectionFreeFormViewChrome } from "./collections/CollectionMenu"; +import { GetEffectiveAcl } from "../../fields/util"; const modifiers = ["control", "meta", "shift", "alt"]; type KeyHandler = (keycode: string, e: KeyboardEvent) => KeyControlInfo | Promise; @@ -118,8 +119,18 @@ export default class KeyManager { return { stopPropagation: false, preventDefault: false }; } } - UndoManager.RunInBatch(() => - SelectionManager.SelectedDocuments().map(dv => dv.props.removeDocument?.(dv.props.Document)), "delete"); + + const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; + const selected = SelectionManager.SelectedDocuments().slice(); + UndoManager.RunInBatch(() => { + selected.map(dv => { + const effectiveAcl = GetEffectiveAcl(dv.props.Document); + if (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) { // deletes whatever you have the right to delete + recent && Doc.AddDocToList(recent, "data", dv.props.Document, undefined, true, true); + dv.props.removeDocument?.(dv.props.Document); + } + }); + }, "delete"); SelectionManager.DeselectAll(); break; case "arrowleft": diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index a32c8b363..5f882c990 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -341,8 +341,18 @@ export class MarqueeView extends React.Component { - this.props.removeDocument(this.marqueeSelect(false)); + const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; + const selected = this.marqueeSelect(false); SelectionManager.DeselectAll(); + + selected.map(doc => { + const effectiveAcl = GetEffectiveAcl(doc); + if (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) { // deletes whatever you have the right to delete + recent && Doc.AddDocToList(recent, "data", doc, undefined, true, true); + this.props.removeDocument(doc); + } + }); + this.cleanupInteractions(false); MarqueeOptionsMenu.Instance.fadeOut(true); this.hideMarquee(); -- cgit v1.2.3-70-g09d2 From 002ef9b665ff978cb8c96872ecbbbeca7766de43 Mon Sep 17 00:00:00 2001 From: Melissa Zhang Date: Thu, 6 Aug 2020 14:07:14 -0700 Subject: added undoBatch for MarqueeView delete --- src/client/views/collections/collectionFreeForm/MarqueeView.tsx | 1 + 1 file changed, 1 insertion(+) (limited to 'src/client/views') diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 5f882c990..88fe03efd 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -339,6 +339,7 @@ export class MarqueeView extends React.Component { const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; -- cgit v1.2.3-70-g09d2