aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/DocumentDecorations.tsx40
-rw-r--r--src/client/views/Main.tsx39
2 files changed, 35 insertions, 44 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 7bddc298e..3b2cd2626 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -1,11 +1,14 @@
-import { observable, computed } from "mobx";
+import { observable, computed, action } from "mobx";
import React = require("react");
import { SelectionManager } from "../util/SelectionManager";
import { observer } from "mobx-react";
import './DocumentDecorations.scss'
import { CollectionFreeFormView } from "./collections/CollectionFreeFormView";
import ContentEditable from 'react-contenteditable'
-import { KeyStore } from '../../fields/Key'
+import { KeyStore } from "../../fields/KeyStore";
+import { NumberField } from "../../fields/NumberField";
+import { Document } from "../../fields/Document";
+import { DocumentView } from "./nodes/DocumentView";
@observer
export class DocumentDecorations extends React.Component<{}, { value: string }> {
@@ -14,6 +17,9 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
private _isPointerDown = false;
@observable private _opacity = 1;
private keyinput: React.RefObject<HTMLInputElement>;
+ @observable private _documents: DocumentView[] = [];
+ //@observable private _title: string = this._documents[0].props.Document.Title;
+ @observable private _title: string = document.title;
constructor(props: Readonly<{}>) {
super(props)
@@ -23,26 +29,42 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
this.keyinput = React.createRef();
}
- handleChange(event: any) {
- this.setState({ value: event.target.value });
- console.log("Input box has changed")
+ @action
+ handleChange = (event: any) => {
+ //this.setState({ value: event.target.value });
+ this._title = event.target.value;
+ console.log("Input box has changed");
};
- enterPressed(e: any) {
+ @action
+ enterPressed = (e: any) => {
var key = e.keyCode || e.which;
// enter pressed
if (key == 13) {
var text = e.target.value;
if (text[0] == '#') {
- console.log("hashtag");
+ let command = text.slice(1, text.length);
+ if (command == "Title" || command == "title") {
+ this._title = this._documents[0].props.Document.Title;
+ }
+ else if (command == "Width" || command == "width") {
+ this._title = this._documents[0].props.Document.GetNumber(KeyStore.Width, 0).toString();
+ }
+ else {
+ this._title = "undefined key";
+ }
// TODO: Change field with switch statement
}
+ else {
+ this._title = document.title;
+ }
e.target.blur();
}
}
@computed
get Bounds(): { x: number, y: number, b: number, r: number } {
+ this._documents = SelectionManager.SelectedDocuments();
return SelectionManager.SelectedDocuments().reduce((bounds, documentView) => {
if (documentView.props.isTopMost) {
return bounds;
@@ -61,6 +83,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@computed
public get Hidden() { return this._hidden; }
public set Hidden(value: boolean) { this._hidden = value; }
+ private _hidden: boolean = false;
onPointerDown = (e: React.PointerEvent): void => {
e.stopPropagation();
@@ -178,8 +201,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
top: bounds.y - 20 - 20,
opacity: this._opacity
}}>
- <input ref={this.keyinput} className="title" type="text" name="dynbox" value={this.state.value} onChange={this.handleChange} onPointerDown={this.onPointerDown} onKeyPress={this.enterPressed} />
- {/* <div className="title" onPointerDown={this.onPointerDown}>{document.title}</div> */}
+ <input ref={this.keyinput} className="title" type="text" name="dynbox" value={this._title} onChange={this.handleChange} onPointerDown={this.onPointerDown} onKeyPress={this.enterPressed} />
<div id="documentDecorations-topLeftResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
<div id="documentDecorations-topResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
<div id="documentDecorations-topRightResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 4a3710e74..6e5b84075 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -18,6 +18,9 @@ import { DocumentDecorations } from './DocumentDecorations';
import { DocumentView } from './nodes/DocumentView';
import "./Main.scss";
import { InkingControl } from './InkingControl';
+import { NumberField } from '../../fields/NumberField';
+import { TextField } from '../../fields/TextField';
+import { ListField } from '../../fields/ListField';
configure({ enforceActions: "observed" }); // causes errors to be generated when modifying an observable outside of an action
@@ -30,40 +33,6 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
}), true)
-<<<<<<< HEAD
-//runInAction(() =>
-{
- let doc1 = Documents.TextDocument({ title: "hello", width: 400, height: 300 });
- let doc2 = doc1.MakeDelegate();
- doc2.Set(KS.X, new NumberField(150));
- doc2.Set(KS.Y, new NumberField(500));
- let doc3 = Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
- x: 450, y: 100, title: "dog", width: 606, height: 386, nativeWidth: 606, nativeHeight: 386
- });
- //doc3.Set(KeyStore.Data, new ImageField);
- const schemaDocs = Array.from(Array(5).keys()).map(v => Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
- x: 50 + 100 * v, y: 50, width: 100, height: 100, title: "cat" + v, nativeWidth: 606, nativeHeight: 386
- }));
- schemaDocs.push(doc3);
- schemaDocs[0].SetData(KS.Author, "Tyler", TextField);
- schemaDocs[4].SetData(KS.Author, "Bob", TextField);
- schemaDocs.push(doc2);
- const doc7 = Documents.SchemaDocument(schemaDocs)
- const docset = [doc1, doc2, doc3, doc7];
- let doc4 = Documents.CollectionDocument(docset, {
- x: 0, y: 400, title: "mini collection"
- });
- // let doc5 = Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
- // x: 650, y: 500, width: 600, height: 600, title: "cat 2"
- // });
- let docset2 = [doc3, doc4, doc2];
- let doc6 = Documents.CollectionDocument(docset2, {
- x: 350, y: 100, width: 600, height: 600, title: "docking collection"
- });
- let mainNodes = null;// mainContainer.GetFieldT(KeyStore.Data, ListField);
- if (!mainNodes) {
- mainNodes = new ListField<Document>();
-=======
const mainDocId = "mainDoc";
let mainContainer: Document;
let mainfreeform: Document;
@@ -83,7 +52,6 @@ Documents.initProtos(mainDocId, (res?: Document) => {
mainContainer.SetText(KeyStore.Data, JSON.stringify(dockingLayout));
mainContainer.Set(KeyStore.ActiveFrame, mainfreeform);
}, 0);
->>>>>>> 96eede5f7d1706a3f7ac6ee02a85bb3da217f467
}
let imgurl = "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg";
@@ -141,3 +109,4 @@ Documents.initProtos(mainDocId, (res?: Document) => {
</div>),
document.getElementById('root'));
})
+
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 12:37:07 +0000