diff options
34 files changed, 10 insertions, 1168 deletions
diff --git a/.DS_Store b/.DS_Store Binary files differnew file mode 100644 index 000000000..8493b4a74 --- /dev/null +++ b/.DS_Store diff --git a/package-lock.json b/package-lock.json index a4939f1cb..5b62532c4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9119,7 +9119,7 @@ }, "regjsparser": { "version": "0.1.5", - "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", + "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=", "dev": true, "requires": { @@ -9470,7 +9470,7 @@ }, "sha.js": { "version": "2.4.11", - "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", + "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==", "dev": true, "requires": { @@ -9962,7 +9962,7 @@ }, "strip-eof": { "version": "1.0.0", - "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", + "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=" }, "strip-indent": { diff --git a/src/.DS_Store b/src/.DS_Store Binary files differnew file mode 100644 index 000000000..4d6acb95a --- /dev/null +++ b/src/.DS_Store diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index d8db6ee79..605a99bef 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -69,7 +69,7 @@ export namespace Documents { export function TextDocument(options: DocumentOptions = {}): Document { let doc = GetTextPrototype().MakeDelegate(); setupOptions(doc, options); - // doc.SetField(KeyStore.Data, new RichTextField()); + // doc.Set(KeyStore.Data, new RichTextField()); return doc; } @@ -131,7 +131,7 @@ export namespace Documents { imageProto.Set(KeyStore.Height, new NumberField(300)); imageProto.Set(KeyStore.Layout, new TextField(CollectionFreeFormView.LayoutString("AnnotationsKey"))); imageProto.Set(KeyStore.BackgroundLayout, new TextField(ImageBox.LayoutString())); - // imageProto.SetField(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />')); + // imageProto.Set(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />')); imageProto.Set(KeyStore.LayoutKeys, new ListField([KeyStore.Data, KeyStore.Annotations])); Server.AddDocument(imageProto); return imageProto; diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 3a73f2fde..b13d6486b 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -13,6 +13,7 @@ import { CollectionSchemaView } from "../collections/CollectionSchemaView"; import { CollectionViewBase, COLLECTION_BORDER_WIDTH } from "../collections/CollectionViewBase"; import { FormattedTextBox } from "../nodes/FormattedTextBox"; import { ImageBox } from "../nodes/ImageBox"; +import { WebBox } from "../nodes/WebBox"; import "./NodeView.scss"; import React = require("react"); import { Transform } from "../../util/Transform"; @@ -151,7 +152,7 @@ export class DocumentView extends React.Component<DocumentViewProps> { bindings.DocumentView = this; // set the DocumentView to this if it hasn't already been set by a sub-class during its render method. } var annotated = <JsxParser - components={{ FormattedTextBox: FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }} + components={{ FormattedTextBox: FormattedTextBox, ImageBox, WebBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }} bindings={bindings} jsx={this.backgroundLayout} showWarnings={true} @@ -166,7 +167,7 @@ export class DocumentView extends React.Component<DocumentViewProps> { return ( <div className="node" ref={this._mainCont} style={{ width: strwidth, height: strheight, transformOrigin: "left top", transform: `scale(${this.props.Scaling},${this.props.Scaling})` }}> <JsxParser - components={{ FormattedTextBox: FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }} + components={{ FormattedTextBox: FormattedTextBox, ImageBox, WebBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }} bindings={bindings} jsx={this.layout} showWarnings={true} diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss index 2bd8b1d3c..9df984d68 100644 --- a/src/client/views/nodes/WebBox.scss +++ b/src/client/views/nodes/WebBox.scss @@ -1,11 +1,11 @@ -.imageBox-cont { +.webBox-cont { padding: 0vw; position: absolute; width: 100% } -.imageBox-button { +.webBox-button { padding : 0vw; border: none; width : 100%; diff --git a/src/documents/Documents.ts b/src/documents/Documents.ts deleted file mode 100644 index beee44bee..000000000 --- a/src/documents/Documents.ts +++ /dev/null @@ -1,92 +0,0 @@ -import { Document } from "../fields/Document"; -import { KeyStore } from "../fields/Key"; -import { TextField } from "../fields/TextField"; -import { NumberField } from "../fields/NumberField"; -import { ListField } from "../fields/ListField"; - -interface DocumentOptions { - x?: number; - y?: number; - width?: number; - height?: number; -} - -export namespace Documents { - function setupOptions(doc: Document, options: DocumentOptions): void { - if(options.x) { - doc.SetFieldValue(KeyStore.X, options.x, NumberField); - } - if(options.y) { - doc.SetFieldValue(KeyStore.Y, options.y, NumberField); - } - if(options.width) { - doc.SetFieldValue(KeyStore.Width, options.width, NumberField); - } - if(options.height) { - doc.SetFieldValue(KeyStore.Height, options.height, NumberField); - } - } - - let textProto:Document; - function GetTextPrototype(): Document { - if(!textProto) { - textProto = new Document(); - textProto.SetField(KeyStore.X, new NumberField(0)); - textProto.SetField(KeyStore.Y, new NumberField(0)); - textProto.SetField(KeyStore.Width, new NumberField(300)); - textProto.SetField(KeyStore.Height, new NumberField(150)); - textProto.SetField(KeyStore.Layout, new TextField("<FieldTextBox doc={doc} fieldKey={DataKey} />")); - textProto.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.Data])); - } - return textProto; - } - - export function TextDocument(text: string, options:DocumentOptions = {}): Document { - let doc = GetTextPrototype().MakeDelegate(); - setupOptions(doc, options); - // doc.SetField(KeyStore.Data, new TextField(text)); - return doc; - } - - let imageProto:Document; - function GetImagePrototype(): Document { - if(!imageProto) { - imageProto = new Document(); - imageProto.SetField(KeyStore.X, new NumberField(0)); - imageProto.SetField(KeyStore.Y, new NumberField(0)); - imageProto.SetField(KeyStore.Width, new NumberField(300)); - imageProto.SetField(KeyStore.Height, new NumberField(300)); - imageProto.SetField(KeyStore.Layout, new TextField('<img src={Data} alt="Image not found"/>')); - imageProto.SetField(KeyStore.LayoutFields, new ListField([KeyStore.Data])); - } - return imageProto; - } - - export function ImageDocument(url: string, options:DocumentOptions = {}): Document { - let doc = GetImagePrototype().MakeDelegate(); - setupOptions(doc, options); - doc.SetField(KeyStore.Data, new TextField(url)); - return doc; - } - - let collectionProto:Document; - function GetCollectionPrototype(): Document { - if(!collectionProto) { - collectionProto = new Document(); - collectionProto.SetField(KeyStore.X, new NumberField(150)); - collectionProto.SetField(KeyStore.Y, new NumberField(0)); - collectionProto.SetField(KeyStore.Width, new NumberField(300)); - collectionProto.SetField(KeyStore.Height, new NumberField(300)); - collectionProto.SetField(KeyStore.Layout, new TextField('<CollectionFreeFormView doc={doc} fieldKey={DataKey}/>')); - collectionProto.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.Data])); - } - return collectionProto; - } - - export function CollectionDocument( documents: Array<Document>, options:DocumentOptions = {}): Document { - let doc = GetCollectionPrototype().MakeDelegate(); - setupOptions(doc, options); - doc.SetField(KeyStore.Data, new ListField(documents)); - return doc; - } -}
\ No newline at end of file diff --git a/src/fields/Document 2.ts b/src/fields/Document 2.ts deleted file mode 100644 index 0bba9c21e..000000000 --- a/src/fields/Document 2.ts +++ /dev/null @@ -1,93 +0,0 @@ -import { Field, Cast, Opt } from "./Field" -import { Key, KeyStore } from "./Key" -import { ObservableMap } from "mobx"; - -export class Document extends Field { - private fields: ObservableMap<Key, Field> = new ObservableMap(); - - GetField(key: Key, ignoreProto: boolean = false): Opt<Field> { - let field: Opt<Field>; - if (ignoreProto) { - if (this.fields.has(key)) { - field = this.fields.get(key); - } - } else { - let doc: Opt<Document> = this; - while (doc && !(doc.fields.has(key))) { - doc = doc.GetPrototype(); - } - - if (doc) { - field = doc.fields.get(key); - } - } - - return field; - } - - GetFieldT<T extends Field = Field>(key: Key, ctor: { new(): T }, ignoreProto?: boolean): Opt<T> { - return Cast(this.GetField(key, ignoreProto), ctor); - } - - GetFieldValue<T, U extends { Data: T }>(key: Key, ctor: { new(): U }, defaultVal: T): T { - let val = this.GetField(key); - return (val && val instanceof ctor) ? val.Data : defaultVal; - } - - SetField(key: Key, field: Opt<Field>): void { - if (field) { - this.fields.set(key, field); - } else { - this.fields.delete(key); - } - } - - SetFieldValue<T extends Field>(key: Key, value: any, ctor: { new(): T }): boolean { - let field = this.GetField(key, true); - if (field != null) { - return field.TrySetValue(value); - } else { - field = new ctor(); - if (field.TrySetValue(value)) { - this.SetField(key, field); - return true; - } else { - return false; - } - } - } - - GetPrototype(): Opt<Document> { - return this.GetFieldT(KeyStore.Prototype, Document, true); - } - - GetAllPrototypes(): Document[] { - let protos: Document[] = []; - let doc: Opt<Document> = this; - while (doc != null) { - protos.push(doc); - doc = doc.GetPrototype(); - } - return protos; - } - - MakeDelegate(): Document { - let delegate = new Document(); - - delegate.SetField(KeyStore.Prototype, this); - - return delegate; - } - - TrySetValue(value: any): boolean { - throw new Error("Method not implemented."); - } - GetValue() { - throw new Error("Method not implemented."); - } - Copy(): Field { - throw new Error("Method not implemented."); - } - - -}
\ No newline at end of file diff --git a/src/fields/DocumentReference 2.ts b/src/fields/DocumentReference 2.ts deleted file mode 100644 index 936067bd2..000000000 --- a/src/fields/DocumentReference 2.ts +++ /dev/null @@ -1,46 +0,0 @@ -import { Field, Opt } from "./Field"; -import { Document } from "./Document"; -import { Key } from "./Key"; -import { DocumentUpdatedArgs } from "./FieldUpdatedArgs"; - -export class DocumentReference extends Field { - get Key(): Key{ - return this.key; - } - - get Document(): Document { - return this.document; - } - - constructor(private document: Document, private key: Key) { - super(); - } - - private DocFieldUpdated(args: DocumentUpdatedArgs):void{ - // this.FieldUpdated.emit(args.fieldArgs); - } - - Dereference() : Opt<Field> { - return this.document.GetField(this.key); - } - - DereferenceToRoot(): Opt<Field> { - let field: Opt<Field> = this; - while (field instanceof DocumentReference) { - field = field.Dereference(); - } - return field; - } - - TrySetValue(value: any): boolean { - throw new Error("Method not implemented."); - } - GetValue() { - throw new Error("Method not implemented."); - } - Copy(): Field { - throw new Error("Method not implemented."); - } - - -}
\ No newline at end of file diff --git a/src/fields/Field 2.ts b/src/fields/Field 2.ts deleted file mode 100644 index 46f92f203..000000000 --- a/src/fields/Field 2.ts +++ /dev/null @@ -1,54 +0,0 @@ -import { TypedEvent } from "../util/TypedEvent"; -import { FieldUpdatedArgs } from "./FieldUpdatedArgs"; -import { DocumentReference } from "./DocumentReference"; -import { Utils } from "../Utils"; - -export function Cast<T extends Field>(field: Opt<Field>, ctor: { new(): T }): Opt<T> { - if (field) { - if (ctor && field instanceof ctor) { - return field; - } - } - return undefined; -} - -export type Opt<T> = T | undefined; - -export abstract class Field { - //FieldUpdated: TypedEvent<Opt<FieldUpdatedArgs>> = new TypedEvent<Opt<FieldUpdatedArgs>>(); - - private id: string; - get Id(): string { - return this.id; - } - - constructor(id: Opt<string> = undefined) { - this.id = id || Utils.GenerateGuid(); - } - - Dereference(): Opt<Field> { - return this; - } - DereferenceToRoot(): Opt<Field> { - return this; - } - - DereferenceT<T extends Field = Field>(ctor: { new(): T }): Opt<T> { - return Cast(this.Dereference(), ctor); - } - - DereferenceToRootT<T extends Field = Field>(ctor: { new(): T }): Opt<T> { - return Cast(this.DereferenceToRoot(), ctor); - } - - Equals(other: Field): boolean { - return this.id === other.id; - } - - abstract TrySetValue(value: any): boolean; - - abstract GetValue(): any; - - abstract Copy(): Field; - -}
\ No newline at end of file diff --git a/src/fields/FieldUpdatedArgs 2.ts b/src/fields/FieldUpdatedArgs 2.ts deleted file mode 100644 index 23ccf2a5a..000000000 --- a/src/fields/FieldUpdatedArgs 2.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { Field, Opt } from "./Field"; -import { Document } from "./Document"; -import { Key } from "./Key"; - -export enum FieldUpdatedAction { - Add, - Remove, - Replace, - Update -} - -export interface FieldUpdatedArgs { - field: Field; - action: FieldUpdatedAction; -} - -export interface DocumentUpdatedArgs { - field: Document; - key: Key; - - oldValue: Opt<Field>; - newValue: Opt<Field>; - - fieldArgs?: FieldUpdatedArgs; - - action: FieldUpdatedAction; -} diff --git a/src/fields/Key 2.ts b/src/fields/Key 2.ts deleted file mode 100644 index db30f545d..000000000 --- a/src/fields/Key 2.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { Field } from "./Field" -import { Utils } from "../Utils"; -import { observable } from "mobx"; - -export class Key extends Field { - private name:string; - - get Name():string { - return this.name; - } - - constructor(name:string){ - super(Utils.GenerateDeterministicGuid(name)); - - this.name = name; - } - - TrySetValue(value: any): boolean { - throw new Error("Method not implemented."); - } - - GetValue() { - return this.Name; - } - - Copy(): Field { - return this; - } - - -} - -export namespace KeyStore { - export let Prototype = new Key("Prototype"); - export let X = new Key("X"); - export let Y = new Key("Y"); - export let PanX = new Key("PanX"); - export let PanY = new Key("PanY"); - export let Width = new Key("Width"); - export let Height = new Key("Height"); - export let Data = new Key("Data"); - export let Layout = new Key("Layout"); - export let LayoutKeys = new Key("LayoutKeys"); - export let LayoutFields = new Key("LayoutFields"); -}
\ No newline at end of file diff --git a/src/fields/ListField 2.ts b/src/fields/ListField 2.ts deleted file mode 100644 index dd96ea8c8..000000000 --- a/src/fields/ListField 2.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { Field } from "./Field"; -import { BasicField } from "./BasicField"; - -export class ListField<T extends Field> extends BasicField<T[]> { - constructor(data: T[] = []) { - super(data.slice()); - } - - Get(index:number) : T{ - return this.Data[index]; - } - - Set(index:number, value:T):void { - this.Data[index] = value; - } - - Copy(): Field { - return new ListField<T>(this.Data); - } - -}
\ No newline at end of file diff --git a/src/fields/NumberField 2.ts b/src/fields/NumberField 2.ts deleted file mode 100644 index cbe15f987..000000000 --- a/src/fields/NumberField 2.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { BasicField } from "./BasicField" - -export class NumberField extends BasicField<number> { - constructor(data: number = 0) { - super(data); - } - - Copy() { - return new NumberField(this.Data); - } - - -}
\ No newline at end of file diff --git a/src/fields/TextField 2.ts b/src/fields/TextField 2.ts deleted file mode 100644 index a7c221788..000000000 --- a/src/fields/TextField 2.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { BasicField } from "./BasicField" - -export class TextField extends BasicField<string> { - constructor(data: string = "") { - super(data); - } - - Copy() { - return new TextField(this.Data); - } - - -} diff --git a/src/stores/NodeCollectionStore.ts b/src/stores/NodeCollectionStore.ts deleted file mode 100644 index ac4f515f1..000000000 --- a/src/stores/NodeCollectionStore.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { computed, observable, action } from "mobx"; -import { NodeStore } from "./NodeStore"; -import { Document } from "../fields/Document"; - -export class NodeCollectionStore extends NodeStore { - - @observable - public Scale: number = 1; - - @observable - public Nodes: NodeStore[] = new Array<NodeStore>(); - - @observable - public Docs: Document[] = []; - - @computed - public get Transform(): string { - return "translate(" + this.X + "px," + this.Y + "px) scale(" + this.Scale + "," + this.Scale + ")"; - } - - @action - public AddNodes(stores: NodeStore[]): void { - stores.forEach(store => this.Nodes.push(store)); - } -}
\ No newline at end of file diff --git a/src/stores/NodeStore.ts b/src/stores/NodeStore.ts deleted file mode 100644 index 6a734cf44..000000000 --- a/src/stores/NodeStore.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { computed, observable } from "mobx"; -import { Utils } from "../Utils"; - -export class NodeStore { - - public Id: string = Utils.GenerateGuid(); - - @observable - public X: number = 0; - - @observable - public Y: number = 0; - - @observable - public Width: number = 0; - - @observable - public Height: number = 0; - - @computed - public get Transform(): string { - return "translate(" + this.X + "px, " + this.Y + "px)"; - } -}
\ No newline at end of file diff --git a/src/stores/RootStore.ts b/src/stores/RootStore.ts deleted file mode 100644 index fa551c1d1..000000000 --- a/src/stores/RootStore.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { action, observable } from "mobx"; -import { NodeStore } from "./NodeStore"; - -// This globally accessible store might come in handy, although you may decide that you don't need it. -export class RootStore { - - private constructor() { - // initialization code - } - - private static _instance: RootStore; - - public static get Instance():RootStore { - return this._instance || (this._instance = new this()); - } -}
\ No newline at end of file diff --git a/src/stores/StaticTextNodeStore.ts b/src/stores/StaticTextNodeStore.ts deleted file mode 100644 index 7c342a7a2..000000000 --- a/src/stores/StaticTextNodeStore.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { observable } from "mobx"; -import { NodeStore } from "./NodeStore"; - -export class StaticTextNodeStore extends NodeStore { - - constructor(initializer: Partial<StaticTextNodeStore>) { - super(); - Object.assign(this, initializer); - } - - @observable - public Title: string = ""; - - @observable - public Text: string = ""; -}
\ No newline at end of file diff --git a/src/stores/VideoNodeStore.ts b/src/stores/VideoNodeStore.ts deleted file mode 100644 index e5187ab07..000000000 --- a/src/stores/VideoNodeStore.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { observable } from "mobx"; -import { NodeStore } from "./NodeStore"; - -export class VideoNodeStore extends NodeStore { - - constructor(initializer: Partial<VideoNodeStore>) { - super(); - Object.assign(this, initializer); - } - - @observable - public Title: string = ""; - - @observable - public Url: string = ""; - -}
\ No newline at end of file diff --git a/src/util/TypedEvent.ts b/src/util/TypedEvent.ts deleted file mode 100644 index 0714a7f5c..000000000 --- a/src/util/TypedEvent.ts +++ /dev/null @@ -1,42 +0,0 @@ -export interface Listener<T> { - (event: T): any; -} - -export interface Disposable { - dispose(): void; -} - -/** passes through events as they happen. You will not get events from before you start listening */ -export class TypedEvent<T> { - private listeners: Listener<T>[] = []; - private listenersOncer: Listener<T>[] = []; - - on = (listener: Listener<T>): Disposable => { - this.listeners.push(listener); - return { - dispose: () => this.off(listener) - }; - } - - once = (listener: Listener<T>): void => { - this.listenersOncer.push(listener); - } - - off = (listener: Listener<T>) => { - var callbackIndex = this.listeners.indexOf(listener); - if (callbackIndex > -1) this.listeners.splice(callbackIndex, 1); - } - - emit = (event: T) => { - /** Update any general listeners */ - this.listeners.forEach((listener) => listener(event)); - - /** Clear the `once` queue */ - this.listenersOncer.forEach((listener) => listener(event)); - this.listenersOncer = []; - } - - pipe = (te: TypedEvent<T>): Disposable => { - return this.on((e) => te.emit(e)); - } -}
\ No newline at end of file diff --git a/src/viewmodels/DocumentViewModel.ts b/src/viewmodels/DocumentViewModel.ts deleted file mode 100644 index 008275f3c..000000000 --- a/src/viewmodels/DocumentViewModel.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { Document } from "../fields/Document"; - -export class DocumentViewModel { - constructor(private doc: Document) { - - } - - get Doc(): Document { - return this.doc; - } -}
\ No newline at end of file diff --git a/src/views/freeformcanvas/CollectionFreeFormView.scss b/src/views/freeformcanvas/CollectionFreeFormView.scss deleted file mode 100644 index cb4805eb3..000000000 --- a/src/views/freeformcanvas/CollectionFreeFormView.scss +++ /dev/null @@ -1,15 +0,0 @@ -.collectionfreeformview-container { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - overflow: hidden; - - .collectionfreeformview { - position: absolute; - top: 0; - left: 0; - } -} - diff --git a/src/views/freeformcanvas/CollectionFreeFormView.tsx b/src/views/freeformcanvas/CollectionFreeFormView.tsx deleted file mode 100644 index d5343536d..000000000 --- a/src/views/freeformcanvas/CollectionFreeFormView.tsx +++ /dev/null @@ -1,98 +0,0 @@ -import { observer } from "mobx-react"; -import { Key, KeyStore } from "../../fields/Key"; -import "./FreeFormCanvas.scss"; -import React = require("react"); -import { action } from "mobx"; -import { Document } from "../../fields/Document"; -import { DocumentViewModel } from "../../viewmodels/DocumentViewModel"; -import { DocumentView } from "../nodes/DocumentView"; -import { ListField } from "../../fields/ListField"; -import { NumberField } from "../../fields/NumberField"; -import { SSL_OP_SINGLE_DH_USE } from "constants"; - -interface IProps { - fieldKey: Key; - doc: Document; -} - -@observer -export class CollectionFreeFormView extends React.Component<IProps> { - - private _isPointerDown: boolean = false; - - constructor(props: IProps) { - super(props); - } - - @action - onPointerDown = (e: React.PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - this._isPointerDown = true; - document.removeEventListener("pointermove", this.onPointerMove); - document.addEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - document.addEventListener("pointerup", this.onPointerUp); - } - } - - @action - onPointerUp = (e: PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - this._isPointerDown = false; - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - } - } - - @action - onPointerMove = (e: PointerEvent): void => { - e.preventDefault(); - e.stopPropagation(); - if (!this._isPointerDown) { - return; - } - const { doc } = this.props; - let x = doc.GetFieldValue(KeyStore.PanX, NumberField, Number(0)); - let y = doc.GetFieldValue(KeyStore.PanY, NumberField, Number(0)); - doc.SetFieldValue(KeyStore.PanX, x + e.movementX, NumberField); - doc.SetFieldValue(KeyStore.PanY, y + e.movementY, NumberField); - } - - @action - onPointerWheel = (e: React.WheelEvent): void => { - e.stopPropagation(); - - let scaleAmount = 1 - (e.deltaY / 1000); - //this.props.store.Scale *= scaleAmount; - } - - render() { - const { fieldKey, doc } = this.props; - const value: Document[] = doc.GetFieldValue(fieldKey, ListField, []); - const panx: number = doc.GetFieldValue(KeyStore.PanX, NumberField, Number(0)); - const pany: number = doc.GetFieldValue(KeyStore.PanY, NumberField, Number(0)); - return ( - - <div className="border" style={{ - borderStyle: "solid", - borderWidth: "2px" - }}> - <div className="collectionfreeformview-container" onPointerDown={this.onPointerDown} onWheel={this.onPointerWheel} onContextMenu={(e) => e.preventDefault()} style={{ - width: "100%", - height: "calc(100% - 4px)", - overflow: "hidden" - }}> - <div className="collectionfreeformview" style={{ transform: `translate(${panx}px, ${pany}px)`, transformOrigin: '50% 50%' }}> - <div className="node-container"> - {value.map(doc => { - return (<DocumentView key={doc.Id} dvm={new DocumentViewModel(doc)} />); - })} - </div> - </div> - </div> - </div> - ); - } -}
\ No newline at end of file diff --git a/src/views/freeformcanvas/FreeFormCanvas.scss b/src/views/freeformcanvas/FreeFormCanvas.scss deleted file mode 100644 index 884ef90e6..000000000 --- a/src/views/freeformcanvas/FreeFormCanvas.scss +++ /dev/null @@ -1,15 +0,0 @@ -.freeformcanvas-container { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - overflow: hidden; - - .freeformcanvas { - position: absolute; - top: 0; - left: 0; - } -} - diff --git a/src/views/freeformcanvas/FreeFormCanvas.tsx b/src/views/freeformcanvas/FreeFormCanvas.tsx deleted file mode 100644 index 9ef5ab8f7..000000000 --- a/src/views/freeformcanvas/FreeFormCanvas.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import { observer } from "mobx-react"; -import { Key } from "../../fields/Key"; -import { NodeCollectionStore } from "../../stores/NodeCollectionStore"; -import "./FreeFormCanvas.scss"; -import React = require("react"); -import { action } from "mobx"; -import { Document } from "../../fields/Document"; -import {DocumentViewModel} from "../../viewmodels/DocumentViewModel"; -import {DocumentView} from "../nodes/DocumentView"; -import {TextField} from "../../fields/TextField"; -import {ListField} from "../../fields/ListField"; -import {Field} from "../../fields/Field"; - -interface IProps { - store: NodeCollectionStore; -} - -@observer -export class FreeFormCanvas extends React.Component<IProps> { - - private _isPointerDown: boolean = false; - - constructor(props:IProps) { - super(props); - } - - @action - onPointerDown = (e: React.PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - this._isPointerDown = true; - document.removeEventListener("pointermove", this.onPointerMove); - document.addEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - document.addEventListener("pointerup", this.onPointerUp); - } - } - - @action - onPointerUp = (e: PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - this._isPointerDown = false; - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - } - - // let doc = this.props.store.Docs[0]; - // let dataField = doc.GetFieldT(KeyStore.Data, TextField); - // let data = dataField ? dataField.Data : ""; - // this.props.store.Docs[0].SetFieldValue(KeyStore.Data, data + " hello", TextField); - } - - @action - onPointerMove = (e: PointerEvent): void => { - e.stopPropagation(); - if (!this._isPointerDown) { - return; - } - this.props.store.X += e.movementX; - this.props.store.Y += e.movementY; - } - - @action - onPointerWheel = (e: React.WheelEvent): void => { - e.stopPropagation(); - - let scaleAmount = 1 - (e.deltaY / 1000); - this.props.store.Scale *= scaleAmount; - } - - render() { - let store = this.props.store; - return ( - <div className="freeformcanvas-container" onPointerDown={this.onPointerDown} onWheel={this.onPointerWheel} onContextMenu={(e) => e.preventDefault()}> - <div className="freeformcanvas" style={{ transform: store.Transform, transformOrigin: '50% 50%' }}> - <div className="node-container"> - {this.props.store.Docs.map(doc => { - return (<DocumentView key={doc.Id} dvm={new DocumentViewModel(doc)} />); - })} - </div> - </div> - </div> - ); - } -}
\ No newline at end of file diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx deleted file mode 100644 index f955a8c39..000000000 --- a/src/views/nodes/DocumentView.tsx +++ /dev/null @@ -1,134 +0,0 @@ -import { observer } from "mobx-react"; -import React = require("react"); -import { computed } from "mobx"; -import { KeyStore, Key } from "../../fields/Key"; -import { NumberField } from "../../fields/NumberField"; -import { TextField } from "../../fields/TextField"; -import { DocumentViewModel } from "../../viewmodels/DocumentViewModel"; -import { ListField } from "../../fields/ListField"; -import { FieldTextBox } from "../nodes/FieldTextBox" -import { FreeFormCanvas } from "../freeformcanvas/FreeFormCanvas" -import { CollectionFreeFormView } from "../freeformcanvas/CollectionFreeFormView" -import "./NodeView.scss" -const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this? - -interface IProps { - dvm: DocumentViewModel; -} - -@observer -export class DocumentView extends React.Component<IProps> { - @computed - get x(): number { - return this.props.dvm.Doc.GetFieldValue(KeyStore.X, NumberField, Number(0)); - } - - @computed - get y(): number { - return this.props.dvm.Doc.GetFieldValue(KeyStore.Y, NumberField, Number(0)); - } - - set x(x: number) { - this.props.dvm.Doc.SetFieldValue(KeyStore.X, x, NumberField) - } - - set y(y: number) { - this.props.dvm.Doc.SetFieldValue(KeyStore.Y, y, NumberField) - } - - @computed - get transform(): string { - return `translate(${this.x}px, ${this.y}px)`; - } - - @computed - get width(): number { - return this.props.dvm.Doc.GetFieldValue(KeyStore.Width, NumberField, Number(0)); - } - - @computed - get height(): number { - return this.props.dvm.Doc.GetFieldValue(KeyStore.Height, NumberField, Number(0)); - } - - @computed - get layout(): string { - return this.props.dvm.Doc.GetFieldValue(KeyStore.Layout, TextField, String("<p>Error loading layout data</p>")); - } - - @computed - get layoutKeys(): Key[] { - return this.props.dvm.Doc.GetFieldValue(KeyStore.LayoutKeys, ListField, new Array<Key>()); - } - - @computed - get layoutFields(): Key[] { - return this.props.dvm.Doc.GetFieldValue(KeyStore.LayoutFields, ListField, new Array<Key>()); - } - - private _isPointerDown = false; - - onPointerDown = (e: React.PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - this._isPointerDown = true; - document.removeEventListener("pointermove", this.onPointerMove); - document.addEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - document.addEventListener("pointerup", this.onPointerUp); - } - } - - onPointerUp = (e: PointerEvent): void => { - e.stopPropagation(); - if (e.button === 2) { - e.preventDefault(); - this._isPointerDown = false; - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - } - } - - onPointerMove = (e: PointerEvent): void => { - e.stopPropagation(); - e.preventDefault(); - if (!this._isPointerDown) { - return; - } - this.x += e.movementX; - this.y += e.movementY; - } - - render() { - let doc = this.props.dvm.Doc; - let bindings: any = { - doc: doc - }; - for (const key of this.layoutKeys) { - bindings[key.Name + "Key"] = key; - } - for (const key of this.layoutFields) { - let field = doc.GetField(key); - if (field) { - bindings[key.Name] = field.GetValue(); - } - } - return ( - <div className="node" style={{ - transform: this.transform, - width: this.width, - height: this.height - }} onPointerDown={this.onPointerDown} onContextMenu={ - (e) => { - e.preventDefault() - }}> - <JsxParser - components={{ FieldTextBox, FreeFormCanvas, CollectionFreeFormView }} - bindings={bindings} - jsx={this.layout} - /> - </div> - ); - } - -}
\ No newline at end of file diff --git a/src/views/nodes/FieldTextBox.tsx b/src/views/nodes/FieldTextBox.tsx deleted file mode 100644 index dbac3906a..000000000 --- a/src/views/nodes/FieldTextBox.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import { Key, KeyStore } from "../../fields/Key"; -import { Document } from "../../fields/Document"; -import { observer } from "mobx-react"; -import { TextField } from "../../fields/TextField"; -import React = require("react") -import { action, observable, reaction, IReactionDisposer } from "mobx"; - -import {schema} from "prosemirror-schema-basic"; -import {EditorState, Transaction} from "prosemirror-state" -import {EditorView} from "prosemirror-view" -import {keymap} from "prosemirror-keymap" -import {baseKeymap} from "prosemirror-commands" -import {undo, redo, history} from "prosemirror-history" -import { Opt } from "../../fields/Field"; - -interface IProps { - fieldKey:Key; - doc:Document; -} - -// FieldTextBox: Displays an editable plain text node that maps to a specified Key of a Document -// -// HTML Markup: <FieldTextBox Doc={Document's ID} FieldKey={Key's name + "Key"} -// -// In Code, the node's HTML is specified in the document's parameterized structure as: -// document.SetField(KeyStore.Layout, "<FieldTextBox doc={doc} fieldKey={<KEYNAME>Key} />"); -// and the node's binding to the specified document KEYNAME as: -// document.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.<KEYNAME>])); -// The Jsx parser at run time will bind: -// 'fieldKey' property to the Key stored in LayoutKeys -// and 'doc' property to the document that is being rendered -// -// When rendered() by React, this extracts the TextController from the Document stored at the -// specified Key and assigns it to an HTML input node. When changes are made tot his node, -// this will edit the document and assign the new value to that field. -// -@observer -export class FieldTextBox extends React.Component<IProps> { - private _ref: React.RefObject<HTMLDivElement>; - private _editorView: Opt<EditorView>; - private _reactionDisposer: Opt<IReactionDisposer>; - - constructor(props:IProps) { - super(props); - - this._ref = React.createRef(); - - this.onChange = this.onChange.bind(this); - } - - dispatchTransaction = (tx: Transaction) => { - if(this._editorView) { - const state = this._editorView.state.apply(tx); - this._editorView.updateState(state); - const {doc, fieldKey} = this.props; - doc.SetFieldValue(fieldKey, JSON.stringify(state.toJSON()), TextField); - } - } - - componentDidMount() { - let state:EditorState; - const {doc, fieldKey} = this.props; - const config = { - schema, - plugins: [ - history(), - keymap({"Mod-z": undo, "Mod-y": redo}), - keymap(baseKeymap) - ] - }; - - let field = doc.GetFieldT(fieldKey, TextField); - if(field) { - state = EditorState.fromJSON(config, JSON.parse(field.Data)); - } else { - state = EditorState.create(config); - } - if(this._ref.current) { - this._editorView = new EditorView(this._ref.current, { - state, - dispatchTransaction: this.dispatchTransaction - }); - } - - this._reactionDisposer = reaction(() => { - const field = this.props.doc.GetFieldT(this.props.fieldKey, TextField); - return field ? field.Data : undefined; - }, (field) => { - if(field && this._editorView) { - this._editorView.updateState(EditorState.fromJSON(config, JSON.parse(field))); - } - }) - } - - componentWillUnmount() { - if(this._editorView) { - this._editorView.destroy(); - } - if(this._reactionDisposer) { - this._reactionDisposer(); - } - } - - shouldComponentUpdate() { - return false; - } - - @action - onChange(e: React.ChangeEvent<HTMLInputElement>) { - const {fieldKey, doc} = this.props; - doc.SetFieldValue(fieldKey, e.target.value, TextField); - } - - render() { - return (<div ref={this._ref} />) - } -}
\ No newline at end of file diff --git a/src/views/nodes/NodeView.scss b/src/views/nodes/NodeView.scss deleted file mode 100644 index a68335f87..000000000 --- a/src/views/nodes/NodeView.scss +++ /dev/null @@ -1,31 +0,0 @@ -.node { - position: absolute; - background: #cdcdcd; - - overflow: hidden; - - - &.minimized { - width: 30px; - height: 30px; - } - - .top { - background: #232323; - height: 20px; - cursor: pointer; - } - - .content { - padding: 20px 20px; - height: auto; - box-sizing: border-box; - - } - - .scroll-box { - overflow-y: scroll; - height: calc(100% - 20px); - } -} - diff --git a/src/views/nodes/RichTextView.tsx b/src/views/nodes/RichTextView.tsx deleted file mode 100644 index e69de29bb..000000000 --- a/src/views/nodes/RichTextView.tsx +++ /dev/null diff --git a/src/views/nodes/TextNodeView.tsx b/src/views/nodes/TextNodeView.tsx deleted file mode 100644 index 4831e658c..000000000 --- a/src/views/nodes/TextNodeView.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { observer } from "mobx-react"; -import { StaticTextNodeStore } from "../../stores/StaticTextNodeStore"; -import "./NodeView.scss"; -import { TopBar } from "./TopBar"; -import React = require("react"); - -interface IProps { - store: StaticTextNodeStore; -} - -@observer -export class TextNodeView extends React.Component<IProps> { - - render() { - let store = this.props.store; - return ( - <div className="node text-node" style={{ transform: store.Transform }}> - <TopBar store={store} /> - <div className="scroll-box"> - <div className="content"> - <h3 className="title">{store.Title}</h3> - <p className="paragraph">{store.Text}</p> - </div> - </div> - </div> - ); - } -}
\ No newline at end of file diff --git a/src/views/nodes/TopBar.tsx b/src/views/nodes/TopBar.tsx deleted file mode 100644 index bb126e8b5..000000000 --- a/src/views/nodes/TopBar.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import { observer } from "mobx-react"; -import { NodeStore } from "../../stores/NodeStore"; -import "./NodeView.scss"; -import React = require("react"); - -interface IProps { - store: NodeStore; -} - -@observer -export class TopBar extends React.Component<IProps> { - - private _isPointerDown = false; - - onPointerDown = (e: React.PointerEvent): void => { - e.stopPropagation(); - e.preventDefault(); - this._isPointerDown = true; - document.removeEventListener("pointermove", this.onPointerMove); - document.addEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - document.addEventListener("pointerup", this.onPointerUp); - } - - onPointerUp = (e: PointerEvent): void => { - e.stopPropagation(); - e.preventDefault(); - this._isPointerDown = false; - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - } - - onPointerMove = (e: PointerEvent): void => { - e.stopPropagation(); - e.preventDefault(); - if (!this._isPointerDown) { - return; - } - this.props.store.X += e.movementX; - this.props.store.Y += e.movementY; - } - - render() { - return <div className="top" onPointerDown={this.onPointerDown}></div> - } -} diff --git a/src/views/nodes/VideoNodeView.scss b/src/views/nodes/VideoNodeView.scss deleted file mode 100644 index f412c3519..000000000 --- a/src/views/nodes/VideoNodeView.scss +++ /dev/null @@ -1,5 +0,0 @@ -.node { - video { - width: 100%; - } -}
\ No newline at end of file diff --git a/src/views/nodes/VideoNodeView.tsx b/src/views/nodes/VideoNodeView.tsx deleted file mode 100644 index 0a7b3d174..000000000 --- a/src/views/nodes/VideoNodeView.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { observer } from "mobx-react"; -import { VideoNodeStore } from "../../stores/VideoNodeStore"; -import "./NodeView.scss"; -import { TopBar } from "./TopBar"; -import "./VideoNodeView.scss"; -import React = require("react"); - -interface IProps { - store: VideoNodeStore; -} - -@observer -export class VideoNodeView extends React.Component<IProps> { - - render() { - let store = this.props.store; - return ( - <div className="node text-node" style={{ transform: store.Transform }}> - <TopBar store={store} /> - <div className="scroll-box"> - <div className="content"> - <h3 className="title">{store.Title}</h3> - <video src={store.Url} controls /> - </div> - </div> - </div> - ); - } -}
\ No newline at end of file |