Move splitter logic in the navigator.

This commit is contained in:
kovacsv 2021-11-06 08:26:19 +01:00
parent a1808ead20
commit c088ab205f
2 changed files with 41 additions and 30 deletions

View File

@ -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 ();
}

View File

@ -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 ();
}
});
}