From 370ac4fde98f2ff25b2dedd6b0857c88c6d7f55b Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 22 Feb 2019 13:42:25 -0500 Subject: moved common code into CollectionViewBase. --- .../views/collections/CollectionFreeFormView.tsx | 59 +++------------------- 1 file changed, 6 insertions(+), 53 deletions(-) (limited to 'src/client/views/collections/CollectionFreeFormView.tsx') diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx index b78b1a3b6..b8312aff7 100644 --- a/src/client/views/collections/CollectionFreeFormView.tsx +++ b/src/client/views/collections/CollectionFreeFormView.tsx @@ -4,20 +4,18 @@ import { action, computed, trace } from "mobx"; import { CollectionFreeFormDocumentView } from "../nodes/CollectionFreeFormDocumentView"; import { DragManager } from "../../util/DragManager"; import "./CollectionFreeFormView.scss"; -import { COLLECTION_BORDER_WIDTH, CollectionViewProps, SubCollectionViewProps } from "./CollectionView"; +import { COLLECTION_BORDER_WIDTH } from "./CollectionView"; import { KeyStore } from "../../../fields/KeyStore"; import { Document } from "../../../fields/Document"; import { ListField } from "../../../fields/ListField"; -import { NumberField } from "../../../fields/NumberField"; -import { Documents } from "../../documents/Documents"; import { FieldWaiting } from "../../../fields/Field"; import { Transform } from "../../util/Transform"; import { DocumentView } from "../nodes/DocumentView"; import { undoBatch } from "../../util/UndoManager"; -import { jSXElement } from "babel-types"; +import { CollectionViewBase, SubCollectionViewProps } from "./CollectionViewBase"; @observer -export class CollectionFreeFormView extends React.Component { +export class CollectionFreeFormView extends CollectionViewBase { private _canvasRef = React.createRef(); private _lastX: number = 0; private _lastY: number = 0; @@ -45,13 +43,8 @@ export class CollectionFreeFormView extends React.Component { + super.drop(e, de); const doc: DocumentView = de.data["document"]; - if (doc.props.ContainingCollectionView && doc.props.ContainingCollectionView !== this.props.CollectionView) { - if (doc.props.RemoveDocument) { - doc.props.RemoveDocument(doc.props.Document); - } - this.props.addDocument(doc.props.Document); - } const xOffset = de.data["xOffset"] as number || 0; const yOffset = de.data["yOffset"] as number || 0; //this should be able to use translate and scale methods on an Identity transform, no? @@ -62,21 +55,6 @@ export class CollectionFreeFormView extends React.Component { - if (this.dropDisposer) { - this.dropDisposer(); - } - if (ele) { - this.dropDisposer = DragManager.MakeDropTarget(ele, { - handlers: { - drop: this.drop - } - }); - } } @action @@ -148,36 +126,11 @@ export class CollectionFreeFormView extends React.Component { - e.stopPropagation() - e.preventDefault() - let fReader = new FileReader() - let file = e.dataTransfer.items[0].getAsFile(); - let that = this; const panx: number = this.props.Document.GetNumber(KeyStore.PanX, 0); const pany: number = this.props.Document.GetNumber(KeyStore.PanY, 0); let x = e.pageX - panx let y = e.pageY - pany - - fReader.addEventListener("load", action("drop", () => { - if (fReader.result) { - let url = "" + fReader.result; - let doc = Documents.ImageDocument(url, { - x: x, y: y - }) - let docs = that.props.Document.GetT(KeyStore.Data, ListField); - if (docs != FieldWaiting) { - if (!docs) { - docs = new ListField(); - that.props.Document.Set(KeyStore.Data, docs) - } - docs.Data.push(doc); - } - } - }), false) - - if (file) { - fReader.readAsDataURL(file) - } + super.onDrop(e, { x: x, y: y }); } onDragOver = (): void => { @@ -249,7 +202,7 @@ export class CollectionFreeFormView extends React.Component e.preventDefault()} - onDrop={this.onDrop} + onDrop={this.onDrop.bind(this)} onDragOver={this.onDragOver} style={{ borderWidth: `${COLLECTION_BORDER_WIDTH}px`, }} ref={this.createDropTarget}> -- cgit v1.2.3-70-g09d2 From bc9096366d10654d16ed84251e7f4b7fb3a46727 Mon Sep 17 00:00:00 2001 From: bob Date: Fri, 22 Feb 2019 15:24:42 -0500 Subject: changed PanelSize to PanelWidth/Height --- src/client/views/DocumentDecorations.tsx | 2 +- src/client/views/Main.tsx | 3 ++- .../views/collections/CollectionDockingView.tsx | 3 ++- .../views/collections/CollectionFreeFormView.tsx | 3 ++- .../views/collections/CollectionSchemaView.tsx | 3 ++- .../views/nodes/CollectionFreeFormDocumentView.tsx | 24 ++++++++++++++-------- src/client/views/nodes/DocumentView.tsx | 3 ++- 7 files changed, 26 insertions(+), 15 deletions(-) (limited to 'src/client/views/collections/CollectionFreeFormView.tsx') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 395a37ba5..7b64a4c2c 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -28,7 +28,7 @@ export class DocumentDecorations extends React.Component { } let transform = (element.props.ScreenToLocalTransform().scale(element.props.Scaling)).inverse(); var [sptX, sptY] = transform.transformPoint(0, 0); - let [bptX, bptY] = transform.transformPoint(element.props.PanelSize[0], element.props.PanelSize[1]); + let [bptX, bptY] = transform.transformPoint(element.props.PanelWidth, element.props.PanelHeight); return { x: Math.min(sptX, bounds.x), y: Math.min(sptY, bounds.y), r: Math.max(bptX, bounds.r), b: Math.max(bptY, bounds.b) diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index fe1a999ec..6f6a89839 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -107,7 +107,8 @@ Documents.initProtos(() => { Transform.Identity} Scaling={1} - PanelSize={[0, 0]} + PanelWidth={0} + PanelHeight={0} isTopMost={true} ContainingCollectionView={undefined} /> diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index 857af023d..7ac8ea5e4 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -290,7 +290,8 @@ export class DockedFrameRenderer extends React.Component { AddDocument={undefined} RemoveDocument={undefined} Scaling={this._parentScaling} - PanelSize={[this._nativeWidth, this._nativeHeight]} + PanelWidth={this._nativeWidth} + PanelHeight={this._nativeHeight} ScreenToLocalTransform={this.ScreenToLocalTransform} isTopMost={true} ContainingCollectionView={undefined} /> diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx index b8312aff7..e31fb25b9 100644 --- a/src/client/views/collections/CollectionFreeFormView.tsx +++ b/src/client/views/collections/CollectionFreeFormView.tsx @@ -187,7 +187,8 @@ export class CollectionFreeFormView extends CollectionViewBase { ScreenToLocalTransform={this.getTransform} isTopMost={false} Scaling={1} - PanelSize={[doc.GetNumber(KeyStore.Width, 0), doc.GetNumber(KeyStore.Height, 0)]} + PanelWidth={doc.GetNumber(KeyStore.Width, 0)} + PanelHeight={doc.GetNumber(KeyStore.Height, 0)} ContainingCollectionView={this.props.CollectionView} />); }) } diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx index df732308a..7e7d23fe4 100644 --- a/src/client/views/collections/CollectionSchemaView.tsx +++ b/src/client/views/collections/CollectionSchemaView.tsx @@ -149,7 +149,8 @@ export class CollectionSchemaView extends CollectionViewBase { ScreenToLocalTransform={this.getTransform} Scaling={this._parentScaling} isTopMost={false} - PanelSize={[this._panelWidth, this._panelHeight]} + PanelWidth={this._panelWidth} + PanelHeight={this._panelHeight} ContainingCollectionView={this.props.CollectionView} /> } diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index 5568935fa..ad6756918 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -1,4 +1,4 @@ -import { computed } from "mobx"; +import { computed, trace } from "mobx"; import { observer } from "mobx-react"; import { KeyStore } from "../../../fields/KeyStore"; import { NumberField } from "../../../fields/NumberField"; @@ -69,15 +69,25 @@ export class CollectionFreeFormDocumentView extends React.Component 0 ? this.width / this.nativeWidth : 1; + } getTransform = (): Transform => { - var parentScaling = this.nativeWidth > 0 ? this.width / this.nativeWidth : 1; return this.props.ScreenToLocalTransform(). - translate(-this.props.Document.GetNumber(KeyStore.X, 0), -this.props.Document.GetNumber(KeyStore.Y, 0)).scale(1 / parentScaling); + translate(-this.props.Document.GetNumber(KeyStore.X, 0), -this.props.Document.GetNumber(KeyStore.Y, 0)).scale(1 / this.parentScaling); + } + + @computed + get docView() { + return } render() { - var parentScaling = this.nativeWidth > 0 ? this.width / this.nativeWidth : 1; return (
- - + {this.docView}
); } diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 69e413c6f..c026e13cd 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -31,7 +31,8 @@ export interface DocumentViewProps { isTopMost: boolean; //tfs: This shouldn't be necessary I don't think Scaling: number; - PanelSize: number[]; + PanelWidth: number; + PanelHeight: number; } export interface JsxArgs extends DocumentViewProps { Keys: { [name: string]: Key } -- cgit v1.2.3-70-g09d2