From f8e0f7b7712375341d95a68bc78d6369e9b1deb5 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Sun, 14 Mar 2021 21:25:03 -0400
Subject: added sidebar toggle for webBox

---
 src/client/views/nodes/WebBox.scss | 14 ++++++++++++--
 src/client/views/nodes/WebBox.tsx  | 12 ++++++++++++
 2 files changed, 24 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index 198e7ef10..cdff4aa74 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -6,8 +6,18 @@
     position: relative;
     display: flex;
 
-
-
+    .webBox-overlayButton-sidebar {
+        background: #121721;
+        height: 25px;
+        width: 25px;
+        right: 0;
+        display: flex;
+        position: absolute;
+        align-items: center;
+        justify-content: center;
+        border-radius: 3px;
+        pointer-events: all;
+    }
     .webBox-tagList {
         display: flex;
         flex-direction: row;
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index ab17703c8..6127f82e3 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -503,6 +503,14 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
         DocUtils.MakeLink({ doc: anchor }, { doc: target }, "inline markup", "annotation");
         this.sidebarAddDocument(target);
     }
+    toggleSidebar = () => {
+        if (this.layoutDoc.nativeWidth === this.layoutDoc[this.fieldKey + "-nativeWidth"]) {
+            this.layoutDoc.nativeWidth = 250 + NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]);
+        } else {
+            this.layoutDoc.nativeWidth = NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]);
+        }
+        this.layoutDoc._width = NumCast(this.layoutDoc._nativeWidth) * (NumCast(this.layoutDoc[this.fieldKey + "-nativeWidth"]) / NumCast(this.layoutDoc[this.fieldKey + "-nativeHeight"]))
+    }
     sidebarKey = () => this.fieldKey + "-sidebar";
     sidebarFiltersHeight = () => 50;
     sidebarTransform = () => this.props.ScreenToLocalTransform().translate(Doc.NativeWidth(this.dataDoc), 0).scale(this.props.scaling?.() || 1);
@@ -669,6 +677,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
                             annotationLayer={this._annotationLayer.current}
                             mainCont={this._mainCont.current} />}
                 </div >
+                <button className="webBox-overlayButton-sidebar" key="sidebar" title="Toggle Sidebar" style={{ right: this.sidebarWidth() + 7 }}
+                    onPointerDown={e => e.stopPropagation()} onClick={e => this.toggleSidebar()} >
+                    <FontAwesomeIcon style={{ color: "white" }} icon={"chevron-left"} size="sm" />
+                </button>
                 {this.sidebarOverlay}
                 {this.props.isSelected() ? this.editToggleBtn() : null}
             </div>);
-- 
cgit v1.2.3-70-g09d2