From 3db8305f45233850031eaee1f19436ee7034df59 Mon Sep 17 00:00:00 2001
From: Nathan-SR <144961007+Nathan-SR@users.noreply.github.com>
Date: Wed, 10 Jul 2024 03:15:43 -0400
Subject: menu progress

---
 .../views/nodes/DataVizBox/DocCreatorMenu.scss     | 14 ++++++-
 .../views/nodes/DataVizBox/DocCreatorMenu.tsx      | 46 ++++++++++++++++------
 2 files changed, 46 insertions(+), 14 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
index 43053ee34..dc0f99cbd 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
@@ -46,10 +46,22 @@
     margin-bottom: 0px;
 }
 
-.docCreatorMenu-content {
+.docCreatorMenu-preview-content {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    overflow-y: scroll;
     margin: 5px;
     width: calc(100% - 10px);
     height: calc(100% - 51px);
     border: 1px solid whitesmoke;
     border-radius: 5px;
+
+    .docCreatorMenu-preview-window {
+        width: 125px;
+        height: 125px;
+        margin-top: 10px;
+        margin-left: 10px;
+        border: 1px solid whitesmoke;
+        border-radius: 5px;
+    }
 }
\ No newline at end of file
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
index dbd385047..520dd9c2d 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
@@ -79,8 +79,6 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> {
 
     @action
     toggleDisplay = (x: number, y: number) => {
-        // maxX and maxY will change if the UI/font size changes, but will work for any amount
-        // of items added to the menu
         if (this._shouldDisplay) {
             this._shouldDisplay = false;
         } else {
@@ -107,8 +105,24 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> {
         }
     }
 
-    setDragStart = () => {
+    get templatesPreviewContents(){
+        const tempArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+        return (
+            <div className='docCreatorMenu-preview-content'>
+                {tempArray.map(i => 
+                    <div
+                        className='docCreatorMenu-preview-window'
+                    >
+                    
+                    </div>)}
+            </div>
+        );
+    }
 
+    get optionsMenuContents(){
+        return (
+            <div></div>
+        );
     }
 
     render() {
@@ -167,7 +181,21 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> {
                         >
                             <FontAwesomeIcon icon={this._menuContent === 'templates' ? 'table-cells' : 'window-maximize'}/>
                         </button>
-                        <button className='docCreatorMenu-menu-button close-menu'>
+                        <button 
+                            className='docCreatorMenu-menu-button close-menu'
+                            onPointerDown={e =>
+                                setupMoveUpEvents(
+                                    this,
+                                    e,
+                                    returnFalse,
+                                    emptyFunction,
+                                    undoable(clickEv => {
+                                        clickEv.stopPropagation();
+                                        this.closeMenu();
+                                    }, 'open actions menu')
+                                )
+                            }
+                        >
                             <FontAwesomeIcon icon={'minus'}/>
                         </button>
                         <button className='docCreatorMenu-menu-button right'>
@@ -175,15 +203,7 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> {
                         </button>
                     </div>
                     <hr className='docCreatorMenu-menu-hr'/>
-                    <div className='docCreatorMenu-content'>
-                        {this._menuContent === 'templates' ? 
-                            <div>
-                            </div>
-                            :
-                            <div>
-                            </div>
-                        }
-                    </div>
+                    {this._menuContent === 'templates' ? this.templatesPreviewContents : this.optionsMenuContents}
                 </>
             }
             </div>
-- 
cgit v1.2.3-70-g09d2