From 25d209b00f5933806b12541f31a8facafa99638c Mon Sep 17 00:00:00 2001 From: kovacsv Date: Sun, 20 Jun 2021 09:30:40 +0200 Subject: [PATCH] Add dummy properties to the sidebar. --- tools/config.json | 1 - website/embed.html | 1 - website/index.html | 1 - website/o3dv/navigator.js | 3 +- website/o3dv/quantitiesdialog.js | 29 ------------------- website/o3dv/sidebar.js | 49 ++++++++++++++++++++++++++++++-- website/o3dv/website.css | 49 +++++++++++++++++++++----------- website/o3dv/website.js | 2 ++ 8 files changed, 82 insertions(+), 53 deletions(-) delete mode 100644 website/o3dv/quantitiesdialog.js diff --git a/tools/config.json b/tools/config.json index f7dc003..12281b8 100644 --- a/tools/config.json +++ b/tools/config.json @@ -72,7 +72,6 @@ "website/o3dv/exportdialog.js", "website/o3dv/sharingdialog.js", "website/o3dv/settingsdialog.js", - "website/o3dv/quantitiesdialog.js", "website/o3dv/cookiedialog.js", "website/o3dv/modeldata.js", "website/o3dv/navigator.js", diff --git a/website/embed.html b/website/embed.html index 2b686e3..f4de938 100644 --- a/website/embed.html +++ b/website/embed.html @@ -86,7 +86,6 @@ - diff --git a/website/index.html b/website/index.html index 0e94c0a..a1a99c3 100644 --- a/website/index.html +++ b/website/index.html @@ -86,7 +86,6 @@ - diff --git a/website/o3dv/navigator.js b/website/o3dv/navigator.js index 5402f1c..03e816f 100644 --- a/website/o3dv/navigator.js +++ b/website/o3dv/navigator.js @@ -113,7 +113,7 @@ OV.Navigator = class this.parentDiv = parentDiv; this.sidebar = sidebar; this.callbacks = null; - this.titleDiv = $('
').addClass ('ov_navigator_tree_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv); + this.titleDiv = $('
').addClass ('ov_navigator_tree_title').appendTo (parentDiv); this.treeDiv = $('
').addClass ('ov_navigator_tree_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv); this.infoDiv = $('
').addClass ('ov_navigator_info_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv); this.treeView = new OV.TreeView (this.treeDiv); @@ -311,6 +311,7 @@ OV.Navigator = class let obj = this; if (this.selection === null) { let usedMaterial = this.callbacks.getMaterialsForModel (); + this.sidebar.AddProperties (null); this.infoPanel.FillWithModelInfo (usedMaterial, { onMaterialSelect : function (materialIndex) { obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex)); diff --git a/website/o3dv/quantitiesdialog.js b/website/o3dv/quantitiesdialog.js deleted file mode 100644 index a0d0552..0000000 --- a/website/o3dv/quantitiesdialog.js +++ /dev/null @@ -1,29 +0,0 @@ -OV.ShowQuantitiesPopup = function (parentItem, element) -{ - let popup = new OV.PopupDialog (); - let contentDiv = popup.Init (parentItem); - - $('
').addClass ('ov_popup_title').html ('Volume').appendTo (contentDiv); - let volumeDiv = $('
').addClass ('ov_popup_text').html ('Calculating...').appendTo (contentDiv); - $('
').addClass ('ov_popup_title').html ('Surface Area').appendTo (contentDiv); - let surfaceAreaDiv = $('
').addClass ('ov_popup_text').html ('Calculating...').appendTo (contentDiv); - - OV.RunTaskAsync (function () { - const volume = OV.CalculateVolume (element); - const surfaceArea = OV.CalculateSurfaceArea (element); - - let volumeString = ''; - if (volume === null) { - volumeString = 'The model is not closed.'; - } else { - volumeString = volume.toFixed (5); - } - let surfaceAreaString = surfaceArea.toFixed (5); - - volumeDiv.html (volumeString); - surfaceAreaDiv.html (surfaceAreaString); - }); - - popup.Show (); - return popup; -}; diff --git a/website/o3dv/sidebar.js b/website/o3dv/sidebar.js index 3a0c5ef..b60f129 100644 --- a/website/o3dv/sidebar.js +++ b/website/o3dv/sidebar.js @@ -8,10 +8,53 @@ OV.Sidebar = class constructor (parentDiv) { this.parentDiv = parentDiv; - this.titleDiv = $('
').addClass ('ov_sidebar_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv); + this.titleDiv = $('
').addClass ('ov_sidebar_title').appendTo (parentDiv); this.titleDiv.html ('Details'); - this.contentDiv = $('
').appendTo (parentDiv); + this.contentDiv = $('
').addClass ('ov_sidebar_content').addClass ('ov_thin_scrollbar').appendTo (parentDiv); } - + AddProperties (properties) + { + function AddProperty (table, name, value) + { + let row = $('').appendTo (table); + let nameColum = $('').addClass ('ov_property_table_name').appendTo (row); + let valueColumn = $('').addClass ('ov_property_table_value').appendTo (row); + nameColum.html (name).attr ('title', name); + valueColumn.html (value).attr ('title', value); + } + + this.Clear (); + let table = $('').addClass ('ov_property_table').appendTo (this.contentDiv); + AddProperty (table, 'Vertex Count', '1245'); + AddProperty (table, 'Triangle Count', '23466'); + AddProperty (table, 'Size', '12.0 x 14.0 x 6.0'); + AddProperty (table, 'Volume', '23423'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Emission Texture', 'Very very long property value'); + AddProperty (table, 'Very very long property name', 'Very very long property value'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + AddProperty (table, 'Surface Area', '45463'); + this.Resize (); + } + + Resize () + { + let titleHeight = this.titleDiv.outerHeight (true); + let height = this.parentDiv.height (); + this.contentDiv.outerHeight (height - titleHeight, true); + } + + Clear () + { + this.contentDiv.empty (); + } }; diff --git a/website/o3dv/website.css b/website/o3dv/website.css index a520a5a..0551eeb 100644 --- a/website/o3dv/website.css +++ b/website/o3dv/website.css @@ -131,7 +131,7 @@ div.main_viewer div.main_sidebar { - width: 240px; + width: 300px; margin: 10px 10px 10px 0px; overflow: none; float: right; @@ -259,6 +259,11 @@ div.ov_sidebar_title border-bottom: 1px solid #dddddd; } +div.ov_sidebar_content +{ + overflow: auto; +} + div.ov_tree_view { user-select: none; @@ -566,22 +571,6 @@ div.ov_popup border-radius: 5px; } -div.ov_popup div.ov_popup_title -{ - font-weight: bold; - margin-top: 15px; - margin-bottom: 10px; - margin-left: 10px; - margin-right: 10px; -} - -div.ov_popup div.ov_popup_text -{ - margin-bottom: 15px; - margin-left: 10px; - margin-right: 10px; -} - div.ov_popup div.ov_popup_list { max-height: 200px; @@ -635,6 +624,32 @@ div.ov_progress div.ov_progress_text text-align: center; } +table.ov_property_table +{ + border-collapse: collapse; +} + +table.ov_property_table td +{ + padding: 4px 0px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + display: inline-block; +} + +table.ov_property_table td.ov_property_table_name +{ + width: 45%; + padding-right: 8%; +} + +table.ov_property_table td.ov_property_table_value +{ + width: 45%; + text-align: right; +} + div.ov_thin_scrollbar { scrollbar-color: #cccccc transparent; diff --git a/website/o3dv/website.js b/website/o3dv/website.js index 042f29f..8e6b102 100644 --- a/website/o3dv/website.js +++ b/website/o3dv/website.js @@ -61,9 +61,11 @@ OV.Website = class let contentWidth = windowWidth - navigatorWidth - sidebarWidth - safetyMargin; let contentHeight = windowHeight - headerHeight - safetyMargin; this.parameters.navigatorDiv.outerHeight (contentHeight, true); + this.parameters.sidebarDiv.outerHeight (contentHeight, true); this.parameters.introDiv.outerHeight (contentHeight, true); this.navigator.Resize (); + this.sidebar.Resize (); this.viewer.Resize (contentWidth, contentHeight); }