aboutsummaryrefslogtreecommitdiff
path: root/src/client
diff options
context:
space:
mode:
Diffstat (limited to 'src/client')
-rw-r--r--src/client/views/InkingCanvas.tsx29
-rw-r--r--src/client/views/InkingControl.tsx7
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx51
-rw-r--r--src/client/views/nodes/LinkEditor.tsx16
4 files changed, 49 insertions, 54 deletions
diff --git a/src/client/views/InkingCanvas.tsx b/src/client/views/InkingCanvas.tsx
index 47ee8eb85..1e26893c5 100644
--- a/src/client/views/InkingCanvas.tsx
+++ b/src/client/views/InkingCanvas.tsx
@@ -1,9 +1,5 @@
import { action, computed, trace, observable, runInAction } from "mobx";
import { observer } from "mobx-react";
-import { Document } from "../../fields/Document";
-import { FieldWaiting } from "../../fields/Field";
-import { InkField, InkTool, StrokeData, StrokeMap } from "../../fields/InkField";
-import { KeyStore } from "../../fields/KeyStore";
import { Utils } from "../../Utils";
import { Transform } from "../util/Transform";
import "./InkingCanvas.scss";
@@ -11,10 +7,13 @@ import { InkingControl } from "./InkingControl";
import { InkingStroke } from "./InkingStroke";
import React = require("react");
import { undoBatch, UndoManager } from "../util/UndoManager";
+import { StrokeData, InkField, InkTool } from "../../new_fields/InkField";
+import { Doc } from "../../new_fields/Doc";
+import { Cast, PromiseValue, NumCast } from "../../new_fields/Types";
interface InkCanvasProps {
getScreenTransform: () => Transform;
- Document: Document;
+ Document: Doc;
children: () => JSX.Element[];
}
@@ -23,7 +22,7 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
maxCanvasDim = 8192 / 2; // 1/2 of the maximum canvas dimension for Chrome
@observable inkMidX: number = 0;
@observable inkMidY: number = 0;
- private previousState?: StrokeMap;
+ private previousState?: Map<string, StrokeData>;
private _currentStrokeId: string = "";
public static IntersectStrokeRect(stroke: StrokeData, selRect: { left: number, top: number, width: number, height: number }): boolean {
return stroke.pathData.reduce((inside: boolean, val) => inside ||
@@ -33,9 +32,9 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
}
componentDidMount() {
- this.props.Document.GetTAsync(KeyStore.Ink, InkField, ink => runInAction(() => {
+ PromiseValue(Cast(this.props.Document.ink, InkField)).then(ink => runInAction(() => {
if (ink) {
- let bounds = Array.from(ink.Data).reduce(([mix, max, miy, may], [id, strokeData]) =>
+ let bounds = Array.from(ink.inkData).reduce(([mix, max, miy, may], [id, strokeData]) =>
strokeData.pathData.reduce(([mix, max, miy, may], p) =>
[Math.min(mix, p.x), Math.max(max, p.x), Math.min(miy, p.y), Math.max(may, p.y)],
[mix, max, miy, may]),
@@ -47,13 +46,13 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
}
@computed
- get inkData(): StrokeMap {
- let map = this.props.Document.GetT(KeyStore.Ink, InkField);
- return !map || map === FieldWaiting ? new Map : new Map(map.Data);
+ get inkData(): Map<string, StrokeData> {
+ let map = Cast(this.props.Document.ink, InkField);
+ return !map ? new Map : new Map(map.inkData);
}
- set inkData(value: StrokeMap) {
- this.props.Document.SetDataOnPrototype(KeyStore.Ink, value, InkField);
+ set inkData(value: Map<string, StrokeData>) {
+ Doc.SetOnPrototype(this.props.Document, "ink", new InkField(value));
}
@action
@@ -78,7 +77,7 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
color: InkingControl.Instance.selectedColor,
width: InkingControl.Instance.selectedWidth,
tool: InkingControl.Instance.selectedTool,
- page: this.props.Document.GetNumber(KeyStore.CurPage, -1)
+ page: NumCast(this.props.Document.curPage, -1)
});
this.inkData = data;
}
@@ -137,7 +136,7 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
@computed
get drawnPaths() {
- let curPage = this.props.Document.GetNumber(KeyStore.CurPage, -1);
+ let curPage = NumCast(this.props.Document.curPage, -1);
let paths = Array.from(this.inkData).reduce((paths, [id, strokeData]) => {
if (strokeData.page === -1 || strokeData.page === curPage) {
paths.push(<InkingStroke key={id} id={id} line={strokeData.pathData}
diff --git a/src/client/views/InkingControl.tsx b/src/client/views/InkingControl.tsx
index 9a68f0671..4b3dbd4e0 100644
--- a/src/client/views/InkingControl.tsx
+++ b/src/client/views/InkingControl.tsx
@@ -2,15 +2,14 @@ import { observable, action, computed } from "mobx";
import { CirclePicker, ColorResult } from 'react-color';
import React = require("react");
-import { InkTool } from "../../fields/InkField";
import { observer } from "mobx-react";
import "./InkingControl.scss";
import { library } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faPen, faHighlighter, faEraser, faBan } from '@fortawesome/free-solid-svg-icons';
import { SelectionManager } from "../util/SelectionManager";
-import { KeyStore } from "../../fields/KeyStore";
-import { TextField } from "../../fields/TextField";
+import { InkTool } from "../../new_fields/InkField";
+import { Doc } from "../../new_fields/Doc";
library.add(faPen, faHighlighter, faEraser, faBan);
@@ -39,7 +38,7 @@ export class InkingControl extends React.Component {
if (SelectionManager.SelectedDocuments().length === 1) {
var sdoc = SelectionManager.SelectedDocuments()[0];
if (sdoc.props.ContainingCollectionView) {
- sdoc.props.Document.SetDataOnPrototype(KeyStore.BackgroundColor, color.hex, TextField);
+ Doc.SetOnPrototype(sdoc.props.Document, "backgroundColor", color.hex);
}
}
}
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 905b48db7..c9d8d83c8 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -3,20 +3,19 @@ import { faCaretDown, faCaretRight, faTrashAlt } from '@fortawesome/free-solid-s
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { action, observable } from "mobx";
import { observer } from "mobx-react";
-import { Document } from "../../../fields/Document";
-import { FieldWaiting } from "../../../fields/Field";
-import { KeyStore } from "../../../fields/KeyStore";
-import { ListField } from "../../../fields/ListField";
import { DragManager, SetupDrag } from "../../util/DragManager";
import { EditableView } from "../EditableView";
import { CollectionSubView } from "./CollectionSubView";
import "./CollectionTreeView.scss";
import React = require("react");
+import { Document, listSpec } from '../../../new_fields/Schema';
+import { Cast, StrCast, BoolCast } from '../../../new_fields/Types';
+import { Doc, Id } from '../../../new_fields/Doc';
export interface TreeViewProps {
- document: Document;
- deleteDoc: (doc: Document) => void;
+ document: Doc;
+ deleteDoc: (doc: Doc) => void;
moveDocument: DragManager.MoveFunction;
copyOnDrag: boolean;
}
@@ -43,9 +42,9 @@ class TreeView extends React.Component<TreeViewProps> {
@action
remove = (document: Document) => {
- var children = this.props.document.GetT<ListField<Document>>(KeyStore.Data, ListField);
- if (children && children !== FieldWaiting) {
- children.Data.splice(children.Data.indexOf(document), 1);
+ var children = Cast(this.props.document.data, listSpec(Doc));
+ if (children) {
+ children.splice(children.indexOf(document), 1);
}
}
@@ -80,15 +79,15 @@ class TreeView extends React.Component<TreeViewProps> {
display={"inline"}
contents={titleString}
height={36}
- GetValue={() => this.props.document.Title}
+ GetValue={() => StrCast(this.props.document.title)}
SetValue={(value: string) => {
- this.props.document.SetText(KeyStore.Title, value);
+ this.props.document.title = value;
return true;
}}
/>);
return (
<div className="docContainer" ref={reference} onPointerDown={onItemDown}>
- {editableView(this.props.document.Title)}
+ {editableView(StrCast(this.props.document.title))}
<div className="delete-button" onClick={this.delete}><FontAwesomeIcon icon="trash-alt" size="xs" /></div>
</div >);
}
@@ -96,12 +95,12 @@ class TreeView extends React.Component<TreeViewProps> {
render() {
let bulletType = BulletType.List;
let childElements: JSX.Element | undefined = undefined;
- var children = this.props.document.GetT<ListField<Document>>(KeyStore.Data, ListField);
- if (children && children !== FieldWaiting) { // add children for a collection
+ var children = Cast(this.props.document.data, listSpec(Doc));
+ if (children) { // add children for a collection
if (!this._collapsed) {
bulletType = BulletType.Collapsible;
childElements = <ul>
- {children.Data.map(value => <TreeView key={value.Id} document={value} deleteDoc={this.remove} moveDocument={this.move} copyOnDrag={this.props.copyOnDrag} />)}
+ {children.map(value => <TreeView key={value[Id]} document={value} deleteDoc={this.remove} moveDocument={this.move} copyOnDrag={this.props.copyOnDrag} />)}
</ul >;
}
else bulletType = BulletType.Collapsed;
@@ -117,22 +116,22 @@ class TreeView extends React.Component<TreeViewProps> {
}
@observer
-export class CollectionTreeView extends CollectionSubView {
+export class CollectionTreeView extends CollectionSubView(Document) {
@action
remove = (document: Document) => {
- var children = this.props.Document.GetT<ListField<Document>>(KeyStore.Data, ListField);
- if (children && children !== FieldWaiting) {
- children.Data.splice(children.Data.indexOf(document), 1);
+ const children = this.children;
+ if (children) {
+ children.splice(children.indexOf(document), 1);
}
}
render() {
- let children = this.props.Document.GetT<ListField<Document>>(KeyStore.Data, ListField);
- let copyOnDrag = this.props.Document.GetBoolean(KeyStore.CopyDraggedItems, false);
- let childrenElement = !children || children === FieldWaiting ? (null) :
- (children.Data.map(value =>
- <TreeView document={value} key={value.Id} deleteDoc={this.remove} moveDocument={this.props.moveDocument} copyOnDrag={copyOnDrag} />)
+ const children = this.children;
+ let copyOnDrag = BoolCast(this.props.Document.copyDraggedItems, false);
+ let childrenElement = !children ? (null) :
+ (children.map(value =>
+ <TreeView document={value} key={value[Id]} deleteDoc={this.remove} moveDocument={this.props.moveDocument} copyOnDrag={copyOnDrag} />)
);
return (
@@ -145,9 +144,9 @@ export class CollectionTreeView extends CollectionSubView {
contents={this.props.Document.Title}
display={"inline"}
height={72}
- GetValue={() => this.props.Document.Title}
+ GetValue={() => StrCast(this.props.Document.title)}
SetValue={(value: string) => {
- this.props.Document.SetText(KeyStore.Title, value);
+ this.props.Document.title = value;
return true;
}} />
</div>
diff --git a/src/client/views/nodes/LinkEditor.tsx b/src/client/views/nodes/LinkEditor.tsx
index bde50fed8..f82c6e9cb 100644
--- a/src/client/views/nodes/LinkEditor.tsx
+++ b/src/client/views/nodes/LinkEditor.tsx
@@ -3,31 +3,29 @@ import React = require("react");
import { SelectionManager } from "../../util/SelectionManager";
import { observer } from "mobx-react";
import './LinkEditor.scss';
-import { KeyStore } from '../../../fields/KeyStore';
import { props } from "bluebird";
import { DocumentView } from "./DocumentView";
-import { Document } from "../../../fields/Document";
-import { TextField } from "../../../fields/TextField";
import { link } from "fs";
+import { StrCast } from "../../../new_fields/Types";
+import { Doc } from "../../../new_fields/Doc";
interface Props {
- linkDoc: Document;
+ linkDoc: Doc;
showLinks: () => void;
}
@observer
export class LinkEditor extends React.Component<Props> {
- @observable private _nameInput: string = this.props.linkDoc.GetText(KeyStore.Title, "");
- @observable private _descriptionInput: string = this.props.linkDoc.GetText(KeyStore.LinkDescription, "");
+ @observable private _nameInput: string = StrCast(this.props.linkDoc.title);
+ @observable private _descriptionInput: string = StrCast(this.props.linkDoc.linkDescription);
onSaveButtonPressed = (e: React.PointerEvent): void => {
- console.log("view down");
e.stopPropagation();
- this.props.linkDoc.SetData(KeyStore.Title, this._nameInput, TextField);
- this.props.linkDoc.SetData(KeyStore.LinkDescription, this._descriptionInput, TextField);
+ this.props.linkDoc.title = this._nameInput;
+ this.props.linkDoc.linkDescription = this._descriptionInput;
this.props.showLinks();
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-22 03:35:46 +0000