From c088ab205fbbb239873c8934fae4c5b489ac661d Mon Sep 17 00:00:00 2001
From: kovacsv <viktorkovacs@gmail.com>
Date: Sat, 6 Nov 2021 08:26:19 +0100
Subject: [PATCH] Move splitter logic in the navigator.

---
 website/o3dv/js/navigator.js | 39 ++++++++++++++++++++++++++++++++----
 website/o3dv/js/website.js   | 32 ++++++-----------------------
 2 files changed, 41 insertions(+), 30 deletions(-)

diff --git a/website/o3dv/js/navigator.js b/website/o3dv/js/navigator.js
index 4d16c9b..07f9b40 100644
--- a/website/o3dv/js/navigator.js
+++ b/website/o3dv/js/navigator.js
@@ -33,10 +33,12 @@ OV.Selection = class
 
 OV.Navigator = class
 {
-    constructor (parentDiv)
+    constructor (mainDiv, splitterDiv)
     {
-        this.parentDiv = parentDiv;
-        this.panelSet = new OV.PanelSet (parentDiv);
+        this.mainDiv = mainDiv;
+        this.splitterDiv = splitterDiv;
+
+        this.panelSet = new OV.PanelSet (mainDiv);
         this.callbacks = null;
         this.selection = null;
         this.tempSelectedMeshId = null;
@@ -54,6 +56,7 @@ OV.Navigator = class
     Init (callbacks)
     {
         this.callbacks = callbacks;
+
         this.filesPanel.Init ({
             onFileBrowseButtonClicked : () => {
                 this.callbacks.openFileBrowserDialog ();
@@ -81,10 +84,38 @@ OV.Navigator = class
                 this.FitNodeToWindow (nodeId);
             }
         });
+
+        let originalWidth = null;
+        new OV.VerticalSplitter (this.splitterDiv, {
+            onSplitStart : () => {
+                originalWidth = this.mainDiv.outerWidth (true);
+            },
+            onSplit : (xDiff) => {
+                const minWidth = 250;
+                const maxWidth = 450;
+                let newWidth = originalWidth + xDiff;
+                if (newWidth < minWidth) {
+                    newWidth = minWidth;
+                } else if (newWidth > maxWidth)  {
+                    newWidth = maxWidth;
+                }
+                this.mainDiv.outerWidth (newWidth, true);
+                this.callbacks.onResize ();
+            }
+        });
     }
 
-    Resize ()
+    GetWidth ()
     {
+        let navigatorWidth = parseInt (this.mainDiv.outerWidth (true), 10);
+        let splitterWidth = parseInt (this.splitterDiv.outerWidth (true), 10);
+        return navigatorWidth + splitterWidth;
+    }
+
+    Resize (height)
+    {
+        this.mainDiv.outerHeight (height, true);
+        this.splitterDiv.outerHeight (height, true);
         this.panelSet.Resize ();
     }
 
diff --git a/website/o3dv/js/website.js b/website/o3dv/js/website.js
index 3f13209..39e4088 100644
--- a/website/o3dv/js/website.js
+++ b/website/o3dv/js/website.js
@@ -15,13 +15,12 @@ OV.Website = class
         this.cookieHandler = new OV.CookieHandler ();
         this.toolbar = new OV.Toolbar (this.parameters.toolbarDiv);
         this.sidebar = new OV.Sidebar (this.parameters.sidebarDiv);
-        this.navigator = new OV.Navigator (this.parameters.navigatorDiv);
+        this.navigator = new OV.Navigator (this.parameters.navigatorDiv, this.parameters.navigatorSplitterDiv);
         this.eventHandler = new OV.EventHandler (this.parameters.eventHandler);
         this.settings = new OV.Settings ();
         this.modelLoader = new OV.ThreeModelLoader ();
         this.themeHandler = new OV.ThemeHandler ();
         this.highlightColor = new THREE.Color (0x8ec9f0);
-        this.navigatorSplitter = null;
         this.detailsPanel = null;
         this.settingsPanel = null;
         this.model = null;
@@ -63,8 +62,7 @@ OV.Website = class
         let sidebarWidth = 0;
         let safetyMargin = 0;
         if (!OV.IsSmallWidth ()) {
-            let navigatorSplitterWidth = parseInt (this.parameters.navigatorSplitterDiv.outerWidth (true), 10);
-            navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10) + navigatorSplitterWidth;
+            navigatorWidth = this.navigator.GetWidth ();
             if (this.sidebar.IsVisible ()) {
                 sidebarWidth = parseInt (this.parameters.sidebarDiv.outerWidth (true), 10);
             }
@@ -74,12 +72,10 @@ OV.Website = class
         let contentWidth = windowWidth - navigatorWidth - sidebarWidth - safetyMargin;
         let contentHeight = windowHeight - headerHeight - safetyMargin;
 
-        this.parameters.navigatorDiv.outerHeight (contentHeight, true);
-        this.parameters.navigatorSplitterDiv.outerHeight (contentHeight, true);
         this.parameters.sidebarDiv.outerHeight (contentHeight, true);
         this.parameters.introDiv.outerHeight (contentHeight, true);
 
-        this.navigator.Resize ();
+        this.navigator.Resize (contentHeight);
         this.sidebar.Resize ();
         this.viewer.Resize (contentWidth, contentHeight);
     }
@@ -683,25 +679,6 @@ OV.Website = class
             return usedMaterials;
         }
 
-        let navigatorOriginalWidth = null;
-        this.navigatorSplitter = new OV.VerticalSplitter (this.parameters.navigatorSplitterDiv, {
-            onSplitStart : () => {
-                navigatorOriginalWidth = this.parameters.navigatorDiv.outerWidth (true);
-            },
-            onSplit : (xDiff) => {
-                const minWidth = 250;
-                const maxWidth = 450;
-                let newWidth = navigatorOriginalWidth + xDiff;
-                if (newWidth < minWidth) {
-                    newWidth = minWidth;
-                } else if (newWidth > maxWidth)  {
-                    newWidth = maxWidth;
-                }
-                this.parameters.navigatorDiv.outerWidth (newWidth, true);
-                this.Resize ();
-            }
-        });
-
         this.navigator.Init ({
             openFileBrowserDialog : () => {
                 this.OpenFileBrowserDialog ();
@@ -736,6 +713,9 @@ OV.Website = class
             },
             onMaterialSelected : (materialIndex) => {
                 this.detailsPanel.AddMaterialProperties (this.model.GetMaterial (materialIndex));
+            },
+            onResize : () => {
+                this.Resize ();
             }
         });
     }