1 files changed, 42 insertions, 2 deletions
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 04373df12..af1889c3f 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -13,6 +13,7 @@ import { ListField } from "../../../fields/ListField";
 import { NumberField } from "../../../fields/NumberField";
 import { Documents } from "../../documents/Documents";
 import { FieldWaiting } from "../../../fields/Field";
+import { Server } from "tls";
 import { Transform } from "../../util/Transform";
 
 @observer
@@ -24,6 +25,8 @@ export class CollectionFreeFormView extends CollectionViewBase {
     private _lastY: number = 0;
     private _downX: number = 0;
     private _downY: number = 0;
+    //determines whether the blinking cursor for indicating whether a text will be made on key down is visible
+    private _previewCursorVisible: boolean = false;
 
     constructor(props: CollectionViewProps) {
         super(props);
@@ -81,10 +84,19 @@ export class CollectionFreeFormView extends CollectionViewBase {
             !e.defaultPrevented) {
             document.removeEventListener("pointermove", this.onPointerMove);
             document.addEventListener("pointermove", this.onPointerMove);
+            //document.removeEventListener("keypress", this.onKeyDown);
+            //document.addEventListener("keydown", this.onKeyDown);
             document.removeEventListener("pointerup", this.onPointerUp);
             document.addEventListener("pointerup", this.onPointerUp);
-            this._downX = this._lastX = e.pageX;
-            this._downY = this._lastY = e.pageY;
+            this._lastX = e.pageX;
+            this._lastY = e.pageY;
+            this._downX = e.pageX;
+            this._downY = e.pageY;
+            //update downX/downY to update UI (used for preview text cursor)
+            this.setState({
+                DownX: e.pageX,
+                DownY: e.pageY,
+            })
         }
     }
 
@@ -94,10 +106,12 @@ export class CollectionFreeFormView extends CollectionViewBase {
         document.removeEventListener("pointerup", this.onPointerUp);
         e.stopPropagation();
         if (Math.abs(this._downX - e.clientX) < 3 && Math.abs(this._downY - e.clientY) < 3) {
+            this._previewCursorVisible = true;
             if (!SelectionManager.IsSelected(this.props.ContainingDocumentView as CollectionFreeFormDocumentView)) {
                 SelectionManager.SelectDoc(this.props.ContainingDocumentView as CollectionFreeFormDocumentView, false);
             }
         }
+
     }
 
     @action
@@ -110,6 +124,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
             let y = this.props.DocumentForCollection.GetNumber(KeyStore.PanY, 0);
 
             this.SetPan(x + (e.pageX - this._lastX) / currScale, y + (e.pageY - this._lastY) / currScale);
+            console.log("SET PAN");
         }
         this._lastX = e.pageX;
         this._lastY = e.pageY;
@@ -180,6 +195,20 @@ export class CollectionFreeFormView extends CollectionViewBase {
     }
 
     @action
+    onKeyDown = (e: React.KeyboardEvent<Element>) => {
+        console.log("KEY PRESSED");
+        //if not these keys, make a textbox if preview cursor is active!
+        if (!e.ctrlKey && !e.altKey && !e.shiftKey) {
+            if (this._previewCursorVisible) {
+                //make textbox
+                let { LocalX, LocalY } = this.props.ContainingDocumentView!.TransformToLocalPoint(this._downX, this._downY);
+                let newBox = Documents.TextDocument({ width: 200, height: 100, x: LocalX, y: LocalY, title: "new" });
+                this.addDocument(newBox);
+            }
+        }
+    }
+
+    @action
     bringToFront(doc: CollectionFreeFormDocumentView) {
         const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
 
@@ -221,6 +250,16 @@ export class CollectionFreeFormView extends CollectionViewBase {
         const pany: number = Document.GetNumber(KeyStore.PanY, 0);
         var me = this;
 
+        let cursor = null;
+        //toggle for preview cursor -> will be on when user taps freeform
+        if (this._previewCursorVisible) {
+            //get local position and place cursor there!
+            let { LocalX, LocalY } = this.props.ContainingDocumentView!.TransformToLocalPoint(this._downX, this._downY);
+            cursor = <div id="prevCursor" onKeyPress={this.onKeyDown} style={{ color: "black", transform: `translate(${LocalX}px, ${LocalY}px)` }}>I</div>
+        }
+
+
+
         return (
             <div className="collectionfreeformview-container"
                 onPointerDown={this.onPointerDown}
@@ -237,6 +276,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
                     ref={this._canvasRef}>
 
                     {this.props.BackgroundView}
+                    {cursor}
                     {value.map(doc => {
                         return (<CollectionFreeFormDocumentView key={doc.Id} Document={doc}
                             AddDocument={this.addDocument}