From f20dfa857e1651ced1eb2303ea8a8462483fbc4c Mon Sep 17 00:00:00 2001 From: geireann Date: Sun, 12 Sep 2021 10:00:30 -0400 Subject: updates --- src/client/util/CurrentUserUtils.ts | 51 +++++++++++++++++-------------- src/client/views/MainView.tsx | 20 ++++++++++++ src/client/views/collections/TreeView.tsx | 8 ++--- src/client/views/nodes/DocumentView.tsx | 5 +-- 4 files changed, 55 insertions(+), 29 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 56807c63b..760949b57 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -575,11 +575,11 @@ export class CurrentUserUtils { return [ { title: "Dashboards", target: Cast(doc.myDashboards, Doc, null), icon: "desktop", click: 'selectMainMenu(self)' }, { title: "Search", target: Cast(doc.mySearchPanel, Doc, null), icon: "search", click: 'selectMainMenu(self)' }, - { title: "File Manager", target: Cast(doc.myFilesystem, Doc, null), icon: "folder-open", click: 'selectMainMenu(self)' }, + { title: "Files", target: Cast(doc.myFilesystem, Doc, null), icon: "folder-open", click: 'selectMainMenu(self)' }, { title: "Tools", target: Cast(doc.myTools, Doc, null), icon: "wrench", click: 'selectMainMenu(self)', hidden: "IsNoviceMode()" }, - { title: "Uploads", target: Cast(doc.myUploadDocs, Doc, null), icon: "upload", click: 'selectMainMenu(self)' }, + { title: "Imports", target: Cast(doc.myImportDocs, Doc, null), icon: "upload", click: 'selectMainMenu(self)' }, { title: "Recently Closed", target: Cast(doc.myRecentlyClosedDocs, Doc, null), icon: "archive", click: 'selectMainMenu(self)' }, - { title: "Sharing", target: Cast(doc.mySharedDocs, Doc, null), icon: "users", click: 'selectMainMenu(self)', watchedDocuments: doc.mySharedDocs as Doc }, + { title: "Shared with me", target: Cast(doc.mySharedDocs, Doc, null), icon: "users", click: 'selectMainMenu(self)', watchedDocuments: doc.mySharedDocs as Doc }, { title: "Trails", target: Cast(doc.myTrails, Doc, null), icon: "pres-trail", click: 'selectMainMenu(self)' }, { title: "User Doc", target: Cast(doc.myUserDoc, Doc, null), icon: "address-card", click: 'selectMainMenu(self)', hidden: "IsNoviceMode()" }, ]; @@ -807,13 +807,15 @@ export class CurrentUserUtils { // setup dashboards library item await doc.myDashboards; if (doc.myDashboards === undefined) { + const newDashboard = ScriptField.MakeScript(`createNewDashboard(Doc.UserDoc())`); + const newDashboardButton:Doc = Docs.Create.FontIconDocument({ onClick: newDashboard, _forceActive: true, toolTip: "Create new dashboard", _stayInCollection: true, _hideContextMenu: true, title: "new dashboard", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New trail", icon: "plus", system: true }); doc.myDashboards = new PrefetchProxy(Docs.Create.TreeDocument([], { title: "My Dashboards", _showTitle: "title", _height: 400, childHideLinkButton: true, treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias", - treeViewTruncateTitleWidth: 150, ignoreClick: true, - _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", treeViewType: "fileSystem", isFolder: true, system: true + treeViewTruncateTitleWidth: 150, ignoreClick: true, buttonMenu: true, buttonMenuDoc: newDashboardButton, + _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "same", treeViewType: "fileSystem", isFolder: true, system: true, + explainer: "This is your collection of dashboards. A dashboard represents the tab configuration of your workspace. To manage documents as folders, go to the Files." })); - const newDashboard = ScriptField.MakeScript(`createNewDashboard(Doc.UserDoc())`); // const toggleTheme = ScriptField.MakeScript(`Doc.UserDoc().darkScheme = !Doc.UserDoc().darkScheme`); // const toggleComic = ScriptField.MakeScript(`toggleComicMode()`); // const snapshotDashboard = ScriptField.MakeScript(`snapshotDashboard()`); @@ -821,7 +823,7 @@ export class CurrentUserUtils { const removeDashboard = ScriptField.MakeScript('removeDashboard(self)'); (doc.myDashboards as any as Doc).childContextMenuScripts = new List([newDashboard!, shareDashboard!, removeDashboard!]); (doc.myDashboards as any as Doc).childContextMenuLabels = new List(["Create New Dashboard", "Share Dashboard", "Remove Dashboard"]); - (doc.myDashboards as any as Doc).childContextMenuIcons = new List(["plus", "share", "times"]); + (doc.myDashboards as any as Doc).childContextMenuIcons = new List(["plus", "user-friends", "times"]); // (doc.myDashboards as any as Doc).childContextMenuScripts = new List([newDashboard!, toggleTheme!, toggleComic!, snapshotDashboard!, shareDashboard!, removeDashboard!]); // (doc.myDashboards as any as Doc).childContextMenuLabels = new List(["Create New Dashboard", "Toggle Theme Colors", "Toggle Comic Mode", "Snapshot Dashboard", "Share Dashboard", "Remove Dashboard"]); } @@ -832,7 +834,7 @@ export class CurrentUserUtils { await doc.myTrails; if (doc.myTrails === undefined) { const newTrail = ScriptField.MakeScript(`createNewPresentation()`); - const newTrailButton:Doc = Docs.Create.FontIconDocument({ onClick: newTrail, _forceActive: true, toolTip: "New trail", _stayInCollection: true, _hideContextMenu: true, title: "New trail", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New trail", icon: "plus", system: true }); + const newTrailButton:Doc = Docs.Create.FontIconDocument({ onClick: newTrail, _forceActive: true, toolTip: "Create new trail", _stayInCollection: true, _hideContextMenu: true, title: "New trail", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New trail", icon: "plus", system: true }); doc.myTrails = new PrefetchProxy(Docs.Create.TreeDocument([], { title: "My Trails", _showTitle: "title", _height: 100, treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _fitWidth: true, _gridGap: 5, _forceActive: true, childDropAction: "alias", @@ -842,6 +844,7 @@ export class CurrentUserUtils { })); (doc.myTrails as any as Doc).contextMenuScripts = new List([newTrail!]); (doc.myTrails as any as Doc).contextMenuLabels = new List(["Create New Trail"]); + (doc.myTrails as any as Doc).childContextMenuIcons = new List(["plus"]); } return doc.myTrails as any as Doc; } @@ -851,8 +854,8 @@ export class CurrentUserUtils { if (doc.myFilesystem === undefined) { doc.myFileOrphans = Docs.Create.TreeDocument([], { title: "Unfiled", _stayInCollection: true, system: true, isFolder: true }); // doc.myFileRoot = Docs.Create.TreeDocument([], { title: "file root", _stayInCollection: true, system: true, isFolder: true }); - const newFolder = ScriptField.MakeFunction(`doc.makeFolder()`, { doc: doc.myFilesystem })!; - const newFolderButton:Doc = Docs.Create.FontIconDocument({ onClick: newFolder, _forceActive: true, toolTip: "New folder", _stayInCollection: true, _hideContextMenu: true, title: "New folder", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New folder", icon: "folder-plus", system: true }); + const newFolder = ScriptField.MakeFunction(`createNewFolder()`, { scriptContext: "any" })!; + const newFolderButton:Doc = Docs.Create.FontIconDocument({ onClick: newFolder, _forceActive: true, toolTip: "Create new folder", _stayInCollection: true, _hideContextMenu: true, title: "New folder", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New folder", icon: "folder-plus", system: true }); doc.myFilesystem = new PrefetchProxy(Docs.Create.TreeDocument([doc.myFileOrphans as Doc], { title: "My Documents", _showTitle: "title", buttonMenu: true, buttonMenuDoc: newFolderButton, _height: 100, treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias", @@ -861,8 +864,9 @@ export class CurrentUserUtils { _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "proto", system: true, explainer: "This is your file manager where you can create folders to keep track of documents independently of your dashboard." })); - (doc.myTrails as any as Doc).contextMenuScripts = new List([newFolder!]); - (doc.myTrails as any as Doc).contextMenuLabels = new List(["Create new folder"]); + (doc.myFilesystem as any as Doc).contextMenuScripts = new List([newFolder!]); + (doc.myFilesystem as any as Doc).contextMenuLabels = new List(["Create new folder"]); + (doc.myFilesystem as any as Doc).childContextMenuIcons = new List(["plus"]); } return doc.myFilesystem as any as Doc; } @@ -927,7 +931,7 @@ export class CurrentUserUtils { static async setupSidebarButtons(doc: Doc) { CurrentUserUtils.setupSidebarContainer(doc); await CurrentUserUtils.setupToolsBtnPanel(doc); - CurrentUserUtils.setupUploadSidebar(doc); + CurrentUserUtils.setupImportSidebar(doc); CurrentUserUtils.setupDashboards(doc); CurrentUserUtils.setupPresentations(doc); CurrentUserUtils.setupFilesystem(doc); @@ -1194,7 +1198,7 @@ export class CurrentUserUtils { title: "My SharedDocs", childDropAction: "alias", system: true, contentPointerEvents: "all", childLimitHeight: 0, _yMargin: 50, _gridGap: 15, _showTitle: "title", treeViewHideTitle: true, ignoreClick: true, _lockedPosition: true, "acl-Public": SharingPermissions.Augment, "_acl-Public": SharingPermissions.Augment, _chromeHidden: true, boxShadow: "0 0", - explainer: "This is where documents or dashboards that other users have shared with you will appear." + explainer: "This is where documents or dashboards that other users have shared with you will appear. To share a document or dashboard right click and select 'Share'" }, sharingDocumentId + "outer", sharingDocumentId); (sharedDocs as Doc)["acl-Public"] = (sharedDocs as Doc)[DataSym]["acl-Public"] = SharingPermissions.Augment; } @@ -1213,13 +1217,13 @@ export class CurrentUserUtils { } // Import sidebar is where shared documents are contained - static setupUploadSidebar(doc: Doc) { - if (doc.myUploadDocs === undefined) { - const newUploadButton:Doc = Docs.Create.FontIconDocument({ onClick: ScriptField.MakeScript("importDocument()"), _forceActive: true, toolTip: "Upload from computer", _width: 30, _height: 30, _stayInCollection: true, _hideContextMenu: true, title: "Upload", btnType: ButtonType.ClickButton, buttonText: "Upload", icon: "upload", system: true }); - doc.myUploadDocs = new PrefetchProxy(Docs.Create.StackingDocument([], { - title: "My Uploads", _forceActive: true, buttonMenu: true, buttonMenuDoc: newUploadButton, ignoreClick: true, _showTitle: "title", _stayInCollection: true, _hideContextMenu: true, childLimitHeight: 0, + static setupImportSidebar(doc: Doc) { + if (doc.myImportDocs === undefined) { + const newImportButton:Doc = Docs.Create.FontIconDocument({ onClick: ScriptField.MakeScript("importDocument()"), _forceActive: true, toolTip: "Import from computer", _width: 30, _height: 30, _stayInCollection: true, _hideContextMenu: true, title: "Import", btnType: ButtonType.ClickButton, buttonText: "Import", icon: "upload", system: true }); + doc.myImportDocs = new PrefetchProxy(Docs.Create.StackingDocument([], { + title: "My Imports", _forceActive: true, buttonMenu: true, buttonMenuDoc: newImportButton, ignoreClick: true, _showTitle: "title", _stayInCollection: true, _hideContextMenu: true, childLimitHeight: 0, childDropAction: "copy", _autoHeight: true, _yMargin: 50, _gridGap: 15, boxShadow: "0 0", _lockedPosition: true, system: true, _chromeHidden: true, - explainer: "This is where documents that are uploaded into Dash will go." + explainer: "This is where documents that are Imported into Dash will go." })); } } @@ -1322,7 +1326,7 @@ export class CurrentUserUtils { doc.filterDocCount = 0; this.setupDefaultIconTemplates(doc); // creates a set of icon templates triggered by the document deoration icon this.setupDocTemplates(doc); // sets up the template menu of templates - this.setupUploadSidebar(doc); // sets up the import sidebar + this.setupImportSidebar(doc); // sets up the import sidebar this.setupSearchSidebar(doc); // sets up the search sidebar this.setupActiveMobileMenu(doc); // sets up the current mobile menu for Dash Mobile this.setupOverlays(doc); // documents in overlay layer @@ -1449,7 +1453,7 @@ export class CurrentUserUtils { } } } else if (input.files && input.files.length !== 0) { - const importDocs = Cast(Doc.UserDoc().myUploadDocs, Doc, null); + const importDocs = Cast(Doc.UserDoc().myImportDocs, Doc, null); const disposer = OverlayView.ShowSpinner(); DocListCastAsync(importDocs.data).then(async list => { const results = await DocUtils.uploadFilesToDocs(Array.from(input.files || []), {}); @@ -1473,7 +1477,6 @@ export class CurrentUserUtils { } public static createNewDashboard = async (userDoc: Doc, id?: string) => { - const myTrails = await userDoc.myTrails as Doc; const presentation = Doc.MakeCopy(userDoc.emptyPresentation as Doc, true); const dashboards = await Cast(userDoc.myDashboards, Doc) as Doc; const dashboardCount = DocListCast(dashboards.data).length + 1; @@ -1558,6 +1561,8 @@ Scripting.addGlobal(function createNewDashboard() { return CurrentUserUtils.crea "creates a new dashboard when called"); Scripting.addGlobal(function createNewPresentation() { return MainView.Instance.createNewPresentation(); }, "creates a new presentation when called"); +Scripting.addGlobal(function createNewFolder() { return MainView.Instance.createNewFolder(); }, + "creates a new folder in myFiles when called"); Scripting.addGlobal(function links(doc: any) { return new List(LinkManager.Instance.getAllRelatedLinks(doc)); }, "returns all the links to the document or its annotations", "(doc: any)"); Scripting.addGlobal(function importDocument() { return CurrentUserUtils.importDocument(); }, diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index dadf5b390..809c63a45 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -63,6 +63,7 @@ import { PropertiesView } from './PropertiesView'; import { DashboardStyleProvider, DefaultStyleProvider } from './StyleProvider'; import { TopBar } from './topbar/TopBar'; import { RichTextMenu } from './nodes/formattedText/RichTextMenu'; +import { ScriptField } from '../../fields/ScriptField'; const _global = (window /* browser */ || global /* node */) as any; @observer @@ -239,6 +240,25 @@ export class MainView extends React.Component { Doc.AddDocToList(this.userDoc.myTrails as Doc, "data", pres); } + @action + createNewFolder = async () => { + if (!await this.userDoc.myFilesystem) { + this.userDoc.myFileOrphans = Docs.Create.TreeDocument([], { title: "Unfiled", _stayInCollection: true, system: true, isFolder: true }); + const newFolder = ScriptField.MakeFunction(`createNewFolder()`, { scriptContext: "any" })!; + const newFolderButton:Doc = Docs.Create.FontIconDocument({ onClick: newFolder, _forceActive: true, toolTip: "New folder", _stayInCollection: true, _hideContextMenu: true, title: "New folder", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New folder", icon: "folder-plus", system: true }); + this.userDoc.myFilesystem = new PrefetchProxy(Docs.Create.TreeDocument([this.userDoc.myFileOrphans as Doc], { + title: "My Documents", _showTitle: "title", buttonMenu: true, buttonMenuDoc: newFolderButton, _height: 100, + treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias", + treeViewTruncateTitleWidth: 150, ignoreClick: true, + isFolder: true, treeViewType: "fileSystem", childHideLinkButton: true, + _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "proto", system: true, + explainer: "This is your file manager where you can create folders to keep track of documents independently of your dashboard." + })); + } + const folder = Docs.Create.TreeDocument([], { title: "Untitled folder", _stayInCollection: true, isFolder: true }); + Doc.AddDocToList(this.userDoc.myFilesystem as Doc, "data", folder); + } + getPWidth = () => this._panelWidth - this.propertiesWidth(); getPHeight = () => this._panelHeight - (CollectionMenu.Instance?.Pinned ? 35 : 0); getContentsHeight = () => this._panelHeight; diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx index 8cf34ddcc..2727a0af5 100644 --- a/src/client/views/collections/TreeView.tsx +++ b/src/client/views/collections/TreeView.tsx @@ -240,7 +240,7 @@ export class TreeView extends React.Component { } makeFolder = () => { - const folder = Docs.Create.TreeDocument([], { title: "-folder-", _stayInCollection: true, isFolder: true }); + const folder = Docs.Create.TreeDocument([], { title: "Untitled folder", _stayInCollection: true, isFolder: true }); TreeView._editTitleOnLoad = { id: folder[Id], parent: this.props.parentTreeView }; return this.props.addDocument(folder); } @@ -512,9 +512,9 @@ export class TreeView extends React.Component { DocumentViewInternal.SelectAfterContextMenu = true; } contextMenuItems = () => { - const makeFolder = { script: ScriptField.MakeFunction(`scriptContext.makeFolder()`, { scriptContext: "any" })!, label: "New Folder" }; - const openAlias = { script: ScriptField.MakeFunction(`openOnRight(getAlias(self))`)!, label: "Open Alias" }; - const focusDoc = { script: ScriptField.MakeFunction(`DocFocusOrOpen(self)`)!, label: "Focus or Open" }; + const makeFolder = { script: ScriptField.MakeFunction(`scriptContext.makeFolder()`, { scriptContext: "any" })!, icon: "folder-plus", label: "New Folder" }; + const openAlias = { script: ScriptField.MakeFunction(`openOnRight(getAlias(self))`)!, icon: "copy", label: "Open Alias" }; + const focusDoc = { script: ScriptField.MakeFunction(`DocFocusOrOpen(self)`)!, icon: "eye", label: "Focus or Open" }; return [...this.props.contextMenuItems.filter(mi => !mi.filter ? true : mi.filter.script.run({ doc: this.doc })?.result), ... (this.doc.isFolder ? [makeFolder] : Doc.IsSystem(this.doc) ? [] : this.props.treeView.fileSysMode && this.doc === Doc.GetProto(this.doc) ? diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index b2629200d..ebd0211e2 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -49,6 +49,7 @@ import { RadialMenu } from './RadialMenu'; import { ScriptingBox } from "./ScriptingBox"; import { PresBox } from './trails/PresBox'; import React = require("react"); +import { IconProp } from "@fortawesome/fontawesome-svg-core"; const { Howl } = require('howler'); interface Window { @@ -152,7 +153,7 @@ export interface DocumentViewProps extends DocumentViewSharedProps { NativeWidth?: () => number; NativeHeight?: () => number; LayoutTemplate?: () => Opt; - contextMenuItems?: () => { script: ScriptField, label: string }[]; + contextMenuItems?: () => { script: ScriptField, label: string, icon: string }[]; onClick?: () => ScriptField; onDoubleClick?: () => ScriptField; onPointerDown?: () => ScriptField; @@ -672,7 +673,7 @@ export class DocumentViewInternal extends DocComponent cm.addItem({ description: label, event: () => customScripts[i]?.script.run({ documentView: this, this: this.layoutDoc, scriptContext: this.props.scriptContext, self: this.rootDoc }), icon: "sticky-note" })); this.props.contextMenuItems?.().forEach(item => - item.label && cm.addItem({ description: item.label, event: () => item.script.script.run({ this: this.layoutDoc, scriptContext: this.props.scriptContext, self: this.rootDoc }), icon: "sticky-note" })); + item.label && cm.addItem({ description: item.label, event: () => item.script.script.run({ this: this.layoutDoc, scriptContext: this.props.scriptContext, self: this.rootDoc }), icon: item.icon as IconProp })); if (!this.props.Document.isFolder) { const templateDoc = Cast(this.props.Document[StrCast(this.props.Document.layoutKey)], Doc, null); -- cgit v1.2.3-70-g09d2 From ae6791209e821740fc07578ad28a5bd1b46424a1 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Sun, 12 Sep 2021 11:07:31 -0400 Subject: Update FormattedTextBox.scss --- src/client/views/nodes/formattedText/FormattedTextBox.scss | 1 + 1 file changed, 1 insertion(+) (limited to 'src') diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss index 4134e3c67..27817f317 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.scss +++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss @@ -71,6 +71,7 @@ audiotag:hover { //top: calc(50% - 17.5px); // use this to center vertically -- make sure it looks okay for slide views width: 17px; height: 17px; + font-size: 11px; border-radius: 3px; color: white; background: $medium-gray; -- cgit v1.2.3-70-g09d2 From 46211175f05e09efbea684836ba4f636f690a136 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Sun, 12 Sep 2021 11:27:54 -0400 Subject: pres updates --- src/client/util/DocumentManager.ts | 7 ++++--- src/client/views/nodes/trails/PresBox.tsx | 6 +++--- 2 files changed, 7 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index 9e190ad02..02c65ca99 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -158,7 +158,8 @@ export class DocumentManager { closeContextIfNotFound: boolean = false, // after opening a context where the document should be, this determines whether the context should be closed if the Doc isn't actually there originatingDoc: Opt = undefined, // doc that initiated the display of the target odoc finished?: () => void, - originalTarget?: Doc + originalTarget?: Doc, + noSelect?: boolean ): Promise => { originalTarget = originalTarget ?? targetDoc; const getFirstDocView = LightboxView.LightboxDoc ? DocumentManager.Instance.getLightboxDocumentView : DocumentManager.Instance.getFirstDocumentView; @@ -172,7 +173,7 @@ export class DocumentManager { } } else { targetDoc.hidden && (targetDoc.hidden = undefined); - docView?.select(false); + !noSelect && docView?.select(false); } finished?.(); return false; @@ -222,7 +223,7 @@ export class DocumentManager { retryDocView.props.focus(targetDoc, { willZoom, afterFocus: (didFocus: boolean) => new Promise(res => { - focusAndFinish(didFocus); + !noSelect && focusAndFinish(didFocus); res(); }) }); // focus on the target in the context diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx index 1abe26c20..90620d765 100644 --- a/src/client/views/nodes/trails/PresBox.tsx +++ b/src/client/views/nodes/trails/PresBox.tsx @@ -401,11 +401,11 @@ export class PresBox extends ViewBoxBaseComponent LightboxView.SetLightboxDoc(targetDoc); } else if (curDoc.presMovement === PresMovement.Pan && targetDoc) { LightboxView.SetLightboxDoc(undefined); - await DocumentManager.Instance.jumpToDocument(targetDoc, false, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right + await DocumentManager.Instance.jumpToDocument(targetDoc, false, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection, undefined, true); // documents open in new tab instead of on right } else if ((curDoc.presMovement === PresMovement.Zoom || curDoc.presMovement === PresMovement.Jump) && targetDoc) { LightboxView.SetLightboxDoc(undefined); //awaiting jump so that new scale can be found, since jumping is async - await DocumentManager.Instance.jumpToDocument(targetDoc, true, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection); // documents open in new tab instead of on right + await DocumentManager.Instance.jumpToDocument(targetDoc, true, openInTab, srcContext, undefined, undefined, undefined, includesDoc || tab ? undefined : resetSelection, undefined, true); // documents open in new tab instead of on right } // 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. @@ -1220,7 +1220,7 @@ export class PresBox extends ViewBoxBaseComponent this.setDurationTime(e.target.value))} /> s - +
this.setDurationTime(String(duration), 1000))}> -- cgit v1.2.3-70-g09d2 From 6ff09d4523d2e754812ca4d53dea98f367c28d35 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Sun, 12 Sep 2021 11:36:14 -0400 Subject: Update FontIconBox.scss --- src/client/views/nodes/button/FontIconBox.scss | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/button/FontIconBox.scss b/src/client/views/nodes/button/FontIconBox.scss index a2da35fe1..079c767b9 100644 --- a/src/client/views/nodes/button/FontIconBox.scss +++ b/src/client/views/nodes/button/FontIconBox.scss @@ -342,14 +342,18 @@ } &.editableText { - cursor: pointer; - background: transparent; + cursor: text; + display: flex; + flex-direction: row; + gap: 5px; + padding-left: 10px; + justify-content: flex-start; + color: black; + background-color: $light-gray; + padding: 5px; + padding-left: 10px; width: 100%; height: 100%; - - &:hover { - background-color: $close-red; - } } &.drpDownBtn { -- cgit v1.2.3-70-g09d2 From 99900d41d57f7fb7fe96ebdae47bb3ec5265a2bd Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Sun, 12 Sep 2021 11:46:48 -0400 Subject: Update DocumentButtonBar.tsx --- src/client/views/DocumentButtonBar.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx index 5640e5132..b786b75bd 100644 --- a/src/client/views/DocumentButtonBar.tsx +++ b/src/client/views/DocumentButtonBar.tsx @@ -198,12 +198,16 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV } @computed get pinButton() { + const pin = () => { + // undoBatch(e => this.props.views().map(view => view && TabDocView.PinDoc(view.props.Document, { setPosition: e.shiftKey ? true : undefined }))) + undoBatch(e => this.props.views().map(view => view && this.pinWithView(view.props.Document)) + } const targetDoc = this.view0?.props.Document; return !targetDoc ? (null) : {SelectionManager.Views().length > 1 ? "Pin multiple documents to presentation" : "Pin to presentation"}
}>
this.props.views().map(view => view && TabDocView.PinDoc(view.props.Document, { setPosition: e.shiftKey ? true : undefined })))}> + onClick={pin}>
; -- cgit v1.2.3-70-g09d2 From c23f6604e96e9411b4a4218cdb10a4cc93065568 Mon Sep 17 00:00:00 2001 From: Geireann Lindfield Roberts <60007097+geireann@users.noreply.github.com> Date: Sun, 12 Sep 2021 11:49:30 -0400 Subject: Update DocumentButtonBar.tsx --- src/client/views/DocumentButtonBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx index b786b75bd..e75693d0e 100644 --- a/src/client/views/DocumentButtonBar.tsx +++ b/src/client/views/DocumentButtonBar.tsx @@ -200,7 +200,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV get pinButton() { const pin = () => { // undoBatch(e => this.props.views().map(view => view && TabDocView.PinDoc(view.props.Document, { setPosition: e.shiftKey ? true : undefined }))) - undoBatch(e => this.props.views().map(view => view && this.pinWithView(view.props.Document)) + undoBatch(e => this.props.views().map(view => view && this.pinWithView(view.props.Document))) } const targetDoc = this.view0?.props.Document; return !targetDoc ? (null) : Date: Sun, 12 Sep 2021 12:47:10 -0400 Subject: updates pres so it works --- src/client/util/CurrentUserUtils.ts | 8 ++++---- src/client/util/DocumentManager.ts | 2 +- src/client/views/DocumentButtonBar.tsx | 6 +----- src/client/views/MarqueeAnnotator.tsx | 2 +- src/client/views/nodes/button/FontIconBox.tsx | 23 ++++++++-------------- .../views/nodes/formattedText/RichTextMenu.tsx | 14 +++++++++++-- src/client/views/nodes/trails/PresBox.tsx | 2 -- 7 files changed, 27 insertions(+), 30 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index a68c0fbc2..9a5ccffa0 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -807,7 +807,7 @@ export class CurrentUserUtils { await doc.myDashboards; if (doc.myDashboards === undefined) { const newDashboard = ScriptField.MakeScript(`createNewDashboard(Doc.UserDoc())`); - const newDashboardButton:Doc = Docs.Create.FontIconDocument({ onClick: newDashboard, _forceActive: true, toolTip: "Create new dashboard", _stayInCollection: true, _hideContextMenu: true, title: "new dashboard", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New trail", icon: "plus", system: true }); + const newDashboardButton: Doc = Docs.Create.FontIconDocument({ onClick: newDashboard, _forceActive: true, toolTip: "Create new dashboard", _stayInCollection: true, _hideContextMenu: true, title: "new dashboard", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New trail", icon: "plus", system: true }); doc.myDashboards = new PrefetchProxy(Docs.Create.TreeDocument([], { title: "My Dashboards", _showTitle: "title", _height: 400, childHideLinkButton: true, treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias", @@ -1219,7 +1219,7 @@ export class CurrentUserUtils { // Import sidebar is where shared documents are contained static setupImportSidebar(doc: Doc) { if (doc.myImportDocs === undefined) { - const newImportButton:Doc = Docs.Create.FontIconDocument({ onClick: ScriptField.MakeScript("importDocument()"), _forceActive: true, toolTip: "Import from computer", _width: 30, _height: 30, _stayInCollection: true, _hideContextMenu: true, title: "Import", btnType: ButtonType.ClickButton, buttonText: "Import", icon: "upload", system: true }); + const newImportButton: Doc = Docs.Create.FontIconDocument({ onClick: ScriptField.MakeScript("importDocument()"), _forceActive: true, toolTip: "Import from computer", _width: 30, _height: 30, _stayInCollection: true, _hideContextMenu: true, title: "Import", btnType: ButtonType.ClickButton, buttonText: "Import", icon: "upload", system: true }); doc.myImportDocs = new PrefetchProxy(Docs.Create.StackingDocument([], { title: "My Imports", _forceActive: true, buttonMenu: true, buttonMenuDoc: newImportButton, ignoreClick: true, _showTitle: "title", _stayInCollection: true, _hideContextMenu: true, childLimitHeight: 0, childDropAction: "copy", _autoHeight: true, _yMargin: 50, _gridGap: 15, boxShadow: "0 0", _lockedPosition: true, system: true, _chromeHidden: true, @@ -1519,9 +1519,9 @@ export class CurrentUserUtils { CurrentUserUtils.openDashboard(userDoc, dashboardDoc); } - public static GetNewTextDoc(title: string, x: number, y: number, width?: number, height?: number, noMargins?: boolean, annotationOn?: Doc, maxHeight?: number) { + public static GetNewTextDoc(title: string, x: number, y: number, width?: number, height?: number, noMargins?: boolean, annotationOn?: Doc, maxHeight?: number, backgroundColor?: string) { const tbox = Docs.Create.TextDocument("", { - _xMargin: noMargins ? 0 : undefined, _yMargin: noMargins ? 0 : undefined, annotationOn, docMaxAutoHeight: maxHeight, + _xMargin: noMargins ? 0 : undefined, _yMargin: noMargins ? 0 : undefined, annotationOn, docMaxAutoHeight: maxHeight, backgroundColor: backgroundColor, _width: width || 200, _height: height || 100, x: x, y: y, _fitWidth: true, _autoHeight: true, _fontSize: StrCast(Doc.UserDoc().fontSize), _fontFamily: StrCast(Doc.UserDoc().fontFamily), title }); diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index 02c65ca99..dfec9823b 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -190,7 +190,7 @@ export class DocumentManager { annoContainerView.focus(targetDoc); // this allows something like a PDF view to remove its doc filters to expose the target so that it can be found in the retry code below } if (focusView) { - Doc.linkFollowHighlight(focusView.rootDoc); + !noSelect && Doc.linkFollowHighlight(focusView.rootDoc); //TODO:glr make this a setting in PresBox focusView.focus(targetDoc, { originalTarget, willZoom, afterFocus: (didFocus: boolean) => new Promise(res => { diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx index e75693d0e..7f428a881 100644 --- a/src/client/views/DocumentButtonBar.tsx +++ b/src/client/views/DocumentButtonBar.tsx @@ -198,16 +198,12 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV } @computed get pinButton() { - const pin = () => { - // undoBatch(e => this.props.views().map(view => view && TabDocView.PinDoc(view.props.Document, { setPosition: e.shiftKey ? true : undefined }))) - undoBatch(e => this.props.views().map(view => view && this.pinWithView(view.props.Document))) - } const targetDoc = this.view0?.props.Document; return !targetDoc ? (null) : {SelectionManager.Views().length > 1 ? "Pin multiple documents to presentation" : "Pin to presentation"}
}>
+ onClick={undoBatch(e => this.props.views().map(view => view && this.pinWithView(view.props.Document)))}>
; diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx index eee365ed8..26e76090a 100644 --- a/src/client/views/MarqueeAnnotator.tsx +++ b/src/client/views/MarqueeAnnotator.tsx @@ -81,7 +81,7 @@ export class MarqueeAnnotator extends React.Component { return annoDoc; }; const targetCreator = (annotationOn: Doc | undefined) => { - const target = CurrentUserUtils.GetNewTextDoc("Note linked to " + this.props.rootDoc.title, 0, 0, 100, 100, undefined, annotationOn); + const target = CurrentUserUtils.GetNewTextDoc("Note linked to " + this.props.rootDoc.title, 0, 0, 100, 100, undefined, annotationOn, undefined, "yellow"); FormattedTextBox.SelectOnLoad = target[Id]; return target; }; diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index b1d74261b..fb96969c5 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -522,7 +522,6 @@ export class FontIconBox extends DocComponent(Fon // button = break; case ButtonType.EditableText: - console.log("Editable text"); button = this.editableText; break; case ButtonType.NumberButton: @@ -592,7 +591,6 @@ Scripting.addGlobal(function setBackgroundColor(color?: string, checkResult?: bo const selected = SelectionManager.Docs().lastElement(); if (checkResult) { if (selected) { - console.log("[Background] (selected): " + StrCast(selected._backgroundColor)); return selected._backgroundColor; } else { return "#FFFFFF"; @@ -685,14 +683,12 @@ Scripting.addGlobal(function setBulletList(mapStyle: "bullet" | "decimal", check const editorView = RichTextMenu.Instance?.TextView?.EditorView; if (checkResult) { const active = editorView?.state && RichTextMenu.Instance.getActiveListStyle(); - console.log(active, mapStyle); if (active === mapStyle) return Colors.MEDIUM_BLUE; else return "transparent"; } if (editorView) { const active = editorView?.state && RichTextMenu.Instance.getActiveListStyle(); if (active === mapStyle) { - console.log("set bullet list"); editorView?.state && RichTextMenu.Instance.changeListType(editorView.state.schema.nodes.ordered_list.create({ mapStyle: "" })); } else { editorView?.state && RichTextMenu.Instance.changeListType(editorView.state.schema.nodes.ordered_list.create({ mapStyle: mapStyle })); @@ -707,10 +703,8 @@ Scripting.addGlobal(function setFontColor(color?: string, checkResult?: boolean) if (checkResult) { if (selected) { - console.log("[Font color] (selected): " + StrCast(selected._fontColor)); return selected._fontColor; } else { - console.log("[Font color] (global): " + StrCast(Doc.UserDoc()._fontColor)); return Doc.UserDoc()._fontColor; } } @@ -760,12 +754,16 @@ Scripting.addGlobal(function setFontSize(size: string, checkResult?: boolean) { Scripting.addGlobal(function toggleBold(checkResult?: boolean) { if (checkResult) { - if (Doc.UserDoc().bold) return Colors.MEDIUM_BLUE; + const editorView = RichTextMenu.Instance.TextView?.EditorView; + if (editorView) { + const bold: boolean = editorView?.state && RichTextMenu.Instance.getBoldStatus(); + if (bold) return Colors.MEDIUM_BLUE; + else return "transparent"; + } else return "transparent"; } const editorView = RichTextMenu.Instance.TextView?.EditorView; if (editorView) { - console.log("editorView"); editorView?.state && RichTextMenu.Instance.toggleBold(editorView, true); } SelectionManager.Docs().filter(doc => StrCast(doc.type) === DocumentType.RTF).map(doc => doc.bold = !doc.bold); @@ -775,12 +773,10 @@ Scripting.addGlobal(function toggleBold(checkResult?: boolean) { Scripting.addGlobal(function toggleUnderline(checkResult?: boolean) { if (checkResult) { - if (Doc.UserDoc().underline) return Colors.MEDIUM_BLUE; - else return "transparent"; + return "transparent"; } const editorView = RichTextMenu.Instance.TextView?.EditorView; if (editorView) { - console.log("editorView"); editorView?.state && RichTextMenu.Instance.toggleUnderline(editorView, true); } SelectionManager.Docs().filter(doc => StrCast(doc.type) === DocumentType.RTF).map(doc => doc.underline = !doc.underline); @@ -790,12 +786,10 @@ Scripting.addGlobal(function toggleUnderline(checkResult?: boolean) { Scripting.addGlobal(function toggleItalic(checkResult?: boolean) { if (checkResult) { - if (Doc.UserDoc().italic) return Colors.MEDIUM_BLUE; - else return "transparent"; + return "transparent"; } const editorView = RichTextMenu.Instance.TextView?.EditorView; if (editorView) { - console.log("editorView"); editorView?.state && RichTextMenu.Instance.toggleItalic(editorView, true); } SelectionManager.Docs().filter(doc => StrCast(doc.type) === DocumentType.RTF).map(doc => doc.italic = !doc.italic); @@ -909,7 +903,6 @@ Scripting.addGlobal(function webBack() { **/ Scripting.addGlobal(function toggleSchemaPreview(checkResult?: boolean) { const selected = SelectionManager.Docs().lastElement(); - console.log(selected && selected.title); if (checkResult && selected) { const result: boolean = NumCast(selected.schemaPreviewWidth) > 0; if (result) return Colors.MEDIUM_BLUE; diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx index 3919fbf94..86f2810ab 100644 --- a/src/client/views/nodes/formattedText/RichTextMenu.tsx +++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx @@ -142,6 +142,18 @@ export class RichTextMenu extends AntimodeMenu { } } + getBoldStatus() { + if (this.view && this.TextView.props.isSelected(true)) { + const path = (this.view.state.selection.$from as any).path; + for (let i = path.length - 3; i < path.length && i >= 0; i -= 3) { + if (path[i]?.type === this.view.state.schema.nodes.paragraph || path[i]?.type === this.view.state.schema.nodes.heading) { + console.log(path[i].attrs); + return path[i].attrs.strong; + } + } + } + } + // finds font sizes and families in selection getActiveAlignment() { if (this.view && this.TextView.props.isSelected(true)) { @@ -208,7 +220,6 @@ export class RichTextMenu extends AntimodeMenu { const found = new Set(); const { from, to } = state.selection as TextSelection; state.doc.nodesBetween(from, to, (node) => node.marks.forEach(m => found.add(m))); - console.log("Marks: " + found); return found; } @@ -590,7 +601,6 @@ export class RichTextMenu extends AntimodeMenu { @undoBatch makeLinkToURL = (target: string, lcoation: string) => { ((this.view as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target); - console.log((this.view as any)?.TextView); } @undoBatch diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx index 90620d765..add84ff83 100644 --- a/src/client/views/nodes/trails/PresBox.tsx +++ b/src/client/views/nodes/trails/PresBox.tsx @@ -413,8 +413,6 @@ export class PresBox extends ViewBoxBaseComponent // if targetDoc is not displayed but one of its aliases is, then we need to modify that alias, not the original target this.navigateToView(targetDoc, activeItem); } - // TODO: Add progressivize for navigating web (storing websites for given frames) - } /** -- cgit v1.2.3-70-g09d2 From 6352c67a2eb361efad6a3dea81c9558d93bfc490 Mon Sep 17 00:00:00 2001 From: kimdahey Date: Sun, 12 Sep 2021 13:08:18 -0400 Subject: fixed audiobox --- src/client/views/nodes/AudioBox.scss | 364 ++++++++++++++++++----------------- src/client/views/nodes/AudioBox.tsx | 134 +++++++------ 2 files changed, 257 insertions(+), 241 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/AudioBox.scss b/src/client/views/nodes/AudioBox.scss index ac2b19fd6..a6494e540 100644 --- a/src/client/views/nodes/AudioBox.scss +++ b/src/client/views/nodes/AudioBox.scss @@ -3,202 +3,220 @@ .audiobox-container, .audiobox-container-interactive { - width: 100%; - height: 100%; - position: inherit; - display: flex; - position: relative; - cursor: default; - - .audiobox-buttons { - display: flex; - width: 100%; - align-items: center; - height: 100%; - - .audiobox-dictation { - position: relative; - width: 30px; - height: 100%; - align-items: center; - display: inherit; - background: $medium-gray; - left: 0px; - color: $dark-gray; - &:hover { - color: $black; - cursor: pointer; - } - } - } - - .audiobox-control, - .audiobox-control-interactive { - top: 0; - max-height: 32px; - width: 100%; - display: inline-block; - pointer-events: none; - } - - .audiobox-control-interactive { - pointer-events: all; - } - - .audiobox-record-interactive, - .audiobox-record { - pointer-events: all; width: 100%; height: 100%; + position: inherit; + display: flex; position: relative; - } + cursor: default; - .audiobox-record { - pointer-events: none; - } + .audiobox-buttons { + display: flex; + width: 100%; + align-items: center; + height: 100%; + + .audiobox-dictation { + position: relative; + width: 30px; + height: 100%; + align-items: center; + display: inherit; + background: $medium-gray; + left: 0px; + color: $dark-gray; + + &:hover { + color: $black; + cursor: pointer; + } + } + } - .recording { - margin-top: auto; - margin-bottom: auto; - width: 100%; - height: 100%; - position: relative; - padding-right: 5px; - display: flex; - background-color: $medium-blue; - - .time { - position: relative; - height: 100%; - width: 100%; - font-size: $large-header; - text-align: center; - top: 5; + .audiobox-control, + .audiobox-control-interactive { + top: 0; + max-height: 32px; + width: 100%; + display: inline-block; + pointer-events: none; } - .buttons { - position: relative; - margin-top: auto; - margin-bottom: auto; - width: 25px; - width: 25px; - padding: 5px; - color: $dark-gray; - &:hover { - color: $black; - } + .audiobox-control-interactive { + pointer-events: all; } - } - .audiobox-controls { - width: 100%; - height: 100%; - position: relative; - display: flex; - background: $dark-gray; + .audiobox-record-interactive, + .audiobox-record { + pointer-events: all; + cursor: pointer; + width: 100%; + height: 100%; + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 10px; + color: white; + font-weight: bold; + } - .audiobox-dictation { - position: absolute; - width: 40px; - height: 100%; - align-items: center; - display: inherit; - background: $medium-gray; - left: 0px; + .audiobox-record { + pointer-events: none; } - .audiobox-player { - margin-top: auto; - margin-bottom: auto; - width: 100%; - position: relative; - padding-right: 5px; - display: flex; - flex-direction: column; - justify-content: center; - - .audiobox-buttons { - position: relative; + .recording { margin-top: auto; margin-bottom: auto; - width: 30px; - height: 30px; - border-radius: 50%; - background-color: $dark-gray; - color: $white; + width: 100%; + height: 100%; + position: relative; + padding-right: 5px; display: flex; - align-items: center; + flex-direction: row; justify-content: center; - left: 5px; - &:hover { - background-color: $black; + align-items: center; + gap: 7px; + background-color: $medium-blue; + padding: 10px; + + .time { + position: relative; + height: 100%; + width: 100%; + font-size: 16px; + text-align: center; + display: flex; + justify-content: center; + align-items: center; + font-weight: bold; } - svg { - width: 100%; - position: absolute; - border-width: "thin"; - border-color: "white"; + .buttons { + cursor: pointer; + position: relative; + margin-top: auto; + margin-bottom: auto; + width: 25px; + width: 25px; + padding: 5px; + color: $dark-gray; + + &:hover { + color: $black; + } } - } + } - .audiobox-dictation { + .audiobox-controls { + width: 100%; + height: 100%; position: relative; - margin-top: auto; - margin-bottom: auto; - width: 25px; - align-items: center; - display: inherit; - background: $medium-gray; - } + display: flex; + background: $dark-gray; + + .audiobox-dictation { + position: absolute; + width: 40px; + height: 100%; + align-items: center; + display: inherit; + background: $medium-gray; + left: 0px; + } - .audiobox-timeline { - position: absolute; - width: 100%; - z-index: 1000; - overflow: hidden; - border-right: 5px solid black; - } - - .audioBox-total-time, - .audioBox-current-time { - position: absolute; - font-size: $small-text; - top: 100%; - color: $white; - } - .audioBox-current-time { - left: 42px; - } - - .audioBox-total-time { - right: 2px; - } + .audiobox-player { + margin-top: auto; + margin-bottom: auto; + width: 100%; + position: relative; + padding-right: 5px; + display: flex; + flex-direction: column; + justify-content: center; + + .audiobox-buttons { + position: relative; + margin-top: auto; + margin-bottom: auto; + width: 30px; + height: 30px; + border-radius: 50%; + background-color: $dark-gray; + color: $white; + display: flex; + align-items: center; + justify-content: center; + left: 5px; + + &:hover { + background-color: $black; + } + + svg { + width: 100%; + position: absolute; + border-width: "thin"; + border-color: "white"; + } + } + + .audiobox-dictation { + position: relative; + margin-top: auto; + margin-bottom: auto; + width: 25px; + align-items: center; + display: inherit; + background: $medium-gray; + } + + .audiobox-timeline { + position: absolute; + width: 100%; + z-index: 1000; + overflow: hidden; + border-right: 5px solid black; + } + + .audioBox-total-time, + .audioBox-current-time { + position: absolute; + font-size: $small-text; + top: 100%; + color: $white; + } + + .audioBox-current-time { + left: 42px; + } + + .audioBox-total-time { + right: 2px; + } + } } - } } @media only screen and (max-device-width: 480px) { - .audiobox-dictation { - font-size: 5em; - display: flex; - width: 100; - justify-content: center; - flex-direction: column; - align-items: center; - } - - .audiobox-container .audiobox-record, - .audiobox-container-interactive .audiobox-record { - font-size: 3em; - } - - .audiobox-container .audiobox-controls .audiobox-player .audiobox-buttons, - .audiobox-container .audiobox-controls .audiobox-player .audiobox-dictation, - .audiobox-container-interactive - .audiobox-controls - .audiobox-player - .audiobox-buttons { - width: 70px; - } -} + .audiobox-dictation { + font-size: 5em; + display: flex; + width: 100; + justify-content: center; + flex-direction: column; + align-items: center; + } + + .audiobox-container .audiobox-record, + .audiobox-container-interactive .audiobox-record { + font-size: 3em; + } + + .audiobox-container .audiobox-controls .audiobox-player .audiobox-buttons, + .audiobox-container .audiobox-controls .audiobox-player .audiobox-dictation, + .audiobox-container-interactive .audiobox-controls .audiobox-player .audiobox-buttons { + width: 70px; + } +} \ No newline at end of file diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx index 8962d29f0..cdb37bf92 100644 --- a/src/client/views/nodes/AudioBox.tsx +++ b/src/client/views/nodes/AudioBox.tsx @@ -336,8 +336,8 @@ export class AudioBox extends ViewBoxAnnotatableComponent< (this.layoutDoc.dontAutoPlayFollowedLinks ? "" : "Don't") + " play when link is selected", event: () => - (this.layoutDoc.dontAutoPlayFollowedLinks = - !this.layoutDoc.dontAutoPlayFollowedLinks), + (this.layoutDoc.dontAutoPlayFollowedLinks = + !this.layoutDoc.dontAutoPlayFollowedLinks), icon: "expand-arrows-alt", }); funcs.push({ @@ -605,10 +605,7 @@ export class AudioBox extends ViewBoxAnnotatableComponent<
) : ( -
- RECORD -
- )} +
+ + RECORD +
+ )} ) : ( +
+
-
-
- {" "} - -
-
- -
-
- {this.renderTimeline} -
- {this.audio} -
- {this._trimming ? - formatTime(Math.round(NumCast(this.layoutDoc._currentTimecode))) - : formatTime(Math.round(NumCast(this.layoutDoc._currentTimecode) - NumCast(this._trimStart)))} -
-
- {this._trimming || !this._trimEnd ? - formatTime(Math.round(NumCast(this.duration))) - : formatTime(Math.round(NumCast(this.trimDuration)))} -
+ {" "} + +
+
+ +
+
+ {this.renderTimeline} +
+ {this.audio} +
+ {this._trimming ? + formatTime(Math.round(NumCast(this.layoutDoc._currentTimecode))) + : formatTime(Math.round(NumCast(this.layoutDoc._currentTimecode) - NumCast(this._trimStart)))} +
+
+ {this._trimming || !this._trimEnd ? + formatTime(Math.round(NumCast(this.duration))) + : formatTime(Math.round(NumCast(this.trimDuration)))}
- )} +
+ )}
); } -- cgit v1.2.3-70-g09d2 From f63b9d0876dc6a4389d1a9ced314968804061cb3 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 11:56:55 -0400 Subject: fixed unfreezing (allow reflowing) of webBox's. fixed initial size of text annotation box. --- src/client/views/DocumentDecorations.tsx | 15 +++++++------ src/client/views/nodes/WebBox.tsx | 26 +++++++++++++--------- .../views/nodes/formattedText/FormattedTextBox.tsx | 8 +++++-- 3 files changed, 30 insertions(+), 19 deletions(-) (limited to 'src') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index a570bdb34..8bc167079 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -319,11 +319,12 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b let height = (doc._height || (nheight / nwidth * width)); height = !height || isNaN(height) ? 20 : height; const scale = docView.props.ScreenToLocalTransform().Scale; + const canModifyNativeDim = e.ctrlKey || doc.allowReflow; if (nwidth && nheight) { if (nwidth / nheight !== width / height && !dragBottom) { height = nheight / nwidth * width; } - if (e.ctrlKey && !dragBottom) { // ctrl key enables modification of the nativeWidth or nativeHeight durin the interaction + if (canModifyNativeDim && !dragBottom) { // ctrl key enables modification of the nativeWidth or nativeHeight durin the interaction if (Math.abs(dW) > Math.abs(dH)) dH = dW * nheight / nwidth; else dW = dH * nwidth / nheight; } @@ -333,7 +334,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b doc.x = (doc.x || 0) + dX * (actualdW - width); doc.y = (doc.y || 0) + dY * (actualdH - height); const fixedAspect = (nwidth && nheight); - if (e.ctrlKey && [DocumentType.IMG, DocumentType.SCREENSHOT, DocumentType.VID].includes(doc.type as DocumentType)) { + if (canModifyNativeDim && [DocumentType.IMG, DocumentType.SCREENSHOT, DocumentType.VID].includes(doc.type as DocumentType)) { dW !== 0 && runInAction(() => { const dataDoc = doc[DataSym]; const nw = Doc.NativeWidth(dataDoc); @@ -343,22 +344,22 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b }); } else if (fixedAspect) { - if ((Math.abs(dW) > Math.abs(dH) && (!dragBottom || !e.ctrlKey)) || dragRight) { - if (dragRight && e.ctrlKey) { + if ((Math.abs(dW) > Math.abs(dH) && (!dragBottom || !canModifyNativeDim)) || dragRight) { + if (dragRight && canModifyNativeDim) { doc._nativeWidth = actualdW / (doc._width || 1) * Doc.NativeWidth(doc); } else { if (!doc._fitWidth) doc._height = nheight / nwidth * actualdW; - else if (!e.ctrlKey || dragBotRight) doc._height = actualdH; + else if (!canModifyNativeDim || dragBotRight) doc._height = actualdH; } doc._width = actualdW; } else { - if (dragBottom && (e.ctrlKey || docView.layoutDoc._fitWidth)) { // frozen web pages and others that fitWidth can't grow horizontally to match a vertical resize so the only choice is to change the nativeheight even if the ctrl key isn't used + if (dragBottom && (canModifyNativeDim || docView.layoutDoc._fitWidth)) { // frozen web pages and others that fitWidth can't grow horizontally to match a vertical resize so the only choice is to change the nativeheight even if the ctrl key isn't used doc._nativeHeight = actualdH / (doc._height || 1) * Doc.NativeHeight(doc); doc._autoHeight = false; } else { if (!doc._fitWidth) doc._width = nwidth / nheight * actualdH; - else if (!e.ctrlKey || dragBotRight) doc._width = actualdW; + else if (!canModifyNativeDim || dragBotRight) doc._width = actualdW; } doc._height = actualdH; } diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx index 7e46d8433..adf84d810 100644 --- a/src/client/views/nodes/WebBox.tsx +++ b/src/client/views/nodes/WebBox.tsx @@ -69,13 +69,10 @@ export class WebBox extends ViewBoxAnnotatableComponent([this._url]); else this.dataDoc[this.fieldKey + "-future"] = new List([...future, this._url]); this.dataDoc[this.fieldKey] = new WebField(new URL(history.pop()!)); + console.log(this._urlHash); return true; } return false; } static urlHash = (s: string) => { - return s.split('').reduce((a: any, b: any) => { a = ((a << 5) - a) + b.charCodeAt(0); return a & a; }, 0); + return Math.abs(s.split('').reduce((a: any, b: any) => { a = ((a << 5) - a) + b.charCodeAt(0); return a & a; }, 0)); } @action @@ -397,7 +395,15 @@ export class WebBox extends ViewBoxAnnotatableComponent this.layoutDoc.useCors = !this.layoutDoc.useCors, icon: "snowflake" }); - funcs.push({ description: (this.layoutDoc[this.fieldKey + "-contentWidth"] ? "Unfreeze" : "Freeze") + " Content Width", event: () => this.layoutDoc[this.fieldKey + "-contentWidth"] = this.layoutDoc[this.fieldKey + "-contentWidth"] ? undefined : Doc.NativeWidth(this.layoutDoc), icon: "snowflake" }); + funcs.push({ + description: (!this.layoutDoc.allowReflow ? "Allow" : "Prevent") + " Reflow", event: () => { + const nw = !this.layoutDoc.allowReflow ? undefined : Doc.NativeWidth(this.layoutDoc) - this.sidebarWidth() / (this.props.scaling?.() || 1); + this.layoutDoc.allowReflow = !nw; + if (nw) { + Doc.SetInPlace(this.layoutDoc, this.fieldKey + "-nativeWidth", nw, true); + } + }, icon: "snowflake" + }); funcs.push({ description: "Toggle Annotation View ", event: () => this.Document._showSidebar = !this.Document._showSidebar, icon: "expand-arrows-alt" }); cm.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" }); } @@ -487,7 +493,7 @@ export class WebBox extends ViewBoxAnnotatableComponent + style={{ width: !this.layoutDoc.allowReflow ? NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]) || `100%` : "100%", }}> {this.urlContent}
; } diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index e7a44f113..4b540312e 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -818,11 +818,15 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp this._disposers.breakupDictation = reaction(() => DocumentManager.Instance.RecordingEvent, this.breakupDictation); this._disposers.autoHeight = reaction(() => this.autoHeight, autoHeight => autoHeight && this.tryUpdateScrollHeight()); this._disposers.scrollHeight = reaction(() => ({ scrollHeight: this.scrollHeight, autoHeight: this.autoHeight, width: NumCast(this.layoutDoc._width) }), - ({ width, scrollHeight, autoHeight }) => width && autoHeight && this.resetNativeHeight(scrollHeight) + ({ width, scrollHeight, autoHeight }) => { + width && autoHeight && this.resetNativeHeight(scrollHeight); + }, { fireImmediately: true } ); this._disposers.componentHeights = reaction( // set the document height when one of the component heights changes and autoHeight is on () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, autoHeight: this.autoHeight, marginsHeight: this.autoHeightMargins }), - ({ sidebarHeight, textHeight, autoHeight, marginsHeight }) => autoHeight && this.props.setHeight(marginsHeight + Math.max(sidebarHeight, textHeight))); + ({ sidebarHeight, textHeight, autoHeight, marginsHeight }) => { + autoHeight && this.props.setHeight(marginsHeight + Math.max(sidebarHeight, textHeight)); + }, { fireImmediately: true }); this._disposers.links = reaction(() => DocListCast(this.Document.links), // if a link is deleted, then remove all hyperlinks that reference it from the text's marks newLinks => { this._cachedLinks.forEach(l => !newLinks.includes(l) && this.RemoveLinkFromDoc(l)); -- cgit v1.2.3-70-g09d2 From 8e5357cd2ebfaad88c82ffde2415426fa9d130c0 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 13:34:05 -0400 Subject: auto-select regions on audio timelines after they are created. --- src/client/views/collections/CollectionStackedTimeline.tsx | 4 +++- src/client/views/nodes/PDFBox.tsx | 1 - src/client/views/nodes/WebBox.tsx | 1 - 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx index d98d966d8..0fc66445a 100644 --- a/src/client/views/collections/CollectionStackedTimeline.tsx +++ b/src/client/views/collections/CollectionStackedTimeline.tsx @@ -43,6 +43,7 @@ import { import { LabelBox } from "../nodes/LabelBox"; import "./CollectionStackedTimeline.scss"; import { Colors } from "../global/globalEnums"; +import { DocumentManager } from "../../util/DocumentManager"; type PanZoomDocument = makeInterface<[]>; const PanZoomDocument = makeInterface(); @@ -246,7 +247,7 @@ export class CollectionStackedTimeline extends CollectionSubView< Math.abs(movement[0]) > 15 && !this.props.trimming ) { - CollectionStackedTimeline.createAnchor( + const anchor = CollectionStackedTimeline.createAnchor( this.rootDoc, this.dataDoc, this.props.fieldKey, @@ -255,6 +256,7 @@ export class CollectionStackedTimeline extends CollectionSubView< this._markerStart, this._markerEnd ); + setTimeout(() => DocumentManager.Instance.getDocumentView(anchor)?.select(false)); } (!isClick || !wasSelecting) && (CollectionStackedTimeline.SelectingRegion = undefined); diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 9706d73c7..88fb2ed13 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -228,7 +228,6 @@ export class PDFBox extends ViewBoxAnnotatableComponent this.pdfUrl && Utils.CopyText(this.pdfUrl.url.pathname), icon: "expand-arrows-alt" }); funcs.push({ description: "Toggle Fit Width " + (this.Document._fitWidth ? "Off" : "On"), event: () => this.Document._fitWidth = !this.Document._fitWidth, icon: "expand-arrows-alt" }); - funcs.push({ description: "Toggle Annotation View ", event: () => this.Document._showSidebar = !this.Document._showSidebar, icon: "expand-arrows-alt" }); funcs.push({ description: "Toggle Sidebar ", event: () => this.toggleSidebar(), icon: "expand-arrows-alt" }); ContextMenu.Instance.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" }); } diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx index adf84d810..19135b6dd 100644 --- a/src/client/views/nodes/WebBox.tsx +++ b/src/client/views/nodes/WebBox.tsx @@ -404,7 +404,6 @@ export class WebBox extends ViewBoxAnnotatableComponent this.Document._showSidebar = !this.Document._showSidebar, icon: "expand-arrows-alt" }); cm.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" }); } -- cgit v1.2.3-70-g09d2 From ce7e33562775b4cd4671dadd2d2fa9d448bc0290 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 13:57:56 -0400 Subject: fixed link search icon in anchorMenu --- src/client/views/pdf/AnchorMenu.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx index 3ba427c29..ad3afb775 100644 --- a/src/client/views/pdf/AnchorMenu.tsx +++ b/src/client/views/pdf/AnchorMenu.tsx @@ -155,9 +155,10 @@ export class AnchorMenu extends AntimodeMenu { , //NOTE: link popup is currently in progress - {"Link selected text to document"}}> + {"Find document to link to selected text"}}> , -- cgit v1.2.3-70-g09d2 From e911344b7b93381c2dda4434480a6168291c60c0 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 14:28:37 -0400 Subject: fixed errors and warnings. --- src/client/util/CurrentUserUtils.ts | 2 +- src/client/views/MainView.tsx | 5 +++-- src/client/views/collections/TreeView.tsx | 2 +- src/client/views/nodes/DocumentView.tsx | 2 +- src/client/views/nodes/button/FontIconBox.tsx | 21 +++++---------------- .../nodes/button/colorDropdown/ColorDropdown.tsx | 10 ++++------ .../views/nodes/formattedText/FormattedTextBox.tsx | 2 +- 7 files changed, 16 insertions(+), 28 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 9a5ccffa0..6a7523d5b 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -863,7 +863,7 @@ export class CurrentUserUtils { _lockedPosition: true, boxShadow: "0 0", childDontRegisterViews: true, targetDropAction: "proto", system: true, explainer: "This is your file manager where you can create folders to keep track of documents independently of your dashboard." })); - (doc.myFilesystem as any as Doc).contextMenuScripts = new List([newFolder!]); + (doc.myFilesystem as any as Doc).contextMenuScripts = new List([newFolder]); (doc.myFilesystem as any as Doc).contextMenuLabels = new List(["Create new folder"]); (doc.myFilesystem as any as Doc).childContextMenuIcons = new List(["plus"]); } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 68ec97523..9b1cc3499 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -64,6 +64,7 @@ import { DashboardStyleProvider, DefaultStyleProvider } from './StyleProvider'; import { TopBar } from './topbar/TopBar'; import { RichTextMenu } from './nodes/formattedText/RichTextMenu'; import { ScriptField } from '../../fields/ScriptField'; +import { ButtonType } from './nodes/button/FontIconBox'; const _global = (window /* browser */ || global /* node */) as any; @observer @@ -245,9 +246,9 @@ export class MainView extends React.Component { if (!await this.userDoc.myFilesystem) { this.userDoc.myFileOrphans = Docs.Create.TreeDocument([], { title: "Unfiled", _stayInCollection: true, system: true, isFolder: true }); const newFolder = ScriptField.MakeFunction(`createNewFolder()`, { scriptContext: "any" })!; - const newFolderButton:Doc = Docs.Create.FontIconDocument({ onClick: newFolder, _forceActive: true, toolTip: "New folder", _stayInCollection: true, _hideContextMenu: true, title: "New folder", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New folder", icon: "folder-plus", system: true }); + const newFolderButton: Doc = Docs.Create.FontIconDocument({ onClick: newFolder, _forceActive: true, toolTip: "New folder", _stayInCollection: true, _hideContextMenu: true, title: "New folder", btnType: ButtonType.ClickButton, _width: 30, _height: 30, buttonText: "New folder", icon: "folder-plus", system: true }); this.userDoc.myFilesystem = new PrefetchProxy(Docs.Create.TreeDocument([this.userDoc.myFileOrphans as Doc], { - title: "My Documents", _showTitle: "title", buttonMenu: true, buttonMenuDoc: newFolderButton, _height: 100, + title: "My Documents", _showTitle: "title", buttonMenu: true, buttonMenuDoc: newFolderButton, _height: 100, treeViewHideTitle: true, _xMargin: 5, _yMargin: 5, _gridGap: 5, _forceActive: true, childDropAction: "alias", treeViewTruncateTitleWidth: 150, ignoreClick: true, isFolder: true, treeViewType: "fileSystem", childHideLinkButton: true, diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx index 2727a0af5..aa7b164b0 100644 --- a/src/client/views/collections/TreeView.tsx +++ b/src/client/views/collections/TreeView.tsx @@ -54,7 +54,7 @@ export interface TreeViewProps { indentDocument?: (editTitle: boolean) => void; outdentDocument?: (editTitle: boolean) => void; ScreenToLocalTransform: () => Transform; - contextMenuItems: { script: ScriptField, filter: ScriptField, label: string }[]; + contextMenuItems: { script: ScriptField, filter: ScriptField, icon: string, label: string }[]; dontRegisterView?: boolean; styleProvider?: StyleProviderFunc | undefined; treeViewHideHeaderFields: () => boolean; diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 5de4c2c4e..007dca0c4 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -154,7 +154,7 @@ export interface DocumentViewProps extends DocumentViewSharedProps { NativeWidth?: () => number; NativeHeight?: () => number; LayoutTemplate?: () => Opt; - contextMenuItems?: () => { script: ScriptField, label: string, icon: string }[]; + contextMenuItems?: () => { script: ScriptField, filter?: ScriptField, label: string, icon: string }[]; onClick?: () => ScriptField; onDoubleClick?: () => ScriptField; onPointerDown?: () => ScriptField; diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index fb96969c5..5ae7c3628 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -246,7 +246,6 @@ export class FontIconBox extends DocComponent(Fon let text: string | undefined; let dropdown = true; let icon: IconProp = "caret-down"; - let noneSelected: boolean = false; if (script === 'setView') { const selected = SelectionManager.Docs().lastElement(); @@ -301,7 +300,7 @@ export class FontIconBox extends DocComponent(Fon
this.rootDoc.dropDownOpen = !this.rootDoc.dropDownOpen : undefined}> - {dropdown || noneSelected ? (null) : } + {dropdown ? (null) : }
{text && text[0].toUpperCase() + text.slice(1)}
@@ -334,22 +333,14 @@ export class FontIconBox extends DocComponent(Fon const scriptCheck: string = script + "(undefined, true)"; const boolResult = ScriptField.MakeScript(scriptCheck)?.script.run().result; - let stroke: boolean = false; - let strokeIcon: any; - // if (script === "setStrokeColor") { - // stroke = true; - // const checkWidth = ScriptField.MakeScript("setStrokeWidth(0, true)")?.script.run().result; - // const width = 20 + (checkWidth / 100) * 70; - // const height = 20 + (checkWidth / 100) * 70; - // strokeIcon = (
); - // } + const showAlpha: boolean = script !== "setStrokeColor"; // bcz: ugh this should be changed to a field property on the button const colorOptions: string[] = ['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF', '#f1efeb', "transparent"]; const colorBox = (func: (color: ColorState) => void) => ; const label = !this.label || !Doc.UserDoc()._showLabel ? (null) : @@ -375,10 +366,8 @@ export class FontIconBox extends DocComponent(Fon style={{ color: color, borderBottomLeftRadius: this.dropdown ? 0 : undefined }} onClick={() => this.rootDoc.dropDownOpen = !this.rootDoc.dropDownOpen} onPointerDown={e => e.stopPropagation()}> - {stroke ? strokeIcon : <> -
} + +
{label} {/* {dropdownCaret} */} {this.rootDoc.dropDownOpen ? diff --git a/src/client/views/nodes/button/colorDropdown/ColorDropdown.tsx b/src/client/views/nodes/button/colorDropdown/ColorDropdown.tsx index 1809f4e2e..235495250 100644 --- a/src/client/views/nodes/button/colorDropdown/ColorDropdown.tsx +++ b/src/client/views/nodes/button/colorDropdown/ColorDropdown.tsx @@ -14,8 +14,7 @@ export class ColorDropdown extends Component { const scriptCheck: string = script + "(undefined, true)"; const boolResult = ScriptField.MakeScript(scriptCheck)?.script.run().result; - let stroke: boolean = false; - let strokeIcon: any; + const stroke: boolean = false; // if (script === "setStrokeColor") { // stroke = true; // const checkWidth = ScriptField.MakeScript("setStrokeWidth(0, true)")?.script.run().result; @@ -55,10 +54,9 @@ export class ColorDropdown extends Component { style={{ color: this.props.color, borderBottomLeftRadius: active ? 0 : undefined }} onClick={() => this.props.rootDoc.dropDownOpen = !this.props.rootDoc.dropDownOpen} onPointerDown={e => e.stopPropagation()}> - {stroke ? strokeIcon : <> -
} + +
{label} {/* {dropdownCaret} */} {this.props.rootDoc.dropDownOpen ? diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 4b540312e..fce95547e 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1160,7 +1160,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp selectOnLoad && this._editorView!.focus(); // add user mark for any first character that was typed since the user mark that gets set in KeyPress won't have been called yet. if (this._editorView && !this._editorView.state.storedMarks?.some(mark => mark.type === schema.marks.user_mark)) { - this._editorView.state.storedMarks = [...(this._editorView!.state.storedMarks ?? []), schema.marks.user_mark.create({ userid: Doc.CurrentUserEmail, modified: Math.floor(Date.now() / 1000) })]; + this._editorView.state.storedMarks = [...(this._editorView.state.storedMarks ?? []), schema.marks.user_mark.create({ userid: Doc.CurrentUserEmail, modified: Math.floor(Date.now() / 1000) })]; } } -- cgit v1.2.3-70-g09d2 From 3de58ee0196358d353e0d797d407aeb3e0ef383c Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 14:47:49 -0400 Subject: fixed transparency for colorButtons --- src/client/views/nodes/button/FontIconBox.tsx | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index 5ae7c3628..40d5ad819 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -26,12 +26,10 @@ import { SetActiveInkColor, ActiveFillColor, SetActiveFillColor, ActiveInkWidth, import { StyleProp } from '../../StyleProvider'; import { FieldView, FieldViewProps } from '.././FieldView'; import { RichTextMenu } from '../formattedText/RichTextMenu'; -import { TextButton } from './textButton'; -import { ToggleButton } from './toggleButton'; +import { Utils } from '../../../../Utils'; import { IButtonProps } from './ButtonInterface'; import { FontIconBadge } from './FontIconBadge'; import './FontIconBox.scss'; -import { undo } from 'prosemirror-history'; import { WebBox } from '../WebBox'; const FontIconSchema = createSchema({ icon: "string", @@ -333,15 +331,14 @@ export class FontIconBox extends DocComponent(Fon const scriptCheck: string = script + "(undefined, true)"; const boolResult = ScriptField.MakeScript(scriptCheck)?.script.run().result; - const showAlpha: boolean = script !== "setStrokeColor"; // bcz: ugh this should be changed to a field property on the button - const colorOptions: string[] = ['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF', '#f1efeb', "transparent"]; const colorBox = (func: (color: ColorState) => void) => ; const label = !this.label || !Doc.UserDoc()._showLabel ? (null) :
@@ -356,7 +353,7 @@ export class FontIconBox extends DocComponent(Fon const click = (value: ColorState) => { const hex: string = value.hex; - const s = ScriptField.MakeScript(script + '("' + hex + '", false)'); + const s = ScriptField.MakeScript(script + '("' + Utils.colorString(value) + '", false)'); if (s) { undoBatch(() => s.script.run().result)(); } -- cgit v1.2.3-70-g09d2 From 8c5fd1eb3c1ffb5bc17f5225a75f9dd2db40e460 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 15:36:58 -0400 Subject: from last --- src/client/views/nodes/button/FontIconBox.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index 40d5ad819..1997f4fa5 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -352,11 +352,8 @@ export class FontIconBox extends DocComponent(Fon
; const click = (value: ColorState) => { - const hex: string = value.hex; const s = ScriptField.MakeScript(script + '("' + Utils.colorString(value) + '", false)'); - if (s) { - undoBatch(() => s.script.run().result)(); - } + s && undoBatch(() => s.script.run().result)(); }; return (
Date: Mon, 13 Sep 2021 17:01:54 -0400 Subject: fixed clicking on link drag button to create doc in sidebar for RTF documents. --- src/client/views/DocComponent.tsx | 2 +- src/client/views/nodes/button/FontIconBox.tsx | 2 +- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 5 +++++ 3 files changed, 7 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx index cb36f4270..32c351bf5 100644 --- a/src/client/views/DocComponent.tsx +++ b/src/client/views/DocComponent.tsx @@ -176,7 +176,7 @@ export function ViewBoxAnnotatableComponent

{ const docs = doc instanceof Doc ? [doc] : doc; if (this.props.filterAddDocument?.(docs) === false || docs.find(doc => Doc.AreProtosEqual(doc, this.props.Document) && Doc.LayoutField(doc) === Doc.LayoutField(this.props.Document))) { diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index 1997f4fa5..9d1ef937f 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -482,7 +482,7 @@ export class FontIconBox extends DocComponent(Fon backgroundColor: backgroundColor, icon: this.icon, color: color - } + }; const buttonText = StrCast(this.rootDoc.buttonText); diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index fce95547e..b1d4a79db 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -214,6 +214,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp @action setupAnchorMenu = () => { AnchorMenu.Instance.Status = "marquee"; + + AnchorMenu.Instance.OnClick = (e: PointerEvent) => { + !this._showSidebar && this.toggleSidebar(); + this._sidebarRef.current?.anchorMenuClick(this.getAnchor()); + }; AnchorMenu.Instance.Highlight = action((color: string, isLinkButton: boolean) => { this._editorView?.state && RichTextMenu.Instance.setHighlight(color, this._editorView, this._editorView?.dispatch); return undefined; -- cgit v1.2.3-70-g09d2 From d15841974305bf01251f60fa73a8464c7cb914fe Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 17:35:17 -0400 Subject: fixed dragging document that is unselected by clicking on nested object in sidbear to not double-drag two items effectively deleting the sidebar document. fixed undoing of document decorations topbar buttons. --- src/client/views/DocumentDecorations.tsx | 7 ++----- src/client/views/nodes/DocumentView.tsx | 1 + src/client/views/nodes/formattedText/FormattedTextBox.tsx | 2 +- 3 files changed, 4 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 8bc167079..6ca8dbec6 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -136,7 +136,6 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b return true; } - @undoBatch onCloseClick = () => { const selected = SelectionManager.Views().slice(); SelectionManager.DeselectAll(); @@ -153,8 +152,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b return true; }, emptyFunction, this.onMaximizeClick, false, false); } - @undoBatch - @action + onMaximizeClick = (e: any): void => { const selectedDocs = SelectionManager.Views(); if (selectedDocs.length) { @@ -176,7 +174,6 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b SelectionManager.DeselectAll(); } - @undoBatch onIconifyClick = (): void => { SelectionManager.Views().forEach(dv => dv?.iconify()); SelectionManager.DeselectAll(); @@ -433,7 +430,7 @@ export class DocumentDecorations extends React.Component<{ boundsLeft: number, b const topBtn = (key: string, icon: string, pointerDown: undefined | ((e: React.PointerEvent) => void), click: undefined | ((e: any) => void), title: string) => ( {title}

} placement="top">
e.preventDefault()} - onPointerDown={pointerDown ?? (e => setupMoveUpEvents(this, e, returnFalse, click!, emptyFunction))} > + onPointerDown={pointerDown ?? (e => setupMoveUpEvents(this, e, returnFalse, emptyFunction, undoBatch(e => click!(e))))} >
); diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 007dca0c4..1fcbffadd 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -536,6 +536,7 @@ export class DocumentViewInternal extends DocComponent { + if (e.cancelBubble) return; if ((InteractionUtils.IsType(e, InteractionUtils.PENTYPE) || [InkTool.Highlighter, InkTool.Pen].includes(CurrentUserUtils.SelectedTool))) return; if (e.cancelBubble && this.props.isDocumentActive?.()) { document.removeEventListener("pointermove", this.onPointerMove); // stop listening to pointerMove if something else has stopPropagated it (e.g., the MarqueeView) diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index b1d4a79db..acc2892d8 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -216,7 +216,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp AnchorMenu.Instance.Status = "marquee"; AnchorMenu.Instance.OnClick = (e: PointerEvent) => { - !this._showSidebar && this.toggleSidebar(); + !this.layoutDoc.showSidebar && this.toggleSidebar(); this._sidebarRef.current?.anchorMenuClick(this.getAnchor()); }; AnchorMenu.Instance.Highlight = action((color: string, isLinkButton: boolean) => { -- cgit v1.2.3-70-g09d2 From af246480e97554233293ab1dfb08b5af5e1f9d7c Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 13 Sep 2021 19:38:53 -0400 Subject: fixed copyPath menu item for images/pdfs. fixed contextmenu right-clicking to not require preselection of doc. --- src/Utils.ts | 10 +--------- src/client/views/ContextMenu.tsx | 15 +++++++++++---- src/client/views/nodes/DocumentView.tsx | 15 +++++++++++++-- src/client/views/nodes/ImageBox.tsx | 2 +- src/client/views/nodes/PDFBox.tsx | 5 ++--- 5 files changed, 28 insertions(+), 19 deletions(-) (limited to 'src') diff --git a/src/Utils.ts b/src/Utils.ts index 3fffadb6d..ddc16dceb 100644 --- a/src/Utils.ts +++ b/src/Utils.ts @@ -82,15 +82,7 @@ export namespace Utils { } export function CopyText(text: string) { - const textArea = document.createElement("textarea"); - textArea.value = text; - document.body.appendChild(textArea); - textArea.focus(); - textArea.select(); - - try { document.execCommand('copy'); } catch (err) { } - - document.body.removeChild(textArea); + navigator.clipboard.writeText(text); } export function decimalToHexString(number: number) { diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx index c4fabbf99..78564a11b 100644 --- a/src/client/views/ContextMenu.tsx +++ b/src/client/views/ContextMenu.tsx @@ -47,11 +47,17 @@ export class ContextMenu extends React.Component { this._mouseDown = false; const curX = e.clientX; const curY = e.clientY; - if (this._mouseX !== curX || this._mouseY !== curY) { + if (Math.abs(this._mouseX - curX) > 1 || Math.abs(this._mouseY - curY) > 1) { this._shouldDisplay = false; } - this._shouldDisplay && (this._display = true); + if (this._shouldDisplay) { + if (this._onDisplay) { + this._onDisplay(); + } else { + this._display = true; + } + } } componentWillUnmount() { document.removeEventListener("pointerdown", this.onPointerDown); @@ -138,9 +144,9 @@ export class ContextMenu extends React.Component { return y; } - + _onDisplay?: () => void = undefined; @action - displayMenu = (x: number, y: number, initSearch = "", showSearch = false) => { + displayMenu = (x: number, y: number, initSearch = "", showSearch = false, onDisplay?: () => void) => { //maxX and maxY will change if the UI/font size changes, but will work for any amount //of items added to the menu @@ -149,6 +155,7 @@ export class ContextMenu extends React.Component { this._pageY = y; this._searchString = initSearch; this._shouldDisplay = true; + this._onDisplay = onDisplay; } @action diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 1fcbffadd..193befa5d 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -13,7 +13,7 @@ import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from "../../../fields/Ty import { AudioField } from "../../../fields/URLField"; import { GetEffectiveAcl, SharingPermissions, TraceMobx } from '../../../fields/util'; import { MobileInterface } from '../../../mobile/MobileInterface'; -import { emptyFunction, hasDescendantTarget, OmitKeys, returnTrue, returnVal, Utils, lightOrDark } from "../../../Utils"; +import { emptyFunction, hasDescendantTarget, OmitKeys, returnTrue, returnVal, Utils, lightOrDark, simulateMouseClick } from "../../../Utils"; import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils'; import { Docs, DocUtils } from "../../documents/Documents"; import { DocumentType } from '../../documents/DocumentTypes'; @@ -671,6 +671,18 @@ export class DocumentViewInternal extends DocComponent setTimeout(() => { + DocumentViewInternal.SelectAfterContextMenu && !this.props.isSelected(true) && SelectionManager.SelectView(this.props.DocumentView(), false); // on a mac, the context menu is triggered on mouse down, but a YouTube video becaomes interactive when selected which means that the context menu won't show up. by delaying the selection until hopefully after the pointer up, the context menu will appear. + setTimeout(() => { + const ele = document.elementFromPoint(e.clientX, e.clientY); + simulateMouseClick(ele, e.clientX, e.clientY, e.screenX, e.screenY); + }); + }); + cm.displayMenu((e?.pageX || pageX || 0) - 15, (e?.pageY || pageY || 0) - 15, undefined, undefined, onDisplay); + return; + } + const customScripts = Cast(this.props.Document.contextMenuScripts, listSpec(ScriptField), []); StrListCast(this.Document.contextMenuLabels).forEach((label, i) => cm.addItem({ description: label, event: () => customScripts[i]?.script.run({ documentView: this, this: this.layoutDoc, scriptContext: this.props.scriptContext, self: this.rootDoc }), icon: "sticky-note" })); @@ -777,7 +789,6 @@ export class DocumentViewInternal extends DocComponent SelectionManager.SelectView(this.props.DocumentView(), false), 300); // on a mac, the context menu is triggered on mouse down, but a YouTube video becaomes interactive when selected which means that the context menu won't show up. by delaying the selection until hopefully after the pointer up, the context menu will appear. } rootSelected = (outsideReaction?: boolean) => this.props.isSelected(outsideReaction) || (this.props.Document.rootDocument && this.props.rootSelected?.(outsideReaction)) || false; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index 38deb4a73..b41bfd3ea 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -144,9 +144,9 @@ export class ImageBox extends ViewBoxAnnotatableComponent Utils.CopyText(this.choosePath(field.url)), icon: "expand-arrows-alt" }); if (!Doc.UserDoc().noviceMode) { funcs.push({ description: "Export to Google Photos", event: () => GooglePhotos.Transactions.UploadImages([this.props.Document]), icon: "caret-square-right" }); - funcs.push({ description: "Copy path", event: () => Utils.CopyText(field.url.href), icon: "expand-arrows-alt" }); const existingAnalyze = ContextMenu.Instance?.findByDescription("Analyzers..."); const modes: ContextMenuProps[] = existingAnalyze && "subitems" in existingAnalyze ? existingAnalyze.subitems : []; diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 88fb2ed13..ce851b830 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -226,9 +226,8 @@ export class PDFBox extends ViewBoxAnnotatableComponent { const funcs: ContextMenuProps[] = []; - funcs.push({ description: "Copy path", event: () => this.pdfUrl && Utils.CopyText(this.pdfUrl.url.pathname), icon: "expand-arrows-alt" }); - funcs.push({ description: "Toggle Fit Width " + (this.Document._fitWidth ? "Off" : "On"), event: () => this.Document._fitWidth = !this.Document._fitWidth, icon: "expand-arrows-alt" }); - funcs.push({ description: "Toggle Sidebar ", event: () => this.toggleSidebar(), icon: "expand-arrows-alt" }); + funcs.push({ description: "Copy path", event: () => this.pdfUrl && Utils.CopyText(Utils.prepend("") + this.pdfUrl.url.pathname), icon: "expand-arrows-alt" }); + //funcs.push({ description: "Toggle Sidebar ", event: () => this.toggleSidebar(), icon: "expand-arrows-alt" }); ContextMenu.Instance.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" }); } -- cgit v1.2.3-70-g09d2