diff --git a/tools/config.json b/tools/config.json index 4e81ecd..f7dc003 100644 --- a/tools/config.json +++ b/tools/config.json @@ -76,6 +76,7 @@ "website/o3dv/cookiedialog.js", "website/o3dv/modeldata.js", "website/o3dv/navigator.js", + "website/o3dv/sidebar.js", "website/o3dv/hashhandler.js", "website/o3dv/website.css", "website/o3dv/loader.js", diff --git a/website/embed.html b/website/embed.html index 289256e..2b686e3 100644 --- a/website/embed.html +++ b/website/embed.html @@ -90,6 +90,7 @@ + diff --git a/website/index.html b/website/index.html index d82903b..0e94c0a 100644 --- a/website/index.html +++ b/website/index.html @@ -90,6 +90,7 @@ + @@ -111,6 +112,7 @@ mainDiv : $('#main'), introDiv : $('#intro'), navigatorDiv : $('#main_navigator'), + sidebarDiv : $('#main_sidebar'), viewerDiv : $('#main_viewer'), fileInput : $('#open_file') }); @@ -144,6 +146,8 @@
+
+
diff --git a/website/o3dv/sidebar.js b/website/o3dv/sidebar.js new file mode 100644 index 0000000..539157e --- /dev/null +++ b/website/o3dv/sidebar.js @@ -0,0 +1,9 @@ +OV.Sidebar = class +{ + constructor (parentDiv) + { + this.parentDiv = parentDiv; + this.titleDiv = $('
').addClass ('ov_sidebar_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv); + this.titleDiv.html ('Details'); + } +}; diff --git a/website/o3dv/website.css b/website/o3dv/website.css index 0fc77b6..a520a5a 100644 --- a/website/o3dv/website.css +++ b/website/o3dv/website.css @@ -129,6 +129,14 @@ div.main_viewer float: left; } +div.main_sidebar +{ + width: 240px; + margin: 10px 10px 10px 0px; + overflow: none; + float: right; +} + div.main_viewer canvas { margin: 10px; @@ -240,6 +248,17 @@ div.ov_navigator_info_panel img.ov_navigator_info_button_icon float: right; } +div.ov_sidebar_title +{ + font-weight: bold; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + padding-bottom: 10px; + margin-bottom: 10px; + border-bottom: 1px solid #dddddd; +} + div.ov_tree_view { user-select: none; diff --git a/website/o3dv/website.js b/website/o3dv/website.js index 57b8119..2e40a78 100644 --- a/website/o3dv/website.js +++ b/website/o3dv/website.js @@ -8,6 +8,7 @@ OV.Website = class this.cookieHandler = new OV.CookieHandler (); this.toolbar = new OV.Toolbar (this.parameters.toolbarDiv); this.navigator = new OV.Navigator (this.parameters.navigatorDiv); + this.sidebar = new OV.Sidebar (this.parameters.sidebarDiv); this.importSettings = new OV.ImportSettings (); this.modelLoader = new OV.ThreeModelLoader (); this.highlightMaterial = new THREE.MeshPhongMaterial ({ @@ -49,13 +50,15 @@ OV.Website = class let headerHeight = parseInt (this.parameters.headerDiv.outerHeight (true), 10); let navigatorWidth = 0; + let sidebarWidth = 0; let safetyMargin = 0; if (!OV.IsSmallWidth ()) { navigatorWidth = parseInt (this.parameters.navigatorDiv.outerWidth (true), 10); + sidebarWidth = parseInt (this.parameters.sidebarDiv.outerWidth (true), 10); safetyMargin = 1; } - let contentWidth = windowWidth - navigatorWidth - safetyMargin; + let contentWidth = windowWidth - navigatorWidth - sidebarWidth - safetyMargin; let contentHeight = windowHeight - headerHeight - safetyMargin; this.parameters.navigatorDiv.outerHeight (contentHeight, true); this.parameters.introDiv.outerHeight (contentHeight, true);