aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/Transform.ts7
-rw-r--r--src/client/views/DocumentManager.tsx81
-rw-r--r--src/client/views/TempTreeView.tsx5
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx1
-rw-r--r--src/client/views/nodes/DocumentView.tsx19
-rw-r--r--src/client/views/nodes/NodeView.scss2
-rw-r--r--src/temp.txt6
7 files changed, 118 insertions, 3 deletions
diff --git a/src/client/util/Transform.ts b/src/client/util/Transform.ts
index 8ae3f837f..aa922f358 100644
--- a/src/client/util/Transform.ts
+++ b/src/client/util/Transform.ts
@@ -55,6 +55,13 @@ export class Transform {
return this;
}
+ //MONIKA
+ center = (x: number, y: number): Transform => {
+ this._translateX = x
+ this._translateY = y
+ return this;
+ }
+
preTransform = (transform: Transform): Transform => {
this._translateX = transform._translateX + this._translateX * transform._scale;
this._translateY = transform._translateY + this._translateY * transform._scale;
diff --git a/src/client/views/DocumentManager.tsx b/src/client/views/DocumentManager.tsx
index b69d40148..2ab643657 100644
--- a/src/client/views/DocumentManager.tsx
+++ b/src/client/views/DocumentManager.tsx
@@ -3,6 +3,9 @@ import { observer } from 'mobx-react';
import { observable, action } from 'mobx';
import { DocumentView } from './nodes/DocumentView';
import { Document } from "../../fields/Document"
+import { CollectionFreeFormView } from './collections/CollectionFreeFormView';
+import { KeyStore } from '../../fields/Key';
+import { CollectionViewBase } from './collections/CollectionViewBase';
export class DocumentManager {
@@ -29,19 +32,95 @@ export class DocumentManager {
let toReturn: DocumentView | null;
toReturn = null;
+ //gets document view that is in a freeform canvas collection
DocumentManager.Instance.DocumentViews.map(view => {
let doc = view.props.Document;
+ // if (view.props.ContainingCollectionView instanceof CollectionFreeFormView) {
+ // if (Object.is(doc, toFind)) {
+ // toReturn = view;
+ // return;
+ // }
+ // }
+
if (Object.is(doc, toFind)) {
toReturn = view;
return;
}
+
+ })
+
+ return (toReturn);
+ }
+
+ public getDocumentViewFreeform(toFind: Document): DocumentView | null {
+
+ let toReturn: DocumentView | null;
+ toReturn = null;
+
+ //gets document view that is in a freeform canvas collection
+ DocumentManager.Instance.DocumentViews.map(view => {
+ let doc = view.props.Document;
+ if (view.props.ContainingCollectionView instanceof CollectionFreeFormView) {
+ if (Object.is(doc, toFind)) {
+ toReturn = view;
+ return;
+ }
+ }
})
return (toReturn);
}
- public centerNode(doc: DocumentView) {
+ public centerNode(doc: Document): any {
+
+ //gets document view that is in freeform collection
+ let docView: DocumentView | null = this.getDocumentViewFreeform(doc)
+
+ let scale: number;
+ let XView: number;
+ let YView: number;
+ let width: number;
+ let height: number;
+
+ //if the view exists in a freeform collection
+ if (docView != null) {
+ //view.props.GetTransform().TranslateX
+ width = docView.props.Document.GetNumber(KeyStore.NativeWidth, 0)
+ height = docView.props.Document.GetNumber(KeyStore.NativeHeight, 0)
+
+ //base case: parent does not exist (aka is parent)
+ if (docView.props.ContainingCollectionView == null) {
+ // scale = RootStore.Instance.MainNodeCollection.Scale;
+ // XView = (-node.X * scale) + (window.innerWidth / 2) - (node.Width * scale / 2);
+ // YView = (-node.Y * scale) + (window.innerHeight / 2) - (node.Height * scale / 2);
+ // RootStore.Instance.MainNodeCollection.SetViewportXY(XView, YView);
+ scale = docView.props.GetTransform().Scale
+ XView = (-docView.props.GetTransform().TranslateX * scale) + (window.innerWidth / 2) - (width * scale / 2)
+ YView = (-docView.props.GetTransform().TranslateY * scale) + (window.innerHeight / 2) - (height * scale / 2)
+ }
+ //parent is not main, parent is centered and calls itself
+ else {
+ if (docView.props.ContainingCollectionView.props.ContainingDocumentView != null) {
+
+ let parentWidth = docView.props.ContainingCollectionView.props.ContainingDocumentView.props.Document.GetNumber(KeyStore.NativeWidth, 0)
+ let parentHeight = docView.props.ContainingCollectionView.props.ContainingDocumentView.props.Document.GetNumber(KeyStore.NativeHeight, 0)
+
+ scale = docView.props.ContainingCollectionView.props.ContainingDocumentView.props.GetTransform().Scale
+ XView = (-docView.props.GetTransform().TranslateX * scale) + (parentWidth / 2) - (width * scale / 2);
+ YView = (-docView.props.GetTransform().TranslateY * scale) + (parentHeight / 2) - (height * scale / 2);
+ //node.Parent.setViewportXY(XView, YView);
+ this.setViewportXY(docView.props.ContainingCollectionView, XView, YView)
+
+ return this.centerNode(docView.props.ContainingCollectionView.props.ContainingDocumentView.props.Document);
+ }
+ }
+ }
+ }
+ private setViewportXY(collection: CollectionViewBase, x: number, y: number) {
+ if (collection.props.ContainingDocumentView != null) {
+ collection.props.ContainingDocumentView.props.GetTransform().center(x, y)
+ }
}
public setPosition(doc: DocumentView) {
diff --git a/src/client/views/TempTreeView.tsx b/src/client/views/TempTreeView.tsx
index 8dd256c8a..5bb44fde2 100644
--- a/src/client/views/TempTreeView.tsx
+++ b/src/client/views/TempTreeView.tsx
@@ -17,13 +17,18 @@ export class TempTreeView extends React.Component<IProps>{
let view = DocumentManager.Instance.getDocumentView(doc);
if (view != null) {
console.log(view.Id)
+ console.log(view.props.GetTransform().TranslateX)
+
console.log(view.props.Document.Title)
if (view.props.ContainingCollectionView != undefined) {
//console.log(view.props.ContainingCollectionView.Id)
+ // view.props.ContainingCollectionView
}
else {
console.log("containing collection is undefined")
}
+
+ view.switchColor();
}
}
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 7947b1c51..d60b98edd 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -25,6 +25,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
private _lastY: number = 0;
private _downX: number = 0;
private _downY: number = 0;
+ private _borderColor: string = "red"
constructor(props: CollectionViewProps) {
super(props);
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index bc27c424c..f653919cf 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -1,5 +1,6 @@
import { action, computed } from "mobx";
import { observer } from "mobx-react";
+import { observable } from "mobx";
import { Document } from "../../../fields/Document";
import { Opt, FieldWaiting } from "../../../fields/Field";
import { Key, KeyStore } from "../../../fields/Key";
@@ -38,7 +39,14 @@ export interface DocumentViewProps {
export class DocumentView extends React.Component<DocumentViewProps> {
public Id: string = Utils.GenerateGuid();
- public tempTitle: string = "hello there"
+
+ @observable
+ public Border: string = "white"
+
+ @action
+ public switchColor() {
+ this.Border = "red"
+ }
private _mainCont = React.createRef<HTMLDivElement>();
get MainContent() {
@@ -173,6 +181,12 @@ export class DocumentView extends React.Component<DocumentViewProps> {
}
@action
+ Center = (e: React.MouseEvent): void => {
+ //DocumentManager.Instance.centerNode()
+ console.log("centering...")
+ }
+
+ @action
onContextMenu = (e: React.MouseEvent): void => {
if (!SelectionManager.IsSelected(this)) {
return;
@@ -193,6 +207,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
e.stopPropagation();
ContextMenu.Instance.clearItems();
+ ContextMenu.Instance.addItem({ description: "Center", event: this.Center })
ContextMenu.Instance.addItem({ description: "Full Screen", event: this.fullScreenClicked })
ContextMenu.Instance.addItem({ description: "Open Right", event: this.openRight })
ContextMenu.Instance.addItem({ description: "Delete", event: this.deleteClicked })
@@ -268,7 +283,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
var height = this.props.Document.GetNumber(KeyStore.NativeHeight, 0);
var strheight = height > 0 ? height.toString() + "px" : "100%";
return (
- <div className="node" ref={this._mainCont} style={{ width: strwidth, height: strheight, transformOrigin: "left top", transform: `scale(${this.props.Scaling},${this.props.Scaling})` }}
+ <div className="node" ref={this._mainCont} style={{ borderColor: this.Border, width: strwidth, height: strheight, transformOrigin: "left top", transform: `scale(${this.props.Scaling},${this.props.Scaling})` }}
onContextMenu={this.onContextMenu}
onPointerDown={this.onPointerDown} >
<JsxParser
diff --git a/src/client/views/nodes/NodeView.scss b/src/client/views/nodes/NodeView.scss
index dac1c0a8e..5615ecafd 100644
--- a/src/client/views/nodes/NodeView.scss
+++ b/src/client/views/nodes/NodeView.scss
@@ -2,6 +2,8 @@
position: absolute;
background: #cdcdcd;
overflow: hidden;
+ border-style: solid;
+ border-width: 2px; //border-color: blue;
&.minimized {
width: 30px;
height: 30px;
diff --git a/src/temp.txt b/src/temp.txt
index 251606e02..481424859 100644
--- a/src/temp.txt
+++ b/src/temp.txt
@@ -29,6 +29,12 @@
}
+ @observable
+ public SetViewportXY(x: number, y: number) {
+ this.ViewportX = x;
+ this.ViewportY = y;
+ }
+
//NAV
/**
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-12 05:45:26 +0000