+
diff --git a/website/o3dv/css/core.css b/website/o3dv/css/core.css
index 274393b..e68fbc7 100644
--- a/website/o3dv/css/core.css
+++ b/website/o3dv/css/core.css
@@ -48,7 +48,7 @@ a:hover
}
-@media only screen and (max-width: 700px)
+@media only screen and (max-width: 800px)
{
.only_full_width
@@ -58,7 +58,7 @@ a:hover
}
-@media only screen and (max-height: 700px)
+@media only screen and (max-height: 800px)
{
.only_full_height
diff --git a/website/o3dv/css/website.css b/website/o3dv/css/website.css
index 9026d22..37a806a 100644
--- a/website/o3dv/css/website.css
+++ b/website/o3dv/css/website.css
@@ -109,6 +109,14 @@ div.main_navigator
float: left;
}
+div.main_navigator_splitter
+{
+ width: 10px;
+ overflow: none;
+ float: left;
+ cursor: col-resize;
+}
+
div.main_viewer
{
float: left;
@@ -124,7 +132,7 @@ div.main_sidebar
div.main_viewer canvas
{
- margin: 10px;
+ margin: 10px 10px 10px 0px;
border: 1px solid var(--ov_border_color);
outline: none;
display: block;
@@ -316,7 +324,7 @@ div.ov_property_table div.ov_property_table_row.group
padding: 4px 0px;
white-space: nowrap;
text-overflow: ellipsis;
- overflow: hidden;
+ overflow: hidden;
}
div.ov_property_table div.ov_property_table_row.ingroup
@@ -378,7 +386,7 @@ div.ov_navigator_info_panel div.ov_navigator_info_button:hover
}
-@media only screen and (max-width: 700px)
+@media only screen and (max-width: 800px)
{
div.intro div.intro_section
diff --git a/website/o3dv/js/featureset.js b/website/o3dv/js/featureset.js
index 5e65cc5..6763ad9 100644
--- a/website/o3dv/js/featureset.js
+++ b/website/o3dv/js/featureset.js
@@ -1,4 +1,4 @@
OV.FeatureSet =
{
- NavigatorTree : false
+ NavigatorTree : true
};
diff --git a/website/o3dv/js/splitter.js b/website/o3dv/js/splitter.js
new file mode 100644
index 0000000..fac23e8
--- /dev/null
+++ b/website/o3dv/js/splitter.js
@@ -0,0 +1,43 @@
+OV.VerticalSplitter = class
+{
+ constructor (splitterDiv, callbacks)
+ {
+ this.callbacks = callbacks;
+ this.mouseMoveHandler = (ev) => {
+ this.OnMouseMove (ev);
+ };
+ this.mouseUpHandler = () => {
+ this.OnMouseUp ();
+ };
+ splitterDiv.mousedown ((ev) => {
+ this.OnMouseDown (ev);
+ });
+ this.originalPosition = null;
+ }
+
+ OnMouseDown (ev)
+ {
+ this.originalPosition = ev.clientX;
+ this.callbacks.onSplitStart ();
+
+ document.addEventListener ('mousemove', this.mouseMoveHandler);
+ document.addEventListener ('mouseup', this.mouseUpHandler);
+ document.addEventListener ('mouseleave', this.mouseUpHandler);
+ }
+
+ OnMouseMove (ev)
+ {
+ ev.preventDefault ();
+ const diff = ev.clientX - this.originalPosition;
+ this.callbacks.onSplit (diff);
+ }
+
+ OnMouseUp ()
+ {
+ document.removeEventListener ('mousemove', this.mouseMoveHandler);
+ document.removeEventListener ('mouseup', this.mouseUpHandler);
+ document.removeEventListener ('mouseleave', this.mouseUpHandler);
+
+ this.originalPosition = null;
+ }
+};
diff --git a/website/o3dv/js/utils.js b/website/o3dv/js/utils.js
index a037504..e08e848 100644
--- a/website/o3dv/js/utils.js
+++ b/website/o3dv/js/utils.js
@@ -28,12 +28,12 @@ OV.IsHoverEnabled = function ()
OV.IsSmallWidth = function ()
{
- return window.matchMedia ('(max-width: 700px)').matches;
+ return window.matchMedia ('(max-width: 800px)').matches;
};
OV.IsSmallHeight = function ()
{
- return window.matchMedia ('(max-height: 700px)').matches;
+ return window.matchMedia ('(max-height: 800px)').matches;
};
OV.InstallTooltip = function (item, text)
diff --git a/website/o3dv/js/website.js b/website/o3dv/js/website.js
index d1ee3a1..28ace7b 100644
--- a/website/o3dv/js/website.js
+++ b/website/o3dv/js/website.js
@@ -24,6 +24,7 @@ OV.Website = class
side : THREE.DoubleSide
});
this.themeHandler = new OV.ThemeHandler ();
+ this.navigatorSplitter = null;
this.detailsPanel = null;
this.settingsPanel = null;
this.model = null;
@@ -65,7 +66,8 @@ OV.Website = class
let sidebarWidth = 0;
let safetyMargin = 0;
if (!OV.IsSmallWidth ()) {
- navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10);
+ let navigatorSplitterWidth = parseInt (this.parameters.navigatorSplitterDiv.outerWidth (true), 10);
+ navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10) + navigatorSplitterWidth;
if (this.sidebar.IsVisible ()) {
sidebarWidth = parseInt (this.parameters.sidebarDiv.outerWidth (true), 10);
}
@@ -76,6 +78,7 @@ OV.Website = class
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);
@@ -671,6 +674,21 @@ 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 newWidth = navigatorOriginalWidth + xDiff;
+ if (newWidth < 250 || newWidth > 450) {
+ return;
+ }
+ this.parameters.navigatorDiv.outerWidth (newWidth, true);
+ this.Resize ();
+ }
+ });
+
this.navigator.Init ({
openFileBrowserDialog : () => {
this.OpenFileBrowserDialog ();