aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/TemplateMenu.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/TemplateMenu.tsx')
-rw-r--r--src/client/views/TemplateMenu.tsx118
1 files changed, 88 insertions, 30 deletions
diff --git a/src/client/views/TemplateMenu.tsx b/src/client/views/TemplateMenu.tsx
index f61eb9cd0..8eb5c5050 100644
--- a/src/client/views/TemplateMenu.tsx
+++ b/src/client/views/TemplateMenu.tsx
@@ -1,17 +1,19 @@
-import { action, observable, runInAction, ObservableSet } from "mobx";
+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, Templates } from "./Templates";
+import { Template } from "./Templates";
import React = require("react");
import { Doc, DocListCast } from "../../new_fields/Doc";
+import { Docs, } from "../documents/Documents";
import { StrCast, Cast } from "../../new_fields/Types";
-import { CurrentUserUtils } from "../../server/authentication/models/current_user_utils";
-const higflyout = require("@hig/flyout");
-export const { anchorPoints } = higflyout;
-export const Flyout = higflyout.default;
+import { CollectionTreeView } from "./collections/CollectionTreeView";
+import { returnTrue, emptyFunction, returnFalse, returnOne, emptyPath } from "../../Utils";
+import { Transform } from "../util/Transform";
+import { ScriptField, ComputedField } from "../../new_fields/ScriptField";
+import { Scripting } from "../util/Scripting";
@observer
class TemplateToggle extends React.Component<{ template: Template, checked: boolean, toggle: (event: React.ChangeEvent<HTMLInputElement>, template: Template) => void }> {
@@ -48,10 +50,15 @@ export interface TemplateMenuProps {
@observer
export class TemplateMenu extends React.Component<TemplateMenuProps> {
+ _addedKeys = new ObservableSet();
+ _customRef = React.createRef<HTMLInputElement>();
@observable private _hidden: boolean = true;
toggleLayout = (e: React.ChangeEvent<HTMLInputElement>, layout: string): void => {
- this.props.docViews.map(dv => dv.setCustomView(e.target.checked, layout));
+ this.props.docViews.map(dv => dv.switchViews(e.target.checked, layout));
+ }
+ toggleDefault = (e: React.ChangeEvent<HTMLInputElement>): void => {
+ this.props.docViews.map(dv => dv.switchViews(false, "layout"));
}
toggleFloat = (e: React.ChangeEvent<HTMLInputElement>): void => {
@@ -62,15 +69,14 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
DocumentView.FloatDoc(topDocView, ex, ey);
}
+ toggleAudio = (e: React.ChangeEvent<HTMLInputElement>): void => {
+ this.props.docViews.map(dv => dv.props.Document._showAudio = e.target.checked);
+ }
@undoBatch
@action
toggleTemplate = (event: React.ChangeEvent<HTMLInputElement>, template: Template): void => {
- if (event.target.checked) {
- this.props.docViews.map(d => d.Document["show" + template.Name] = template.Name.toLowerCase());
- } else {
- this.props.docViews.map(d => d.Document["show" + template.Name] = "");
- }
+ this.props.docViews.forEach(d => Doc.Layout(d.Document)["_show" + template.Name] = event.target.checked ? template.Name.toLowerCase() : "");
}
@action
@@ -81,10 +87,8 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
@undoBatch
@action
toggleChrome = (): void => {
- this.props.docViews.map(dv => {
- const layout = Doc.Layout(dv.Document);
- layout._chromeStatus = (layout._chromeStatus !== "disabled" ? "disabled" : "enabled");
- });
+ this.props.docViews.map(dv => Doc.Layout(dv.Document)).forEach(layout =>
+ layout._chromeStatus = (layout._chromeStatus !== "disabled" ? "disabled" : StrCast(layout._replacedChrome, "enabled")));
}
// todo: add brushes to brushMap to save with a style name
@@ -98,28 +102,82 @@ export class TemplateMenu extends React.Component<TemplateMenuProps> {
Array.from(Object.keys(Doc.GetProto(this.props.docViews[0].props.Document))).
filter(key => key.startsWith("layout_")).
map(key => runInAction(() => this._addedKeys.add(key.replace("layout_", ""))));
- DocListCast(Cast(CurrentUserUtils.UserDocument.expandingButtons, Doc, null)?.data)?.map(btnDoc => {
- if (StrCast(Cast(btnDoc?.dragFactory, Doc, null)?.title)) {
- runInAction(() => this._addedKeys.add(StrCast(Cast(btnDoc?.dragFactory, Doc, null)?.title)));
- }
- });
}
- _addedKeys = new ObservableSet();
- _customRef = React.createRef<HTMLInputElement>();
+ return100 = () => 100;
+ @computed get scriptField() {
+ return ScriptField.MakeScript("switchView(firstDoc, this)", { this: Doc.name, heading: "string", checked: "string", containingTreeView: Doc.name, firstDoc: Doc.name },
+ { firstDoc: this.props.docViews[0].props.Document });
+ }
render() {
- const layout = Doc.Layout(this.props.docViews[0].Document);
+ const firstDoc = this.props.docViews[0].props.Document;
+ const templateName = StrCast(firstDoc.layoutKey, "layout").replace("layout_", "");
+ const noteTypesDoc = Cast(Doc.UserDoc().noteTypes, Doc, null);
+ const noteTypes = DocListCast(noteTypesDoc?.data);
+ const addedTypes = DocListCast(Cast(Doc.UserDoc().templateButtons, 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={"float"} name={"Float"} checked={this.props.docViews[0].Document.z ? true : false} toggle={this.toggleFloat} />);
+ templateMenu.push(<OtherToggle key={"audio"} name={"Audio"} checked={firstDoc._showAudio ? true : false} toggle={this.toggleAudio} />);
+ templateMenu.push(<OtherToggle key={"float"} name={"Float"} checked={firstDoc.z ? true : false} toggle={this.toggleFloat} />);
templateMenu.push(<OtherToggle key={"chrome"} name={"Chrome"} checked={layout._chromeStatus !== "disabled"} toggle={this.toggleChrome} />);
- this._addedKeys && Array.from(this._addedKeys).map(layout =>
- templateMenu.push(<OtherToggle key={layout} name={layout} checked={StrCast(this.props.docViews[0].Document.layoutKey, "layout") === "layout_" + layout} toggle={e => this.toggleLayout(e, layout)} />)
- );
+ templateMenu.push(<OtherToggle key={"default"} name={"Default"} checked={templateName === "layout"} toggle={this.toggleDefault} />);
+ if (noteTypesDoc) {
+ addedTypes.concat(noteTypes).map(template => template.treeViewChecked = ComputedField.MakeFunction("templateIsUsed(this, firstDoc)", { firstDoc: "string" }, { firstDoc: StrCast(firstDoc.title) }));
+ 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)} />));
+ templateMenu.push(
+ <CollectionTreeView
+ Document={Doc.UserDoc().templateDocs as Doc}
+ CollectionView={undefined}
+ ContainingCollectionDoc={undefined}
+ ContainingCollectionView={undefined}
+ onCheckedClick={this.scriptField!}
+ onChildClick={this.scriptField!}
+ LibraryPath={emptyPath}
+ dropAction={undefined}
+ active={returnTrue}
+ ContentScaling={returnOne}
+ bringToFront={emptyFunction}
+ focus={emptyFunction}
+ whenActiveChanged={emptyFunction}
+ ScreenToLocalTransform={Transform.Identity}
+ isSelected={returnFalse}
+ pinToPres={emptyFunction}
+ select={emptyFunction}
+ renderDepth={1}
+ addDocTab={returnFalse}
+ PanelWidth={this.return100}
+ PanelHeight={this.return100}
+ treeViewHideHeaderFields={true}
+ annotationsKey={""}
+ dontRegisterView={true}
+ fieldKey={"data"}
+ moveDocument={(doc: Doc) => false}
+ removeDocument={(doc: Doc) => false}
+ addDocument={(doc: Doc) => false} />
+ );
+ }
return <ul className="template-list" style={{ display: "block" }}>
- {templateMenu}
<input placeholder="+ layout" ref={this._customRef} onKeyPress={this.onCustomKeypress}></input>
+ {templateMenu}
</ul>;
}
-} \ No newline at end of file
+}
+
+Scripting.addGlobal(function switchView(doc: Doc, template: Doc) {
+ if (template.dragFactory) {
+ template = Cast(template.dragFactory, Doc, null);
+ }
+ const templateTitle = StrCast(template?.title);
+ return templateTitle && DocumentView.makeCustomViewClicked(doc, Docs.Create.FreeformDocument, templateTitle, template);
+});
+
+Scripting.addGlobal(function templateIsUsed(templateDoc: Doc, firstDocTitlte: string) {
+ const firstDoc = SelectionManager.SelectedDocuments().length ? SelectionManager.SelectedDocuments()[0].props.Document : undefined;
+ if (!firstDoc) return false;
+ const template = StrCast(templateDoc.dragFactory ? Cast(templateDoc.dragFactory, Doc, null)?.title : templateDoc.title);
+ return StrCast(firstDoc.layoutKey) === "layout_" + template ? 'check' : 'unchecked';
+ // return SelectionManager.SelectedDocuments().some(view => StrCast(view.props.Document.layoutKey) === "layout_" + template) ? 'check' : 'unchecked'
+}); \ No newline at end of file