diff options
Diffstat (limited to 'src/client')
| -rw-r--r-- | src/client/documents/Documents.ts | 85 | ||||
| -rw-r--r-- | src/client/util/DragManager.ts | 2 | ||||
| -rw-r--r-- | src/client/views/InkingCanvas.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/Main.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionFreeFormView.tsx | 9 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionSchemaView.tsx | 10 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionView.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionViewBase.tsx | 29 | ||||
| -rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 11 | ||||
| -rw-r--r-- | src/client/views/nodes/FormattedTextBox.tsx | 8 |
10 files changed, 90 insertions, 70 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index a92cf97fe..3aa575dbb 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -1,30 +1,27 @@ +import { AudioField } from "../../fields/AudioField"; import { Document } from "../../fields/Document"; -import { Server } from "../Server"; +import { Field } from "../../fields/Field"; +import { HtmlField } from "../../fields/HtmlField"; +import { ImageField } from "../../fields/ImageField"; +import { InkField, StrokeData } from "../../fields/InkField"; +import { Key } from "../../fields/Key"; import { KeyStore } from "../../fields/KeyStore"; -import { TextField } from "../../fields/TextField"; -import { NumberField } from "../../fields/NumberField"; import { ListField } from "../../fields/ListField"; -import { FormattedTextBox } from "../views/nodes/FormattedTextBox"; -import { ImageField } from "../../fields/ImageField"; -import { ImageBox } from "../views/nodes/ImageBox"; +import { PDFField } from "../../fields/PDFField"; +import { TextField } from "../../fields/TextField"; +import { VideoField } from "../../fields/VideoField"; import { WebField } from "../../fields/WebField"; -import { WebBox } from "../views/nodes/WebBox"; +import { Server } from "../Server"; +import { CollectionPDFView } from "../views/collections/CollectionPDFView"; +import { CollectionVideoView } from "../views/collections/CollectionVideoView"; import { CollectionView, CollectionViewType } from "../views/collections/CollectionView"; -import { HtmlField } from "../../fields/HtmlField"; -import { Key } from "../../fields/Key" -import { Field } from "../../fields/Field"; -import { KeyValueBox } from "../views/nodes/KeyValueBox" -import { KVPField } from "../../fields/KVPField"; -import { VideoField } from "../../fields/VideoField" -import { VideoBox } from "../views/nodes/VideoBox"; -import { AudioField } from "../../fields/AudioField"; import { AudioBox } from "../views/nodes/AudioBox"; -import { PDFField } from "../../fields/PDFField"; +import { FormattedTextBox } from "../views/nodes/FormattedTextBox"; +import { ImageBox } from "../views/nodes/ImageBox"; +import { KeyValueBox } from "../views/nodes/KeyValueBox"; import { PDFBox } from "../views/nodes/PDFBox"; -import { CollectionPDFView } from "../views/collections/CollectionPDFView"; -import { RichTextField } from "../../fields/RichTextField"; -import { CollectionVideoView } from "../views/collections/CollectionVideoView"; -import { StrokeData, InkField } from "../../fields/InkField"; +import { VideoBox } from "../views/nodes/VideoBox"; +import { WebBox } from "../views/nodes/WebBox"; export interface DocumentOptions { x?: number; @@ -74,24 +71,29 @@ export namespace Documents { }); } function assignOptions(doc: Document, options: DocumentOptions): Document { - if (options.x !== undefined) { doc.SetNumber(KeyStore.X, options.x); } - if (options.y !== undefined) { doc.SetNumber(KeyStore.Y, options.y); } - if (options.width !== undefined) { doc.SetNumber(KeyStore.Width, options.width); } - if (options.height !== undefined) { doc.SetNumber(KeyStore.Height, options.height); } if (options.nativeWidth !== undefined) { doc.SetNumber(KeyStore.NativeWidth, options.nativeWidth); } if (options.nativeHeight !== undefined) { doc.SetNumber(KeyStore.NativeHeight, options.nativeHeight); } if (options.title !== undefined) { doc.SetText(KeyStore.Title, options.title); } - if (options.panx !== undefined) { doc.SetNumber(KeyStore.PanX, options.panx); } - if (options.pany !== undefined) { doc.SetNumber(KeyStore.PanY, options.pany); } if (options.page !== undefined) { doc.SetNumber(KeyStore.Page, options.page); } if (options.scale !== undefined) { doc.SetNumber(KeyStore.Scale, options.scale); } if (options.viewType !== undefined) { doc.SetNumber(KeyStore.ViewType, options.viewType); } if (options.backgroundColor !== undefined) { doc.SetText(KeyStore.BackgroundColor, options.backgroundColor); } + if (options.ink !== undefined) { doc.Set(KeyStore.Ink, new InkField(options.ink)); } if (options.layout !== undefined) { doc.SetText(KeyStore.Layout, options.layout); } if (options.layoutKeys !== undefined) { doc.Set(KeyStore.LayoutKeys, new ListField(options.layoutKeys)); } - if (options.ink !== undefined) { doc.Set(KeyStore.Ink, new InkField(options.ink)); } return doc; } + + function assignToDelegate(doc: Document, options: DocumentOptions): Document { + if (options.x !== undefined) { doc.SetNumber(KeyStore.X, options.x); } + if (options.y !== undefined) { doc.SetNumber(KeyStore.Y, options.y); } + if (options.width !== undefined) { doc.SetNumber(KeyStore.Width, options.width); } + if (options.height !== undefined) { doc.SetNumber(KeyStore.Height, options.height); } + if (options.panx !== undefined) { doc.SetNumber(KeyStore.PanX, options.panx); } + if (options.pany !== undefined) { doc.SetNumber(KeyStore.PanY, options.pany); } + return doc + } + function setupPrototypeOptions(protoId: string, title: string, layout: string, options: DocumentOptions): Document { return assignOptions(new Document(protoId), { ...options, title: title, layout: layout }); } @@ -159,8 +161,7 @@ export namespace Documents { export function ImageDocument(url: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetImagePrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] }, - [new URL(url), ImageField]); + return assignToDelegate(SetInstanceOptions(GetImagePrototype(), options, [new URL(url), ImageField]).MakeDelegate(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] }); // let doc = SetInstanceOptions(GetImagePrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] }, // [new URL(url), ImageField]); // doc.SetText(KeyStore.Caption, "my caption..."); @@ -169,34 +170,38 @@ export namespace Documents { // return doc; } export function VideoDocument(url: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetVideoPrototype(), options, [new URL(url), VideoField]); + return assignToDelegate(SetInstanceOptions(GetVideoPrototype(), options, [new URL(url), VideoField]), options); } export function AudioDocument(url: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetAudioPrototype(), options, [new URL(url), AudioField]); + return assignToDelegate(SetInstanceOptions(GetAudioPrototype(), options, [new URL(url), AudioField]), options); } + export function TextDocument(options: DocumentOptions = {}) { - return SetInstanceOptions(GetTextPrototype(), options, ["", TextField]); + return assignToDelegate(SetInstanceOptions(GetTextPrototype(), options, ["", TextField]).MakeDelegate(), options); } export function PdfDocument(url: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetPdfPrototype(), options, [new URL(url), PDFField]); + return assignToDelegate(SetInstanceOptions(GetPdfPrototype(), options, [new URL(url), PDFField]).MakeDelegate(), options); } export function WebDocument(url: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetWebPrototype(), options, [new URL(url), WebField]); + return assignToDelegate(SetInstanceOptions(GetWebPrototype(), options, [new URL(url), WebField]).MakeDelegate(), options); } export function HtmlDocument(html: string, options: DocumentOptions = {}) { - return SetInstanceOptions(GetWebPrototype(), options, [html, HtmlField]); + return assignToDelegate(SetInstanceOptions(GetWebPrototype(), options, [html, HtmlField]).MakeDelegate(), options); } export function KVPDocument(document: Document, options: DocumentOptions = {}, id?: string) { - return SetInstanceOptions(GetKVPPrototype(), options, document, id) + return assignToDelegate(SetInstanceOptions(GetKVPPrototype(), options, document, id), options) } - export function FreeformDocument(documents: Array<Document>, options: DocumentOptions, id?: string) { - return SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Freeform }, [documents, ListField], id) + export function FreeformDocument(documents: Array<Document>, options: DocumentOptions, id?: string, makePrototype: boolean = true) { + if (!makePrototype) { + return SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Freeform }, [documents, ListField], id) + } + return assignToDelegate(SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Freeform }, [documents, ListField], id).MakeDelegate(), options) } export function SchemaDocument(documents: Array<Document>, options: DocumentOptions, id?: string) { - return SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Schema }, [documents, ListField], id) + return assignToDelegate(SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Schema }, [documents, ListField], id), options) } export function DockDocument(config: string, options: DocumentOptions, id?: string) { - return SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Docking }, [config, TextField], id) + return assignToDelegate(SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Docking }, [config, TextField], id), options) } // example of custom display string for an image that shows a caption. diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts index 4a61220a5..c0abec407 100644 --- a/src/client/util/DragManager.ts +++ b/src/client/util/DragManager.ts @@ -123,7 +123,7 @@ export namespace DragManager { // however, PDF's have a thumbnail field that contains an image of their canvas. // So we replace the pdf's canvas with the image thumbnail const docView: DocumentView = dragData["documentView"]; - const doc: Document = docView ? docView.props.Document : dragData["document"]; + const doc: Document = dragData["document"]; if (doc) { var pdfBox = dragElement.getElementsByClassName("pdfBox-cont")[0] as HTMLElement; diff --git a/src/client/views/InkingCanvas.tsx b/src/client/views/InkingCanvas.tsx index 84c47f616..d7b8bf3c3 100644 --- a/src/client/views/InkingCanvas.tsx +++ b/src/client/views/InkingCanvas.tsx @@ -46,7 +46,7 @@ export class InkingCanvas extends React.Component<InkCanvasProps> { } set inkData(value: StrokeMap) { - this.props.Document.SetData(KeyStore.Ink, value, InkField); + this.props.Document.SetOnPrototype(KeyStore.Ink, new InkField(value)); } componentDidMount() { diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 437d025ef..2b5efa07d 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -77,7 +77,7 @@ Documents.initProtos(mainDocId, (res?: Document) => { // bcz: strangely, we need a timeout to prevent exceptions/issues initializing GoldenLayout (the rendering engine for Main Container) setTimeout(() => { - mainfreeform = Documents.FreeformDocument([], { x: 0, y: 400, title: "mini collection" }); + mainfreeform = Documents.FreeformDocument([], { x: 0, y: 400, title: "mini collection" }, undefined, false); var dockingLayout = { content: [{ type: 'row', content: [CollectionDockingView.makeDocumentConfig(mainfreeform)] }] }; mainContainer.SetText(KeyStore.Data, JSON.stringify(dockingLayout)); diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx index cca57912c..808a22a5d 100644 --- a/src/client/views/collections/CollectionFreeFormView.tsx +++ b/src/client/views/collections/CollectionFreeFormView.tsx @@ -76,12 +76,11 @@ export class CollectionFreeFormView extends CollectionViewBase { @action drop = (e: Event, de: DragManager.DropEvent) => { super.drop(e, de); - const docView: DocumentView = de.data["documentView"]; - let doc: Document = docView ? docView.props.Document : de.data["document"]; + let screenX = de.x - (de.data["xOffset"] as number || 0); + let screenY = de.y - (de.data["yOffset"] as number || 0); + const [x, y] = this.getTransform().transformPoint(screenX, screenY); + let doc: Document = de.data["document"]; if (doc) { - let screenX = de.x - (de.data["xOffset"] as number || 0); - let screenY = de.y - (de.data["yOffset"] as number || 0); - const [x, y] = this.getTransform().transformPoint(screenX, screenY); doc.SetNumber(KeyStore.X, x); doc.SetNumber(KeyStore.Y, y); this.bringToFront(doc); diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx index 8c1aeef2c..f88a62a0f 100644 --- a/src/client/views/collections/CollectionSchemaView.tsx +++ b/src/client/views/collections/CollectionSchemaView.tsx @@ -153,11 +153,11 @@ export class CollectionSchemaView extends CollectionViewBase { // e.preventDefault(); // } else { - if (e.buttons === 1) { - if (this.props.isSelected()) { - e.stopPropagation(); - } - } + // if (e.buttons === 1) { + // if (this.props.isSelected()) { + // e.stopPropagation(); + // } + // } } } diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index d9b2722a6..40acf466e 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -55,7 +55,7 @@ export class CollectionView extends React.Component<CollectionViewProps> { const value = props.Document.GetData(props.fieldKey, ListField, new Array<Document>()) value.push(doc); } else { - props.Document.SetData(props.fieldKey, [doc], ListField); + props.Document.SetOnPrototype(props.fieldKey, new ListField([doc])); } } diff --git a/src/client/views/collections/CollectionViewBase.tsx b/src/client/views/collections/CollectionViewBase.tsx index d9598aa72..fd0e84fb1 100644 --- a/src/client/views/collections/CollectionViewBase.tsx +++ b/src/client/views/collections/CollectionViewBase.tsx @@ -3,7 +3,7 @@ import { Document } from "../../../fields/Document"; import { ListField } from "../../../fields/ListField"; import React = require("react"); import { KeyStore } from "../../../fields/KeyStore"; -import { FieldWaiting } from "../../../fields/Field"; +import { FieldWaiting, Field, Opt } from "../../../fields/Field"; import { undoBatch } from "../../util/UndoManager"; import { DragManager } from "../../util/DragManager"; import { DocumentView } from "../nodes/DocumentView"; @@ -11,6 +11,7 @@ import { Documents, DocumentOptions } from "../../documents/Documents"; import { Key } from "../../../fields/Key"; import { Transform } from "../../util/Transform"; import { CollectionView } from "./CollectionView"; +import { NumberField } from "../../../fields/NumberField"; export interface CollectionViewProps { fieldKey: Key; @@ -45,16 +46,26 @@ export class CollectionViewBase extends React.Component<SubCollectionViewProps> @undoBatch @action protected drop(e: Event, de: DragManager.DropEvent) { - const docView: DocumentView = de.data["documentView"]; - const doc: Document = de.data["document"]; - - if (docView && (!docView.props.ContainingCollectionView || docView.props.ContainingCollectionView !== this.props.CollectionView)) { - if (docView.props.RemoveDocument) { - docView.props.RemoveDocument(docView.props.Document); + let docToAlias = de.data["documentToAlias"]; + let docView = de.data["documentView"]; + let doc = docToAlias ? docToAlias.CreateAlias() : de.data["document"]; + if (docToAlias) { + [KeyStore.Width, KeyStore.Height].map(key => + docToAlias.GetTAsync(key, NumberField, (f: Opt<NumberField>) => { + if (f) { + doc.SetNumber(key, f.Data) + } + }) + ); + this.props.addDocument(doc); + } else if (docView) { + if (doc && docView.props.RemoveDocument && docView.props.ContainingCollectionView !== this.props.CollectionView) { + docView.props.RemoveDocument(doc); + this.props.removeDocument(doc); // bcz: not good -- want to check if it's there and then add if it isn't + this.props.addDocument(doc); } - this.props.addDocument(docView.props.Document); } else if (doc) { - this.props.removeDocument(doc); + this.props.removeDocument(doc); // bcz: not good -- want to check if it's there and then add if it isn't this.props.addDocument(doc); } e.stopPropagation(); diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 1f803bd45..6a3967b3b 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -103,7 +103,7 @@ export class DocumentView extends React.Component<DocumentViewProps> { this._downY = e.clientY; if (e.shiftKey && e.buttons === 2) { if (this.props.isTopMost) { - this.startDragging(e.pageX, e.pageY); + this.startDragging(e.pageX, e.pageY, e.altKey || e.ctrlKey); } else CollectionDockingView.Instance.StartOtherDrag(this.props.Document, e); e.stopPropagation(); @@ -160,18 +160,19 @@ export class DocumentView extends React.Component<DocumentViewProps> { } } - startDragging(x: number, y: number) { + startDragging(x: number, y: number, dropAliasOfDraggedDoc: boolean) { if (this._mainCont.current) { const [left, top] = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0); let dragData: { [id: string]: any } = {}; dragData["documentView"] = this; + dragData[dropAliasOfDraggedDoc ? "documentToAlias" : "document"] = this.props.Document; dragData["xOffset"] = x - left; dragData["yOffset"] = y - top; DragManager.StartDrag(this._mainCont.current, dragData, { handlers: { dragComplete: action(() => { }), }, - hideSource: true + hideSource: !dropAliasOfDraggedDoc }) } } @@ -184,7 +185,7 @@ export class DocumentView extends React.Component<DocumentViewProps> { document.removeEventListener("pointermove", this.onPointerMove) document.removeEventListener("pointerup", this.onPointerUp); if (!this.topMost || e.buttons == 2 || e.altKey) { - this.startDragging(e.x, e.y); + this.startDragging(e.x, e.y, e.ctrlKey || e.altKey); } } e.stopPropagation(); @@ -210,7 +211,7 @@ export class DocumentView extends React.Component<DocumentViewProps> { fieldsClicked = (e: React.MouseEvent): void => { if (this.props.AddDocument) { - this.props.AddDocument(Documents.KVPDocument(this.props.Document)); + this.props.AddDocument(Documents.KVPDocument(this.props.Document, { width: 300, height: 300 })); } } fullScreenClicked = (e: React.MouseEvent): void => { diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index d7026ed67..4bd5726f4 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -55,7 +55,9 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { if (this._editorView) { const state = this._editorView.state.apply(tx); this._editorView.updateState(state); - this.props.doc.SetData(this.props.fieldKey, JSON.stringify(state.toJSON()), RichTextField); + const { doc, fieldKey } = this.props; + doc.SetOnPrototype(fieldKey, new RichTextField(JSON.stringify(state.toJSON()))) + // doc.SetData(fieldKey, JSON.stringify(state.toJSON()), RichTextField); } } @@ -114,7 +116,9 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { @action onChange(e: React.ChangeEvent<HTMLInputElement>) { - this.props.doc.SetData(this.props.fieldKey, e.target.value, RichTextField); + const { fieldKey, doc } = this.props; + doc.SetOnPrototype(fieldKey, new RichTextField(e.target.value)) + // doc.SetData(fieldKey, e.target.value, RichTextField); } onPointerDown = (e: React.PointerEvent): void => { if (e.buttons === 1 && this.props.isSelected() && !e.altKey) { |
