aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/SettingsManager.tsx6
-rw-r--r--src/client/views/ContextMenu.tsx2
-rw-r--r--src/client/views/DocumentButtonBar.tsx38
-rw-r--r--src/client/views/TemplateMenu.tsx28
-rw-r--r--src/client/views/Templates.tsx41
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx3
-rw-r--r--src/client/views/nodes/DocumentView.tsx3
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBoxComment.tsx2
8 files changed, 42 insertions, 81 deletions
diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx
index fc8bc382e..17e93ad17 100644
--- a/src/client/util/SettingsManager.tsx
+++ b/src/client/util/SettingsManager.tsx
@@ -113,9 +113,9 @@ export class SettingsManager extends React.Component<{}> {
<input type="checkbox" onChange={e => Doc.UserDoc().showTitle = Doc.UserDoc().showTitle ? undefined : "creationDate"} checked={Doc.UserDoc().showTitle !== undefined} />
</div>
<div>
- <div className="preferences-check">Alt Buttons</div>
- <input type="checkbox" onChange={e => Doc.UserDoc()["documentLinksButton-hideEnd"] = !Doc.UserDoc()["documentLinksButton-hideEnd"]}
- checked={BoolCast(Doc.UserDoc()["documentLinksButton-hideEnd"])} />
+ <div className="preferences-check">Full Toolbar</div>
+ <input type="checkbox" onChange={e => Doc.UserDoc()["documentLinksButton-fullMenu"] = !Doc.UserDoc()["documentLinksButton-fullMenu"]}
+ checked={BoolCast(Doc.UserDoc()["documentLinksButton-fullMenu"])} />
</div>
<div>
<div className="preferences-check">Raise on drag</div>
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index 349fd077c..1f7abf61a 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -233,7 +233,7 @@ export class ContextMenu extends React.Component {
<span className="icon-background">
<FontAwesomeIcon icon="search" size="lg" />
</span>
- <input className="contextMenu-item contextMenu-description search" type="text" placeholder="Search Menu..." value={this._searchString} onKeyDown={this.onKeyDown} onChange={this.onChange} autoFocus />
+ <input className="contextMenu-item contextMenu-description search" type="text" placeholder="Filter Menu..." value={this._searchString} onKeyDown={this.onKeyDown} onChange={this.onChange} autoFocus />
</span>
{this.menuItems}
</>
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 979b1198a..b155e33ff 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -23,7 +23,6 @@ import { DocumentLinksButton } from './nodes/DocumentLinksButton';
import { DocumentView } from './nodes/DocumentView';
import { GoogleRef } from "./nodes/formattedText/FormattedTextBox";
import { TemplateMenu } from "./TemplateMenu";
-import { Template, Templates } from "./Templates";
import React = require("react");
const higflyout = require("@hig/flyout");
export const { anchorPoints } = higflyout;
@@ -255,9 +254,11 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
</div></Tooltip>;
}
@observable _aliasDown = false;
- onAliasButtonDown = (e: React.PointerEvent): void => {
+ onAliasButtonDown = action((e: React.PointerEvent): void => {
+ this.props.views()[0]?.select(false);
+ this._tooltipOpen = false;
setupMoveUpEvents(this, e, this.onAliasButtonMoved, emptyFunction, emptyFunction);
- }
+ })
onAliasButtonMoved = () => {
if (this._dragRef.current) {
const dragDocView = this.view0!;
@@ -274,23 +275,28 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
return false;
}
+ _ref = React.createRef<HTMLDivElement>();
+ @observable _tooltipOpen: boolean = false;
@computed
get templateButton() {
const view0 = this.view0;
- const templates: Map<Template, boolean> = new Map();
+ const templates: Map<string, boolean> = new Map();
const views = this.props.views();
- Array.from(Object.values(Templates.TemplateList)).map(template =>
- templates.set(template, views.reduce((checked, doc) => checked || doc?.props.Document["_show" + template.Name] ? true : false, false as boolean)));
+ Array.from(["Caption", "Title", "TitleHover"]).map(template =>
+ templates.set(template, views.reduce((checked, doc) => checked || doc?.props.Document["_show" + template] ? true : false, false as boolean)));
return !view0 ? (null) :
- <Tooltip title={<><div className="dash-tooltip">Tap: Customize layout. Drag: Create alias</div></>}>
- <div className="documentButtonBar-linkFlyout" ref={this._dragRef}>
+ <Tooltip title={<div className="dash-tooltip">CustomizeLayout</div>} open={this._tooltipOpen} onClose={action(() => this._tooltipOpen = false)} placement="bottom">
+ <div className="documentButtonBar-linkFlyout" ref={this._dragRef}
+ onPointerEnter={action(() => !this._ref.current?.getBoundingClientRect().width && (this._tooltipOpen = true))} >
+
<Flyout anchorPoint={anchorPoints.LEFT_TOP} onOpen={action(() => this._aliasDown = true)} onClose={action(() => this._aliasDown = false)}
- content={!this._aliasDown ? (null) : <TemplateMenu docViews={views.filter(v => v).map(v => v as DocumentView)} templates={templates} />}>
+ content={!this._aliasDown ? (null) : <div ref={this._ref}> <TemplateMenu docViews={views.filter(v => v).map(v => v as DocumentView)} templates={templates} /></div>}>
<div className={"documentButtonBar-linkButton-empty"} ref={this._dragRef} onPointerDown={this.onAliasButtonDown} >
{<FontAwesomeIcon className="documentdecorations-icon" icon="edit" size="sm" />}
</div>
</Flyout>
- </div></Tooltip>;
+ </div>
+ </Tooltip>;
}
openContextMenu = (e: React.MouseEvent) => {
@@ -315,13 +321,13 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
<div className="documentButtonBar-button">
<DocumentLinksButton links={this.view0.allLinks} View={this.view0} AlwaysOn={true} InMenu={true} StartLink={true} />
</div>
- {DocumentLinksButton.StartLink || !Doc.UserDoc()["documentLinksButton-hideEnd"] ? <div className="documentButtonBar-button">
+ {DocumentLinksButton.StartLink || !Doc.UserDoc()["documentLinksButton-fullMenu"] ? <div className="documentButtonBar-button">
<DocumentLinksButton links={this.view0.allLinks} View={this.view0} AlwaysOn={true} InMenu={true} StartLink={false} />
</div> : (null)}
- {/* <div className="documentButtonBar-button">
+ {!Doc.UserDoc()["documentLinksButton-fullMenu"] ? (null) : <div className="documentButtonBar-button">
{this.templateButton}
</div>
- <div className="documentButtonBar-button">
+ /*<div className="documentButtonBar-button">
{this.metadataButton}
</div>
<div className="documentButtonBar-button">
@@ -330,7 +336,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
<div className="documentButtonBar-button">
{this.pinButton}
</div>
- {!Doc.UserDoc()["documentLinksButton-hideEnd"] ? (null) : <div className="documentButtonBar-button">
+ {!Doc.UserDoc()["documentLinksButton-fullMenu"] ? (null) : <div className="documentButtonBar-button">
{this.shareButton}
</div>}
{![DocumentType.VID, DocumentType.WEB].includes(StrCast(this.view0.props.Document.type) as DocumentType) ? (null) : <div className="documentButtonBar-button">
@@ -345,9 +351,9 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
<div className="documentButtonBar-button">
{this.menuButton}
</div>
- <div className="documentButtonBar-button">
+ {/* {Doc.UserDoc().noviceMode ? (null) : <div className="documentButtonBar-button">
{this.moreButton}
- </div>
+ </div>} */}
</div>;
}
}
diff --git a/src/client/views/TemplateMenu.tsx b/src/client/views/TemplateMenu.tsx
index c1878115d..cf2118cb2 100644
--- a/src/client/views/TemplateMenu.tsx
+++ b/src/client/views/TemplateMenu.tsx
@@ -1,10 +1,8 @@
import { action, observable, runInAction, ObservableSet, trace, computed } from "mobx";
import { observer } from "mobx-react";
-import { SelectionManager } from "../util/SelectionManager";
import { undoBatch } from "../util/UndoManager";
import './TemplateMenu.scss';
import { DocumentView } from "./nodes/DocumentView";
-import { Template } from "./Templates";
import React = require("react");
import { Doc, DocListCast } from "../../fields/Doc";
import { Docs, DocUtils, } from "../documents/Documents";
@@ -18,13 +16,13 @@ import { List } from "../../fields/List";
import { TraceMobx } from "../../fields/util";
@observer
-class TemplateToggle extends React.Component<{ template: Template, checked: boolean, toggle: (event: React.ChangeEvent<HTMLInputElement>, template: Template) => void }> {
+class TemplateToggle extends React.Component<{ template: string, checked: boolean, toggle: (event: React.ChangeEvent<HTMLInputElement>, template: string) => void }> {
render() {
if (this.props.template) {
return (
<li className="templateToggle">
<input type="checkbox" checked={this.props.checked} onChange={(event) => this.props.toggle(event, this.props.template)} />
- {this.props.template.Name}
+ {this.props.template}
</li>
);
} else {
@@ -46,7 +44,7 @@ class OtherToggle extends React.Component<{ checked: boolean, name: string, togg
export interface TemplateMenuProps {
docViews: DocumentView[];
- templates: Map<Template, boolean>;
+ templates: Map<string, boolean>;
}
@@ -69,8 +67,8 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
@undoBatch
@action
- toggleTemplate = (event: React.ChangeEvent<HTMLInputElement>, template: Template): void => {
- this.props.docViews.forEach(d => Doc.Layout(d.layoutDoc)["_show" + template.Name] = event.target.checked ? template.Name.toLowerCase() : "");
+ toggleTemplate = (event: React.ChangeEvent<HTMLInputElement>, template: string): void => {
+ this.props.docViews.forEach(d => Doc.Layout(d.layoutDoc)["_show" + template] = event.target.checked ? template.toLowerCase() : "");
}
@action
@@ -113,21 +111,21 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
const firstDoc = this.props.docViews[0].props.Document;
const templateName = StrCast(firstDoc.layoutKey, "layout").replace("layout_", "");
const noteTypes = DocListCast(Cast(Doc.UserDoc()["template-notes"], Doc, null)?.data);
- const addedTypes = DocListCast(Cast(Doc.UserDoc()["template-buttons"], Doc, null)?.data);
+ const addedTypes = Doc.UserDoc().noviceMode ? [] : DocListCast(Cast(Doc.UserDoc()["template-buttons"], Doc, null)?.data);
const layout = Doc.Layout(firstDoc);
const templateMenu: Array<JSX.Element> = [];
- //this.props.templates.forEach((checked, template) =>
- // templateMenu.push(<TemplateToggle key={template.Name} template={template} checked={checked} toggle={this.toggleTemplate} />));
- //templateMenu.push(<OtherToggle key={"audio"} name={"Audio"} checked={firstDoc._showAudio ? true : false} toggle={this.toggleAudio} />);
- templateMenu.push(<OtherToggle key={"chrome"} name={"Chrome"} checked={layout._chromeStatus !== "disabled"} toggle={this.toggleChrome} />);
+ this.props.templates.forEach((checked, template) =>
+ templateMenu.push(<TemplateToggle key={template} template={template} checked={checked} toggle={this.toggleTemplate} />));
+ templateMenu.push(<OtherToggle key={"audio"} name={"Audio"} checked={firstDoc._showAudio ? true : false} toggle={this.toggleAudio} />);
templateMenu.push(<OtherToggle key={"default"} name={"Default"} checked={templateName === "layout"} toggle={this.toggleDefault} />);
+ !Doc.UserDoc().noviceMode && templateMenu.push(<OtherToggle key={"chrome"} name={"Chrome"} checked={layout._chromeStatus !== "disabled"} toggle={this.toggleChrome} />);
addedTypes.concat(noteTypes).map(template => template.treeViewChecked = this.templateIsUsed(firstDoc, template));
this._addedKeys && Array.from(this._addedKeys).filter(key => !noteTypes.some(nt => nt.title === key)).forEach(template => templateMenu.push(
<OtherToggle key={template} name={template} checked={templateName === template} toggle={e => this.toggleLayout(e, template)} />));
return <ul className="template-list" style={{ display: "block" }}>
- <input placeholder="+ layout" ref={this._customRef} onKeyPress={this.onCustomKeypress} />
+ {Doc.UserDoc().noviceMode ? (null) : <input placeholder="+ layout" ref={this._customRef} onKeyPress={this.onCustomKeypress} />}
{templateMenu}
- <CollectionTreeView
+ {Doc.UserDoc().noviceMode ? (null) : <CollectionTreeView
Document={Doc.UserDoc().templateDocs as Doc}
CollectionView={undefined}
ContainingCollectionDoc={undefined}
@@ -158,7 +156,7 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
fieldKey={"data"}
moveDocument={returnFalse}
removeDocument={returnFalse}
- addDocument={returnFalse} />
+ addDocument={returnFalse} />}
</ul>;
}
}
diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx
deleted file mode 100644
index a6dbaa650..000000000
--- a/src/client/views/Templates.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-export class Template {
- constructor(name: string, layout: string) {
- this._name = name;
- this._layout = layout;
- }
-
- private _name: string;
- private _layout: string;
-
- get Name(): string {
- return this._name;
- }
-
- get Layout(): string {
- return this._layout;
- }
-}
-
-export namespace Templates {
- export const Caption = new Template("Caption",
- `<div>
- <div style="height:100%; width:100%;">{layout}</div>
- <div style="bottom: 0; font-size:14px; width:100%; position:absolute">
- <FormattedTextBox {...props} fieldKey={"caption"} hideOnLeave={"true"} />
- </div>
- </div>` );
-
- export const Title = new Template("Title",
- `<div>
- <div style="height:25px; width:100%; background-color: rgba(0, 0, 0, .4); color: white; z-index: 100">
- <span style="text-align:center;width:100%;font-size:20px;position:absolute;overflow:hidden;white-space:nowrap;text-overflow:ellipsis">{props.Document.title}</span>
- </div>
- <div style="height:calc(100% - 25px);">
- <div style="width:100%;overflow:auto">{layout}</div>
- </div>
- </div>` );
- export const TitleHover = new Template("TitleHover", Title.Layout);
-
- export const TemplateList: Template[] = [Title, TitleHover, Caption];
-}
-
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index e8944a5eb..19b8400c8 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -22,7 +22,6 @@ import { EditableView } from "../EditableView";
import { ContentFittingDocumentView } from '../nodes/ContentFittingDocumentView';
import { DocumentView } from '../nodes/DocumentView';
import { KeyValueBox } from '../nodes/KeyValueBox';
-import { Templates } from '../Templates';
import { CollectionSubView } from "./CollectionSubView";
import "./CollectionTreeView.scss";
import { CollectionViewType, CollectionView } from './CollectionView';
@@ -185,7 +184,7 @@ class TreeView extends React.Component<TreeViewProps> {
}
public static makeTextBullet() {
- const bullet = Docs.Create.TextDocument("-text-", { title: "-title-", _viewType: CollectionViewType.Tree, hideLinkButton: true, _showSidebar: true, treeViewOutlineMode: true, x: 0, y: 0, _xMargin: 0, _yMargin: 0, _autoHeight: true, _singleLine: true, _backgroundColor: "transparent", _width: 1000, _height: 10, templates: new List<string>([Templates.Title.Layout]) });
+ const bullet = Docs.Create.TextDocument("-text-", { title: "-title-", _viewType: CollectionViewType.Tree, hideLinkButton: true, _showSidebar: true, treeViewOutlineMode: true, x: 0, y: 0, _xMargin: 0, _yMargin: 0, _autoHeight: true, _singleLine: true, _backgroundColor: "transparent", _width: 1000, _height: 10 });
Doc.GetProto(bullet).layout = CollectionView.LayoutString("data");
Doc.GetProto(bullet).title = ComputedField.MakeFunction('self.text?.Text');
Doc.GetProto(bullet).data = new List<Doc>([]);
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 0b4f45dd6..7ff8b635c 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -118,7 +118,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
private get active() { return SelectionManager.IsSelected(this, true) || this.props.parentActive(true); }
public get displayName() { return "DocumentView(" + this.props.Document.title + ")"; } // this makes mobx trace() statements more descriptive
public get ContentDiv() { return this._mainCont.current; }
- public get LayoutFieldKey() { return StrCast(this.props.layoutKey, Doc.LayoutFieldKey(this.layoutDoc)); }
+ public get LayoutFieldKey() { return this.props.layoutKey || Doc.LayoutFieldKey(this.layoutDoc); }
@computed get ShowTitle() {
return StrCast(this.layoutDoc._showTitle,
!Doc.IsSystem(this.layoutDoc) && this.rootDoc.type === DocumentType.RTF && !this.props.treeViewDoc ?
@@ -855,7 +855,6 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
moreItems.push({ description: "Write Back Link to Album", event: () => GooglePhotos.Transactions.AddTextEnrichment(this.props.Document), icon: "caret-square-right" });
}
moreItems.push({ description: "Copy ID", event: () => Utils.CopyText(Utils.prepend("/doc/" + this.props.Document[Id])), icon: "fingerprint" });
- Doc.AreProtosEqual(this.props.Document, Cast(Doc.UserDoc().myUserDoc, Doc, null)) && moreItems.push({ description: "Toggle Alternate Button Bar", event: () => Doc.UserDoc()["documentLinksButton-hideEnd"] = !Doc.UserDoc()["documentLinksButton-hideEnd"], icon: "eye" });
}
}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBoxComment.tsx b/src/client/views/nodes/formattedText/FormattedTextBoxComment.tsx
index 47150c51a..f015d329c 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBoxComment.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBoxComment.tsx
@@ -110,7 +110,7 @@ export class FormattedTextBoxComment {
if (FormattedTextBoxComment._deleteRef?.contains(e.target as any)) {
this.deleteLink();
} else if (FormattedTextBoxComment._nextRef?.contains(e.target as any)) {
- FormattedTextBoxComment.showPreview(FormattedTextBoxComment._lastView!, FormattedTextBoxComment._lastState, FormattedTextBoxComment._hrefs?.[(++FormattedTextBoxComment._hrefInd) % FormattedTextBoxComment._hrefs?.length])
+ FormattedTextBoxComment.showPreview(FormattedTextBoxComment._lastView!, FormattedTextBoxComment._lastState, FormattedTextBoxComment._hrefs?.[(++FormattedTextBoxComment._hrefInd) % FormattedTextBoxComment._hrefs?.length]);
} else {
FormattedTextBoxComment.linkDoc = undefined;
if (linkDoc.type !== DocumentType.LINK) {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-11 15:40:20 +0000