From 3ad38f0445178bdfe025e4f6da60f68f03876f56 Mon Sep 17 00:00:00 2001
From: laurawilsonri <laura_wilson@brown.edu>
Date: Sat, 23 Feb 2019 23:14:13 -0500
Subject: letter is typed into box, but the cursor isn't positioned correctly
 and the box isn't selected

---
 src/client/util/DragManager.ts                     |  1 +
 .../views/collections/CollectionFreeFormView.tsx   |  2 ++
 src/client/views/nodes/FormattedTextBox.tsx        | 34 +++++++++++++++++-----
 src/fields/Key.ts                                  |  8 +++++
 4 files changed, 37 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index f4dcce7c8..dd8a63725 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -63,6 +63,7 @@ export namespace DragManager {
     let _lastPointerX: number = 0;
     let _lastPointerY: number = 0;
     export function StartDrag(ele: HTMLElement, dragData: { [id: string]: any }, options: DragOptions) {
+
         if (!dragDiv) {
             dragDiv = document.createElement("div");
             DragManager.Root().appendChild(dragDiv);
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index e1b1db685..a53df2d38 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -214,6 +214,8 @@ export class CollectionFreeFormView extends CollectionViewBase {
                 //newBox.SetData(KeyStore.Data, e.key, RichTextField);
                 //SelectionManager.SelectDoc(newBox, false);
                 this.addDocument(newBox);
+                newBox.SetText(KeyStore.Text, e.key);
+                newBox.SetNumber(KeyStore.SelectOnLoaded, 1);
 
                 //remove cursor from screen
                 this._previewCursorVisible = false;
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index 887a377b5..885cb55c4 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -10,12 +10,15 @@ import { Node } from "prosemirror-model";
 import { Opt, FieldWaiting, FieldValue } from "../../../fields/Field";
 import { SelectionManager } from "../../util/SelectionManager";
 import "./FormattedTextBox.scss";
+import { KeyStore } from "../../../fields/Key";
 import React = require("react")
 import { RichTextField } from "../../../fields/RichTextField";
 import { FieldViewProps, FieldView } from "./FieldView";
 import { CollectionFreeFormDocumentView } from "./CollectionFreeFormDocumentView";
 import { observer } from "mobx-react";
 import { Schema, DOMParser } from "prosemirror-model"
+import { Plugin } from 'prosemirror-state'
+import { Decoration, DecorationSet } from 'prosemirror-view'
 
 
 // FormattedTextBox: Displays an editable plain text node that maps to a specified Key of a Document
@@ -40,6 +43,7 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
     private _ref: React.RefObject<HTMLDivElement>;
     private _editorView: Opt<EditorView>;
     private _reactionDisposer: Opt<IReactionDisposer>;
+    private _lastTextState = "";
 
     constructor(props: FieldViewProps) {
         super(props);
@@ -55,16 +59,22 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
             this._editorView.updateState(state);
             const { doc, fieldKey } = this.props;
             doc.SetData(fieldKey, JSON.stringify(state.toJSON()), RichTextField);
+            this._lastTextState = JSON.stringify(state.toJSON);
         }
     }
 
-    setText(txt: string) {
-        let tr = new Transaction(new Node());
-        let node = new Node();
-        node.text = txt;
-        tr.insert(0, node);
-
-        this.dispatchTransaction(tr);
+    //enables textboxes to be created with preexisting text or placeholder text 
+    //this method is passed in as part of the config the editor state in componentDidMount()
+    placeholderPlugin(text: string) {
+        return new Plugin({
+            props: {
+                decorations(state) {
+                    let doc = state.doc
+                    if (doc.childCount == 1 && doc.firstChild && doc.firstChild.isTextblock && doc.firstChild.content.size == 0)
+                        return DecorationSet.create(doc, [Decoration.widget(1, document.createTextNode(text))])
+                }
+            }
+        })
     }
 
     componentDidMount() {
@@ -75,7 +85,11 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
             plugins: [
                 history(),
                 keymap({ "Mod-z": undo, "Mod-y": redo }),
-                keymap(baseKeymap)
+                keymap(baseKeymap),
+                //sets the placeholder text!
+                this.placeholderPlugin(
+                    this.props.doc.GetText(KeyStore.Text, "")
+                )
             ]
         };
 
@@ -118,6 +132,7 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
     @action
     onChange(e: React.ChangeEvent<HTMLInputElement>) {
         const { fieldKey, doc } = this.props;
+        this._lastTextState = e.target.value;
         doc.SetData(fieldKey, e.target.value, RichTextField);
     }
     onPointerDown = (e: React.PointerEvent): void => {
@@ -127,6 +142,9 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
         }
     }
     render() {
+        //if (this.props.doc.GetText(KeyStore.Text, "") !== ;
+
+
         return (<div className="formattedTextBox-cont"
             style={{
                 color: "initial",
diff --git a/src/fields/Key.ts b/src/fields/Key.ts
index 8d92b89b6..eeda7be4e 100644
--- a/src/fields/Key.ts
+++ b/src/fields/Key.ts
@@ -54,4 +54,12 @@ export namespace KeyStore {
     export const LayoutKeys = new Key("LayoutKeys");
     export const LayoutFields = new Key("LayoutFields");
     export const ColumnsKey = new Key("SchemaColumns");
+
+    //used for setting the text of a text document
+    export const Text = new Key("Text");
+    //determines whether doc views will be selected when they are first loaded
+    //should be NumberField where 0 = false and 1 = true
+    //currently only implemented for FormattedTextView
+    export const SelectOnLoaded = new Key("SelectOnLoaded");
+
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2