From 1f3c2a97592afe36ffe167bafbb4cae515238134 Mon Sep 17 00:00:00 2001
From: ljungster <parkerljung@gmail.com>
Date: Thu, 17 Mar 2022 10:35:23 -0400
Subject: gutted NoteTaking

---
 .../CollectionNoteTakingViewFieldColumn.tsx        | 71 ++++++----------------
 1 file changed, 20 insertions(+), 51 deletions(-)

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

diff --git a/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx b/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx
index c191445e7..535411118 100644
--- a/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx
+++ b/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx
@@ -3,13 +3,14 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { action, computed, observable } from "mobx";
 import { observer } from "mobx-react";
 import { Doc, DocListCast, Opt } from "../../../fields/Doc";
+import { Id } from "../../../fields/FieldSymbols";
 import { RichTextField } from "../../../fields/RichTextField";
 import { PastelSchemaPalette, SchemaHeaderField } from "../../../fields/SchemaHeaderField";
 import { ScriptField } from "../../../fields/ScriptField";
-import { Cast, NumCast, StrCast } from "../../../fields/Types";
+import { NumCast } from "../../../fields/Types";
 import { ImageField } from "../../../fields/URLField";
 import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, setupMoveUpEvents, returnFalse, returnEmptyString } from "../../../Utils";
+import { emptyFunction, returnEmptyString, setupMoveUpEvents } from "../../../Utils";
 import { Docs, DocUtils } from "../../documents/Documents";
 import { DocumentType } from "../../documents/DocumentTypes";
 import { DragManager } from "../../util/DragManager";
@@ -19,30 +20,27 @@ import { undoBatch } from "../../util/UndoManager";
 import { ContextMenu } from "../ContextMenu";
 import { ContextMenuProps } from "../ContextMenuItem";
 import { EditableView } from "../EditableView";
-import "./CollectionStackingView.scss";
 import { FormattedTextBox } from "../nodes/formattedText/FormattedTextBox";
-import { Id } from "../../../fields/FieldSymbols";
+import "./CollectionStackingView.scss";
 const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
 
