From 22e1d39e5c6d2756a039543b33c45d9610669ec7 Mon Sep 17 00:00:00 2001 From: yipstanley Date: Fri, 18 Jan 2019 19:31:03 -0500 Subject: selection manager added --- .../freeformcanvas/CollectionFreeFormView.tsx | 28 +++++++++++++--------- src/views/nodes/DocumentView.tsx | 16 ++++++++++--- 2 files changed, 30 insertions(+), 14 deletions(-) (limited to 'src/views') diff --git a/src/views/freeformcanvas/CollectionFreeFormView.tsx b/src/views/freeformcanvas/CollectionFreeFormView.tsx index 8bdf1849a..7812c4b36 100644 --- a/src/views/freeformcanvas/CollectionFreeFormView.tsx +++ b/src/views/freeformcanvas/CollectionFreeFormView.tsx @@ -4,14 +4,15 @@ 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 { DocumentViewModel } from "../../viewmodels/DocumentViewModel"; +import { DocumentView } from "../nodes/DocumentView"; +import { ListField } from "../../fields/ListField"; +import { NumberField } from "../../fields/NumberField"; interface IProps { - fieldKey:Key; - doc:Document; + fieldKey: Key; + doc: Document; + isSelected: boolean; } @observer @@ -19,7 +20,7 @@ export class CollectionFreeFormView extends React.Component { private _isPointerDown: boolean = false; - constructor(props:IProps) { + constructor(props: IProps) { super(props); } @@ -52,11 +53,16 @@ export class CollectionFreeFormView extends React.Component { if (!this._isPointerDown) { return; } - const {doc} = this.props; + const { doc } = this.props; + + // if docView is selected, pan, else dont pan + console.log(this.props.isSelected) + + 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); + doc.SetFieldValue(KeyStore.PanX, x + e.movementX, NumberField); + doc.SetFieldValue(KeyStore.PanY, y + e.movementY, NumberField); } @action @@ -68,7 +74,7 @@ export class CollectionFreeFormView extends React.Component { } render() { - const {fieldKey, doc} = this.props; + 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)); diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx index 1c9f850ed..c4101fab9 100644 --- a/src/views/nodes/DocumentView.tsx +++ b/src/views/nodes/DocumentView.tsx @@ -1,6 +1,6 @@ import { observer } from "mobx-react"; import React = require("react"); -import { computed } from "mobx"; +import { computed, observable } from "mobx"; import { KeyStore, Key } from "../../fields/Key"; import { NumberField } from "../../fields/NumberField"; import { TextField } from "../../fields/TextField"; @@ -10,6 +10,7 @@ import { FieldTextBox } from "../nodes/FieldTextBox" import { FreeFormCanvas } from "../freeformcanvas/FreeFormCanvas" import { CollectionFreeFormView } from "../freeformcanvas/CollectionFreeFormView" import "./NodeView.scss" +import { SelectionManager } from "../../util/SelectionManager"; const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this? interface IProps { @@ -72,6 +73,11 @@ export class DocumentView extends React.Component { return this.props.dvm.Doc.GetFieldValue(KeyStore.LayoutFields, ListField, new Array()); } + @computed + get selected() : string { + return SelectionManager.IsSelected(this) ? "5px solid black" : "0px" + } + private _isPointerDown = false; onPointerDown = (e: React.PointerEvent): void => { @@ -83,6 +89,7 @@ export class DocumentView extends React.Component { document.removeEventListener("pointerup", this.onPointerUp); document.addEventListener("pointerup", this.onPointerUp); } + SelectionManager.SelectDoc(this, e.ctrlKey) } onPointerUp = (e: PointerEvent): void => { @@ -108,7 +115,8 @@ export class DocumentView extends React.Component { render() { let doc = this.props.dvm.Doc; let bindings: any = { - doc: doc + doc: doc, + isSelected: this.selected }; for (const key of this.layoutKeys) { bindings[key.Name + "Key"] = key; @@ -119,11 +127,13 @@ export class DocumentView extends React.Component { bindings[key.Name] = field.GetValue(); } } + return (
{ e.preventDefault() -- cgit v1.2.3-70-g09d2