getting close to done

8 files changed, 94 insertions, 49 deletions

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index df69e215a..57f91399a 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -500,7 +500,8 @@ export class DocumentOptions {
     userColor?: STRt = new StrInfo('color associated with a Dash user (seen in header fields of shared documents)');
 
     cardSort?: STRt = new StrInfo('way cards are sorted in deck view');
-    customSortCount?: NUMt = new NumInfo('number of custom sorts the user has created');
+    customSortNumber?: NUMt = new NumInfo('number of custom sorts the user has created');
+    customHashMap?: List<string>
     // card_sort_time?: BOOLt = new BoolInfo('whether sorting cards in deck view by time');
     // card_sort_type?: BOOLt = new BoolInfo('whether sorting cards in deck view by type');
     // card_sort_color?: BOOLt = new BoolInfo('whether sorting cards in deck view by color');
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 59560dd78..abc728cd3 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -730,7 +730,11 @@ pie title Minerals in my tap water
             { title: "Type",   icon:"eye", toolTip:"Sort by document type",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"docType",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
             { title: "Color",   icon:"palette", toolTip:"Sort by document color",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"color",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
             { title: "Links",   icon:"link", toolTip:"Sort by its links",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"links",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
-            { title: "Create",   icon:"plus", toolTip:"Create new custom groupings!",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"custom",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
+            { title: "Create",   icon:"robot", toolTip:"Create your first custom grouping!",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"custom1",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
+            { title: "Create",   icon:"star", toolTip:"Create your second custom grouping!",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"custom2",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
+            { title: "Create",   icon:"satellite", toolTip:"Create your third custom grouping!",  btnType: ButtonType.ToggleButton,  expertMode: false, toolType:"custom3",    funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}},
+
+
             // ...customs
 
         ]
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index a5882dcf3..f1296e46a 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -527,7 +527,9 @@ export class MainView extends ObservableReactComponent<{}> {
                 fa.faArrowsDownToLine,
                 fa.faPalette,
                 fa.faHourglassHalf,
-                fa.faRobot
+                fa.faRobot,
+                fa.faSatellite,
+                fa.faStar
             ]
         );
     }
diff --git a/src/client/views/collections/CollectionCardDeckView.scss b/src/client/views/collections/CollectionCardDeckView.scss
index 09d6f70ea..babc604b5 100644
--- a/src/client/views/collections/CollectionCardDeckView.scss
+++ b/src/client/views/collections/CollectionCardDeckView.scss
@@ -68,7 +68,7 @@ button {
 .card-item-active,
 .card-item {
     position: relative;
-    transition: transform 0.3s ease-in-out;
+    transition: transform 0.5s ease-in-out;
 }
 
 .card-item-active {
diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index 996c5711b..fc183b72b 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -2,7 +2,7 @@ import { ObservableMap, action, computed, makeObservable, observable } from 'mob
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { Utils, returnFalse, returnTrue, returnZero } from '../../../Utils';
-import { Doc, DocListCast, Field } from '../../../fields/Doc';
+import { Doc, DocListCast, Field, StrListCast } from '../../../fields/Doc';
 import { Id } from '../../../fields/FieldSymbols';
 import { NumCast, ScriptCast, StrCast, BoolCast, DocCast } from '../../../fields/Types';
 import { DragManager } from '../../util/DragManager';
@@ -17,6 +17,7 @@ import { LinkManager } from '../../util/LinkManager';
 import { DocumentType } from '../../documents/DocumentTypes';
 import { forEach } from 'lodash';
 import { SnappingManager } from '../../util/SnappingManager';
+import { List } from '../../../fields/List';
 
 @observer
 export class CollectionCardView extends CollectionSubView() {
@@ -70,11 +71,49 @@ export class CollectionCardView extends CollectionSubView() {
         super(props);
         makeObservable(this);
         // this.rotationDegree(7);
+
+        if (this._props.Document.customHashMap != undefined){
+            this.customGroupDictionary = this.getCustoms(StrListCast(this._props.Document.customHashMap))
+        }
+    }
+
+    @observable customGroupDictionary: Map<number, number>[] = [new Map<number, number>(), new Map<number, number>(), new Map<number, number>()];
+
+    @computed get mapToField(): List<string> {
+        const resultList = new List<string>(); // Creating a new ListImpl instance for strings
+
+        this.customGroupDictionary.forEach(map => {
+            // Convert each map to a single string with entries formatted as "key:value"
+            const mapString = Array.from(map.entries())
+                                   .map(([key, value]) => `${key}:${value}`)
+                                   .join(','); // Join all key-value pairs with commas
+            resultList.push(mapString); // Add the formatted string of the current map to the list
+        });
+
+        return resultList;
+    }
+
+    getCustoms = (stringFrom: string[]): Map<number, number>[] => {
+        return stringFrom.map(s => {
+            // Create a new Map object for each string.
+            const map = new Map<number, number>();
+            // Split the string by commas to get key-value pairs, then process each pair.
+            s.split(',').forEach(pair => {
+                const [key, value] = pair.split(':');
+                map.set(Number(key), Number(value));
+            });
+            return map;
+        });
     }
 
+
+
+
+
     private _dropDisposer?: DragManager.DragDropDisposer;
 
     componentWillUnmount() {
+        console.log("hey hey hey")
         this._dropDisposer?.();
     }
 
@@ -253,9 +292,11 @@ export class CollectionCardView extends CollectionSubView() {
                     break;
 
                 case 'custom':
-                    typeA = this.customGroupDictionary.get(docs.indexOf(docA)) ?? '';
+
+                console.log(this.customGroupDictionary[NumCast(this._props.Document.customSortNumber)])
+                    typeA = this.customGroupDictionary[NumCast(this._props.Document.customSortNumber)].get(docs.indexOf(docA)) ?? '9999';
                     // console.log(typeA + "A")
-                    typeB = this.customGroupDictionary.get(docs.indexOf(docB)) ?? '';
+                    typeB = this.customGroupDictionary[NumCast(this._props.Document.customSortNumber)].get(docs.indexOf(docB)) ?? '9999';
                     // console.log(typeB + 'b')
                     break;
 
@@ -397,7 +438,7 @@ export class CollectionCardView extends CollectionSubView() {
                                 SnappingManager.SetIsResizing(undefined);
                                 this._forceChildXf = !this._forceChildXf;
                             }),
-                            400
+                            700
                         );
                     }}
                     style={{
@@ -419,11 +460,13 @@ export class CollectionCardView extends CollectionSubView() {
         });
     }
 
-    @observable amGroups = 0;
-    @observable customGroupDictionary = new Map<number, number>();
+   
+    
+    
 
     @action toggleButton(childPairIndex: number, buttonID: number) {
-        this.customGroupDictionary.set(childPairIndex, buttonID);
+        this.customGroupDictionary[NumCast(this._props.Document.customSortNumber)].set(childPairIndex, buttonID);
+        this._props.Document.customHashMap = this.mapToField
     }
 
     renderButtons(childPairIndex: number) {
@@ -431,11 +474,7 @@ export class CollectionCardView extends CollectionSubView() {
 
         let amButtons = 4;
 
-        if (this.amGroups > 4) {
-            amButtons = this.amGroups;
-        }
-
-        let activeButtonIndex = this.customGroupDictionary.get(childPairIndex);
+        let activeButtonIndex = this.customGroupDictionary[NumCast(this._props.Document.customSortNumber)].get(childPairIndex);
 
         for (let i = 0; i < amButtons; i++) {
             const isActive = activeButtonIndex == i;
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
index becad63f6..22005eb23 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLayoutEngines.tsx
@@ -126,27 +126,20 @@ export function computeStarburstLayout(poolData: Map<string, PoolData>, pivotDoc
 }
 
 // export function computeCardDeckLayout(poolData: Map<string, PoolData>, pivotDoc: Doc, childPairs: { layout: Doc; data?: Doc }[], panelDim: number[], viewDefsToJSX: (views: ViewDefBounds[]) => ViewDefResult[], engineProps: any) {
-//     console.log('hi');
 //     const docMap = new Map<string, PoolData>();
-//     const spreadWidth = Math.min(panelDim[0], childPairs.length * 50); // Total width of the spread
-//     const startX = -(spreadWidth / 2); // Starting X position
-//     const fanAngle = 5; // Angle in degrees for fanning out cards
-//     const baseZIndex = 1000; // Base Z-index to ensure cards are stacked in order
+//     const burstDiam = [NumCast(pivotDoc._width), NumCast(pivotDoc._height)];
+//     const burstScale = NumCast(pivotDoc._starburstDocScale, 1);
 
 //     childPairs.forEach(({ layout, data }, i) => {
 //         const aspect = NumCast(layout._height) / NumCast(layout._width);
-//         const docSize = Math.min(400, NumCast(layout._width)) * NumCast(pivotDoc._starburstDocScale, 1);
-//         const posX = startX + (spreadWidth / childPairs.length) * i;
-//         const posY = 0; // Adjust if you want to change the vertical alignment
-//         const rotation = (i - (childPairs.length / 2)) * fanAngle; // Calculate rotation for fanning effect
-
+//         const docSize = Math.min(Math.min(400, NumCast(layout._width)), Math.min(400, NumCast(layout._width)) / aspect) * burstScale;
+//         const deg = (i / childPairs.length) * Math.PI * 2;
 //         docMap.set(layout[Id], {
-//             x: posX,
-//             y: posY,
+//             x: Math.min(burstDiam[0] / 2 - docSize, Math.max(-burstDiam[0] / 2, (Math.cos(deg) * burstDiam[0]) / 2 - docSize / 2)),
+//             y: Math.min(burstDiam[1] / 2 - docSize * aspect, Math.max(-burstDiam[1] / 2, (Math.sin(deg) * burstDiam[1]) / 2 - (docSize / 2) * aspect)),
 //             width: docSize,
 //             height: docSize * aspect,
-//             zIndex: baseZIndex + i,
-//             rotation: rotation,
+//             zIndex: NumCast(layout.zIndex),
 //             pair: { layout, data },
 //             replica: '',
 //             color: 'white',
@@ -154,9 +147,8 @@ export function computeStarburstLayout(poolData: Map<string, PoolData>, pivotDoc
 //             transition: 'all 0.3s',
 //         });
 //     });
-
-//     const divider = { type: 'div', color: 'transparent', x: -panelDim[0] / 2, y: -panelDim[1] / 2, width: 15, height: 15, payload: undefined };
-//     return normalizeResults(panelDim, 12, docMap, poolData, viewDefsToJSX, [], 0, [divider]);
+//     const divider = { type: 'div', color: 'transparent', x: -burstDiam[0] / 2, y: -burstDiam[1] / 2, width: 15, height: 15, payload: undefined };
+//     return normalizeResults(burstDiam, 12, docMap, poolData, viewDefsToJSX, [], 0, [divider]);
 // }
 
 export function computePivotLayout(poolData: Map<string, PoolData>, pivotDoc: Doc, childPairs: { layout: Doc; data?: Doc }[], panelDim: number[], viewDefsToJSX: (views: ViewDefBounds[]) => ViewDefResult[], engineProps: any) {
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index 98684ae98..7e7a5c2c6 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -533,7 +533,7 @@ export class MarqueeView extends ObservableReactComponent<SubCollectionViewProps
             this.delete(e, e.key === 'h');
             e.stopPropagation();
         }
-        if ('ctsSpga'.indexOf(e.key) !== -1) {
+        if ('ctsSpgac'.indexOf(e.key) !== -1) {
 
             this._commandExecuted = true;
             e.stopPropagation();
@@ -543,7 +543,7 @@ export class MarqueeView extends ObservableReactComponent<SubCollectionViewProps
             if (e.key === 'c' || e.key === 't') this.collection(e);
             if (e.key === 's' || e.key === 'S') this.summary(e);
             if (e.key === 'p') this.pileup(e)
-            // if (e.key === 'a') this.spreadCards(e);
+            // if (e.key === 'c') this.spreadCards(e);
 
             this.cleanupInteractions(false);
         }
diff --git a/src/client/views/global/globalScripts.ts b/src/client/views/global/globalScripts.ts
index 9056917fe..30602ea0b 100644
--- a/src/client/views/global/globalScripts.ts
+++ b/src/client/views/global/globalScripts.ts
@@ -107,10 +107,10 @@ ScriptingGlobals.add(function toggleOverlay(checkResult?: boolean) {
 
 
 
-ScriptingGlobals.add(function showFreeform(attr: 'flashcards' | 'center' | 'grid' | 'snaplines' | 'clusters' | 'arrange' | 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'links' | 'custom' | 'create', checkResult?: boolean, persist?: boolean, customNumber?: number) {
+ScriptingGlobals.add(function showFreeform(attr: 'flashcards' | 'center' | 'grid' | 'snaplines' | 'clusters' | 'arrange' | 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'links' | 'custom1' | 'custom2' | 'custom3', checkResult?: boolean, persist?: boolean, customNumber?: number) {
     const selected = SelectionManager.Docs.lastElement();
     // prettier-ignore
-    const map: Map<'flashcards' | 'center' |'grid' | 'snaplines' | 'clusters' | 'arrange'| 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'links' | 'custom' | 'create', { waitForRender?: boolean, checkResult: (doc:Doc) => any; setDoc: (doc:Doc, dv:DocumentView) => void;}> = new Map([
+    const map: Map<'flashcards' | 'center' |'grid' | 'snaplines' | 'clusters' | 'arrange'| 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'links' | 'custom1' | 'custom2' | 'custom3', { waitForRender?: boolean, checkResult: (doc:Doc) => any; setDoc: (doc:Doc, dv:DocumentView) => void;}> = new Map([
         ['grid', {
             checkResult: (doc:Doc) => BoolCast(doc?._freeform_backgroundGrid, false),
             setDoc: (doc:Doc,dv:DocumentView) => doc._freeform_backgroundGrid = !doc._freeform_backgroundGrid,
@@ -158,21 +158,28 @@ ScriptingGlobals.add(function showFreeform(attr: 'flashcards' | 'center' | 'grid
             setDoc: (doc:Doc,dv:DocumentView) => doc.cardSort = "links",
         }],
 
-        ['custom', {
+        ['custom1', {
             checkResult: (doc:Doc) => StrCast(doc?.cardSort),
-            setDoc: (doc:Doc,dv:DocumentView) => doc.cardSort = "custom",
-        }],
-
-        //in an ideal world lol
-
-
-        // ['create', {
-        //     checkResult: (doc:Doc) => NumCast(doc?.customSortCount),
-        //     setDoc: (doc:Doc,dv:DocumentView) => doc.customSortCount = NumCast(doc.customSortCount) + 1,
-        // }],
+            setDoc: (doc, dv) => {
+                doc.cardSort = "custom";
+                doc.customSortNumber = 0;
+            }
+        }],        
 
-       
+        ['custom2', {
+            checkResult: (doc:Doc) => StrCast(doc?.cardSort),
+            setDoc: (doc, dv) => {
+                doc.cardSort = "custom";
+                doc.customSortNumber = 1;
+                console.log(doc.customSortNumber + " numberrrrrrrr")
+            }        }],
 
+        ['custom3', {
+            checkResult: (doc:Doc) => StrCast(doc?.cardSort),
+            setDoc: (doc, dv) => {
+                doc.cardSort = "custom";
+                doc.customSortNumber = 2;
+            }        }],
    ]);
 
     if (checkResult) {