-// So this is how we are storing a column
 interface CSVFieldColumnProps {
     Document: Doc;
     DataDoc: Opt<Doc>;
     docList: Doc[];
     heading: string;
-    pivotField: string;
+    columnIndex: string;
     chromeHidden?: boolean;
     columnHeaders: SchemaHeaderField[] | undefined;
     headingObject: SchemaHeaderField | undefined;
     yMargin: number;
     columnWidth: number;
-    numGroupColumns: number;
+    numColumns: number;
     gridGap: number;
     type: "string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function" | undefined;
     headings: () => object[];
-    // I think that stacking view actually has a single column and then supposedly you can add more columns? Unsure
     renderChildren: (docs: Doc[]) => JSX.Element[];
     addDocument: (doc: Doc | Doc[]) => boolean;
     createDropTarget: (ele: HTMLDivElement) => void;
@@ -52,15 +50,15 @@ interface CSVFieldColumnProps {
 }
 
 @observer
-export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldColumnProps> {
+export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFieldColumnProps> {
     @observable private _background = "inherit";
 
     private dropDisposer?: DragManager.DragDropDisposer;
     private _headerRef: React.RefObject<HTMLDivElement> = React.createRef();
 
-    @observable _paletteOn = false;
+    // @observable _paletteOn = false;
     @observable _heading = this.props.headingObject ? this.props.headingObject.heading : this.props.heading;
-    @observable _color = this.props.headingObject ? this.props.headingObject.color : "#f1efeb";
+    // @observable _color = this.props.headingObject ? this.props.headingObject.color : "#f1efeb";
     _ele: HTMLElement | null = null;
 
     // This is likely similar to what we will be doing. Why do we need to make these refs?
@@ -81,8 +79,9 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
     @undoBatch
     columnDrop = action((e: Event, de: DragManager.DropEvent) => {
         const drop = { docs: de.complete.docDragData?.droppedDocuments, val: this.getValue(this._heading) };
-        drop.docs?.forEach(d => Doc.SetInPlace(d, this.props.pivotField, drop.val, false));
+        drop.docs?.forEach(d => Doc.SetInPlace(d, this.props.columnIndex, drop.val, false));
     });
+
     getValue = (value: string): any => {
         const parsed = parseInt(value);
         if (!isNaN(parsed)) return parsed;
@@ -92,13 +91,13 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
     }
 
     @action
-    headingChanged = (value: string, shiftDown?: boolean) => {
+    headingChanged = (value: string) => {
         const castedValue = this.getValue(value);
         if (castedValue) {
             if (this.props.columnHeaders?.map(i => i.heading).indexOf(castedValue.toString()) !== -1) {
                 return false;
             }
-            this.props.docList.forEach(d => d[this.props.pivotField] = castedValue);
+            this.props.docList.forEach(d => d[this.props.columnIndex] = castedValue);
             if (this.props.headingObject) {
                 this.props.headingObject.setHeading(castedValue.toString());
                 this._heading = this.props.headingObject.heading;
@@ -108,12 +107,6 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
         return false;
     }
 
-    @action
-    changeColumnColor = (color: string) => {
-        this.props.headingObject?.setColor(color);
-        this._color = color;
-    }
-
     @action pointerEntered = () => SnappingManager.GetIsDragging() && (this._background = "#b4b4b4");
     @action pointerLeave = () => this._background = "inherit";
     textCallback = (char: string) => this.addNewTextDoc("-typed text-", false, true);
@@ -121,7 +114,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
     @action
     addNewTextDoc = (value: string, shiftDown?: boolean, forceEmptyNote?: boolean) => {
         if (!value && !forceEmptyNote) return false;
-        const key = this.props.pivotField;
+        const key = this.props.columnIndex;
         const newDoc = Docs.Create.TextDocument(value, { _height: 18, _width: 200, _fitWidth: true, title: value, _autoHeight: true });
         newDoc[key] = this.getValue(this.props.heading);
         const maxHeading = this.props.docList.reduce((maxHeading, doc) => NumCast(doc.heading) > maxHeading ? NumCast(doc.heading) : maxHeading, 0);
@@ -134,7 +127,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
 
     @action
     deleteColumn = () => {
-        this.props.docList.forEach(d => d[this.props.pivotField] = undefined);
+        this.props.docList.forEach(d => d[this.props.columnIndex] = undefined);
         if (this.props.columnHeaders && this.props.headingObject) {
             const index = this.props.columnHeaders.indexOf(this.props.headingObject);
             this.props.columnHeaders.splice(index, 1);
@@ -157,7 +150,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
         alias._pivotField = undefined;
         let value = this.getValue(this._heading);
         value = typeof value === "string" ? `"${value}"` : value;
-        alias.viewSpecScript = ScriptField.MakeFunction(`doc.${this.props.pivotField} === ${value}`, { doc: Doc.name });
+        alias.viewSpecScript = ScriptField.MakeFunction(`doc.${this.props.columnIndex} === ${value}`, { doc: Doc.name });
         if (alias.viewSpecScript) {
             DragManager.StartDocumentDrag([this._headerRef.current!], new DragManager.DocumentDragData([alias]), e.clientX, e.clientY);
             return true;
@@ -165,21 +158,6 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
         return false;
     }
 
-    renderColorPicker = () => {
-        const gray = "#f1efeb";
-        const selected = this.props.headingObject ? this.props.headingObject.color : gray;
-        const colors = ["pink2", "purple4", "bluegreen1", "yellow4", "gray", "red2", "bluegreen7", "bluegreen5", "orange1"];
-        return <div className="collectionStackingView-colorPicker">
-            <div className="colorOptions">
-                {colors.map(col => {
-                    const palette = PastelSchemaPalette.get(col);
-                    return <div className={"colorPicker" + (selected === palette ? " active" : "")}
-                        style={{ backgroundColor: palette }} onClick={() => this.changeColumnColor(palette!)} />;
-                })}
-            </div>
-        </div>;
-    }
-
     renderMenu = () => {
         return <div className="collectionStackingView-optionPicker">
             <div className="optionOptions">
@@ -246,7 +224,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
     }
     @computed get innards() {
         TraceMobx();
-        const key = this.props.pivotField;
+        const key = this.props.columnIndex;
         const headings = this.props.headings();
         const heading = this._heading;
         const columnYMargin = this.props.headingObject ? 0 : this.props.yMargin;
@@ -264,22 +242,13 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
                     Further, it does not have a color and cannot be deleted. */}
                 <div className="collectionStackingView-sectionHeader-subCont" onPointerDown={this.headerDown}
                     title={evContents === `NO ${key.toUpperCase()} VALUE` ?
-                        `Documents that don't have a ${key} value will go here. This column cannot be removed.` : ""}
-                    style={{ background: evContents !== `NO ${key.toUpperCase()} VALUE` ? this._color : "inherit" }}>
+                        `Documents that don't have a ${key} value will go here. This column cannot be removed.` : ""}>
                     <EditableView
                         GetValue={() => evContents}
                         SetValue={this.headingChanged}
                         contents={evContents}
                         oneLine={true}
                         toggle={this.toggleVisibility} />
-                    {evContents === `NO ${key.toUpperCase()} VALUE` ? (null) :
-                        <div className="collectionStackingView-sectionColor">
-                            <button className="collectionStackingView-sectionColorButton" onClick={action(e => this._paletteOn = !this._paletteOn)}>
-                                <FontAwesomeIcon icon="palette" size="lg" />
-                            </button>
-                            {this._paletteOn ? this.renderColorPicker() : (null)}
-                        </div>
-                    }
                     {<button className="collectionStackingView-sectionDelete" onClick={this.deleteColumn}>
                         <FontAwesomeIcon icon="trash" size="lg" />
                     </button>}
@@ -294,7 +263,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
                     }
                 </div>
             </div> : (null);
-        const templatecols = `${this.props.columnWidth / this.props.numGroupColumns}px `;
+        const templatecols = `${this.props.columnWidth / this.props.numColumns}px `;
         const type = this.props.Document.type;
         return <>
             {this.props.Document._columnsHideIfEmpty ? (null) : headingView}
@@ -322,7 +291,7 @@ export class CollectionStackingViewFieldColumn extends React.Component<CSVFieldC
                         // bottom note
                         //TODO: ok, so we are using a single column, and this is it!
                             <div key={`${heading}-add-document`} className="collectionStackingView-addDocumentButton"
-                                style={{ width: this.props.columnWidth / this.props.numGroupColumns, marginBottom: 10, marginLeft: 25 }}>
+                                style={{ width: this.props.columnWidth / this.props.numColumns, marginBottom: 10, marginLeft: 25 }}>
                                 <EditableView
                                     GetValue={returnEmptyString}
                                     SetValue={this.addNewTextDoc}
-- 
cgit v1.2.3-70-g09d2

