From e4ef3a04e3bd0bb20ed70181d51a9c419a00613f Mon Sep 17 00:00:00 2001
From: yipstanley <stanley_yip@brown.edu>
Date: Fri, 19 Jul 2019 16:57:09 -0400
Subject: documents are now droppable and draggable

---
 .../views/collections/CollectionSchemaCells.tsx    | 71 +++++++++++++++-------
 1 file changed, 50 insertions(+), 21 deletions(-)

(limited to 'src/client/views/collections/CollectionSchemaCells.tsx')

diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx
index 1bb661f88..72d993b5a 100644
--- a/src/client/views/collections/CollectionSchemaCells.tsx
+++ b/src/client/views/collections/CollectionSchemaCells.tsx
@@ -17,7 +17,9 @@ import { CollectionPDFView } from "./CollectionPDFView";
 import "./CollectionSchemaView.scss";
 import { CollectionVideoView } from "./CollectionVideoView";
 import { CollectionView } from "./CollectionView";
-import { NumCast, StrCast, BoolCast } from "../../../new_fields/Types";
+import { NumCast, StrCast, BoolCast, FieldValue, Cast } from "../../../new_fields/Types";
+import { Docs } from "../../documents/Documents";
+import { DocumentContentsView } from "../nodes/DocumentContentsView";
 
 
 export interface CellProps {
@@ -43,6 +45,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
     @observable protected _isEditing: boolean = false;
     protected _focusRef = React.createRef<HTMLDivElement>();
     protected _document = this.props.rowProps.original;
+    private _dropDisposer?: DragManager.DragDropDisposer;
 
     componentDidMount() {
         if (this._focusRef.current) {
@@ -54,6 +57,7 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
         }
 
         document.addEventListener("keydown", this.onKeyDown);
+
     }
 
     componentWillUnmount() {
@@ -88,6 +92,27 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
         return true;
     }
 
+    private drop = (e: Event, de: DragManager.DropEvent) => {
+        if (de.data instanceof DragManager.DocumentDragData) {
+            let fieldKey = this.props.rowProps.column.id as string;
+            if (de.data.draggedDocuments.length === 1) {
+                this._document[fieldKey] = de.data.draggedDocuments[0];
+            }
+            else {
+                let coll = Docs.Create.SchemaDocument(["title"], de.data.draggedDocuments, {});
+                this._document[fieldKey] = coll;
+            }
+            e.stopPropagation();
+        }
+    }
+
+    private dropRef = (ele: HTMLElement) => {
+        this._dropDisposer && this._dropDisposer();
+        if (ele) {
+            this._dropDisposer = DragManager.MakeDropTarget(ele, { handlers: { drop: this.drop.bind(this) } });
+        }
+    }
+
     renderCellWithType(type: string | undefined) {
         let props: FieldViewProps = {
             Document: this.props.rowProps.original,
@@ -107,22 +132,25 @@ export class CollectionSchemaCell extends React.Component<CellProps> {
             PanelWidth: returnZero,
             addDocTab: this.props.addDocTab,
         };
-        let reference = React.createRef<HTMLDivElement>();
         let onItemDown = (e: React.PointerEvent) => {
-            // (!this.props.CollectionView.props.isSelected() ? undefined :
-            //     SetupDrag(reference, () => props.Document, this.props.moveDocument, this.props.Document.schemaDoc ? "copy" : undefined)(e));
+            SetupDrag(this._focusRef, () => this._document[props.fieldKey] instanceof Doc ? this._document[props.fieldKey] : this._document,
+                (doc: Doc, target: Doc, addDoc: (newDoc: Doc) => any) => addDoc(doc), this._document[props.fieldKey] instanceof Doc ? "alias" : undefined)(e);
         };
 
         let field = props.Document[props.fieldKey];
         let contents: any = "incorrect type";
-        if (type === undefined) contents =  <FieldView {...props} />;
+        if (type === undefined) contents = <FieldView {...props} />;
         if (type === "number") contents = typeof field === "number" ? NumCast(field) : "--" + typeof field + "--";
         if (type === "string") contents = typeof field === "string" ? (StrCast(field) === "" ? "--" : StrCast(field)) : "--" + typeof field + "--";
         if (type === "boolean") contents = typeof field === "boolean" ? (BoolCast(field) ? "true" : "false") : "--" + typeof field + "--";
+        if (type === "document") {
+            let doc = FieldValue(Cast(field, Doc));
+            contents = typeof field === "object" ? doc ? StrCast(doc.title) === "" ? "--" : StrCast(doc.title) : `--${typeof field}--` : `--${typeof field}--`;
+        }
 
         return (
             <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <div className="collectionSchemaView-cellContents" onPointerDown={onItemDown} key={props.Document[Id]} ref={reference}>
+                <div className="collectionSchemaView-cellContents" ref={this.dropRef} onPointerDown={onItemDown} key={props.Document[Id]}>
                     <EditableView
                         editing={this._isEditing}
                         // isEditingCallback={this.isEditingCallback}
@@ -193,9 +221,9 @@ export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
     toggleChecked = (e: React.ChangeEvent<HTMLInputElement>) => {
         this._isChecked = e.target.checked;
         let script = CompileScript(e.target.checked.toString(), { requiredType: "boolean", addReturn: true, params: { this: Doc.name } });
-            if (script.compiled) {
-                this.applyToDoc(this._document, script.run);
-            }
+        if (script.compiled) {
+            this.applyToDoc(this._document, script.run);
+        }
     }
 
     render() {
@@ -207,7 +235,7 @@ export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
         return (
             <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
                 <div className="collectionSchemaView-cellContents" onPointerDown={onItemDown} key={this._document[Id]} ref={reference}>
-                    <input type="checkbox" checked={this._isChecked} onChange={this.toggleChecked}/>
+                    <input type="checkbox" checked={this._isChecked} onChange={this.toggleChecked} />
                 </div >
             </div>
         );
@@ -217,16 +245,17 @@ export class CollectionSchemaCheckboxCell extends CollectionSchemaCell {
 @observer
 export class CollectionSchemaDocCell extends CollectionSchemaCell {
     render() {
-        let reference = React.createRef<HTMLDivElement>();
-        let onItemDown = (e: React.PointerEvent) => {
-            // (!this.props.CollectionView.props.isSelected() ? undefined :
-            //     SetupDrag(reference, () => props.Document, this.props.moveDocument, this.props.Document.schemaDoc ? "copy" : undefined)(e));
-        };
-        return (
-            <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
-                <div className="collectionSchemaView-cellContents" onPointerDown={onItemDown} key={this._document[Id]} ref={reference}>
-                </div >
-            </div>
-        );
+        return this.renderCellWithType("document");
+        // let reference = React.createRef<HTMLDivElement>();
+        // let onItemDown = (e: React.PointerEvent) => {
+        //     // (!this.props.CollectionView.props.isSelected() ? undefined :
+        //     //     SetupDrag(reference, () => props.Document, this.props.moveDocument, this.props.Document.schemaDoc ? "copy" : undefined)(e));
+        // };
+        // return (
+        //     <div className="collectionSchemaView-cellWrapper" ref={this._focusRef} tabIndex={-1} onPointerDown={this.onPointerDown}>
+        //         <div className="collectionSchemaView-cellContents" onPointerDown={onItemDown} key={this._document[Id]} ref={reference}>
+        //         </div >
+        //     </div>
+        // );
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2

