From 21af12f4c140485023450ad348703d69ffd2a724 Mon Sep 17 00:00:00 2001
From: anika-ahluwalia <anika.ahluwalia@gmail.com>
Date: Tue, 21 Jul 2020 22:10:34 -0500
Subject: cleaned up tab on right

---
 src/client/util/CurrentUserUtils.ts |  3 +++
 src/client/views/MainView.scss      | 26 +++++++++++++++++---------
 src/client/views/MainView.tsx       | 36 ++++++++++++++++++++++++------------
 3 files changed, 44 insertions(+), 21 deletions(-)

(limited to 'src')

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index 005648b1e..088e20a3e 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -45,6 +45,7 @@ export class CurrentUserUtils {
     @observable public static workspaceStack: any | undefined;
     @observable public static catalogStack: any | undefined;
     @observable public static closedStack: any | undefined;
+    @observable public static searchStack: any | undefined;
 
     // sets up the default User Templates - slideView, queryView, descriptionView
     static setupUserTemplateButtons(doc: Doc) {
@@ -737,6 +738,7 @@ export class CurrentUserUtils {
 
     // setup the Search button which will display the search panel.
     static setupSearchBtnPanel(doc: Doc, sidebarContainer: Doc) {
+        doc["tabs-button-search"] = undefined;
         if (doc["tabs-button-search"] === undefined) {
             doc["tabs-button-search"] = new PrefetchProxy(Docs.Create.ButtonDocument({
                 _width: 50, _height: 25, title: "Search", _fontSize: "10pt",
@@ -747,6 +749,7 @@ export class CurrentUserUtils {
                 lockedPosition: true,
                 onClick: ScriptField.MakeScript("this.targetContainer.proto = this.sourcePanel")
             }));
+            CurrentUserUtils.searchStack = new PrefetchProxy(Docs.Create.QueryDocument({ title: "search stack", })) as any as Doc;
         }
         return doc["tabs-button-search"] as Doc;
     }
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index dfd5a993e..9454b0c78 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -122,8 +122,8 @@
     padding-right: 50px;
 
     .mainView-menuPanel-button {
-        width: 50px;
-        height: 50px;
+        width: 45px;
+        height: 45px;
         padding: 10px;
         pointer-events: all;
         touch-action: none;
@@ -139,7 +139,7 @@
         .mainView-menuPanel-button-label {
             background: rgb(168, 168, 168);
             color: black;
-            margin-left: -10px;
+            margin-left: -13px;
             border-radius: 8px;
             width: 65px;
             position: absolute;
@@ -269,22 +269,30 @@
 
 .mainView-expandFlyoutButton {
     position: absolute;
-    top: 100px;
-    right: 30px;
+    top: 120px;
+    right: 55px;
     cursor: pointer;
 }
 
 .mainView-libraryHandle {
-    width: 20px;
+    width: 28px;
     left: calc(100% - 10px);
-    height: 40px;
+    height: 55px;
     top: 50%;
     border: 1px solid black;
-    border-radius: 5px;
+    border-radius: 8px;
     position: absolute;
     z-index: 2;
     touch-action: none;
-    cursor: ew-resize;
+    cursor: grab;
+
+    .mainView-libraryHandle-icon {
+        width: 10px;
+        height: 10px;
+        float: right;
+        margin-right: 1px;
+    }
+
 }
 
 .mainView-workspace {
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 845a61d32..766626a82 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -489,7 +489,8 @@ export class MainView extends React.Component {
             </button>
 
             <button className="mainView-menuPanel-button"
-                onPointerDown={e => this.selectPanel("sharing")}
+                //onPointerDown={e => this.selectPanel("sharing")}
+                onClick={() => GroupManager.Instance.open()}
                 style={{
                     padding: "5px",
                     background: "black",
@@ -505,12 +506,24 @@ export class MainView extends React.Component {
                     padding: "5px",
                     background: "black",
                     boxShadow: "4px 4px 12px black",
-                    marginBottom: "45px"
+                    //marginBottom: "45px"
                 }}>
                 <FontAwesomeIcon className="mainView-menuPanel-button-icon" icon="wrench" color="white" size="lg" />
                 <div className="mainView-menuPanel-button-label"> Tools </div>
             </button>
 
+            <button className="mainView-menuPanel-button"
+                onPointerDown={e => this.selectPanel("search")}
+                style={{
+                    padding: "5px",
+                    background: "black",
+                    boxShadow: "4px 4px 12px black",
+                    //marginBottom: "45px"
+                }}>
+                <FontAwesomeIcon className="mainView-menuPanel-button-icon" icon="search" color="white" size="lg" />
+                <div className="mainView-menuPanel-button-label"> Search </div>
+            </button>
+
             <button className="mainView-menuPanel-bottomButton"
                 onPointerDown={e => this.selectPanel("help")}
                 style={{
@@ -536,12 +549,11 @@ export class MainView extends React.Component {
 
     @action
     selectPanel = (str: string) => {
-
-        if (this.panelContent === str) {
-            this.sidebarContent = null;
+        if (this.panelContent === str && this.flyoutWidth !== 0) {
             this.panelContent = "none";
-            MainView.Instance._flyoutTranslate = false;
+            this.flyoutWidth = 0;
         } else {
+            this.panelContent = str;
             MainView.expandFlyout();
             if (str === "tools") {
                 CurrentUserUtils.toolsBtn;
@@ -552,10 +564,8 @@ export class MainView extends React.Component {
                 this.sidebarContent.proto = CurrentUserUtils.catalogStack;
             } else if (str === "deleted") {
                 this.sidebarContent.proto = CurrentUserUtils.closedStack;
-            } else if (str === "upload") {
-                this.sidebarContent.proto = "uploads";
-            } else if (str === "sharing") {
-                this.sidebarContent.proto = "sharing";
+            } else if (str === "search") {
+                this.sidebarContent.proto = CurrentUserUtils.searchStack;
             }
         }
     }
@@ -573,7 +583,7 @@ export class MainView extends React.Component {
                 {this.menuPanel}
                 <div style={{ display: "contents", flexDirection: "row", position: "relative" }}>
                     <div className="mainView-flyoutContainer" onPointerLeave={this.pointerLeaveDragger} style={{ width: this.flyoutWidth }}>
-                        {MainView.Instance._flyoutTranslate ? <div className="mainView-libraryHandle"
+                        {this.flyoutWidth !== 0 ? <div className="mainView-libraryHandle"
                             onPointerDown={this.onPointerDown}
                             style={{ backgroundColor: this.defaultBackgroundColors(this.sidebarContent) }}>
                             <span title="library View Dragger" style={{
@@ -582,6 +592,8 @@ export class MainView extends React.Component {
                                 position: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "absolute" : "fixed",
                                 top: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "" : "0"
                             }} />
+                            <div className="mainview-libraryHandle-icon">
+                                <FontAwesomeIcon icon="chevron-left" color="black" size="sm" /> </div>
                         </div> : null}
                         <div className="mainView-libraryFlyout" style={{
                             //transformOrigin: this._flyoutTranslate ? "" : "left center",
@@ -590,7 +602,7 @@ export class MainView extends React.Component {
                             boxShadow: this._flyoutTranslate ? "" : "rgb(156, 147, 150) 0.2vw 0.2vw 0.2vw"
                         }}>
                             {this.flyout}
-                            {MainView.Instance._flyoutTranslate ? this.expandButton : null}
+                            {this.expandButton}
                         </div>
                     </div>
                     {this.dockingContent}
-- 
cgit v1.2.3-70-g09d2