From 21fe0267b705823db4f8cb52100d3c9b2fb05832 Mon Sep 17 00:00:00 2001 From: Viktor Kovacs Date: Fri, 21 May 2021 16:29:30 +0200 Subject: [PATCH] Calculate Volume and Surface Area #72 --- website/o3dv/dialogs.js | 11 +------ website/o3dv/featureset.js | 3 +- website/o3dv/info.js | 8 +++-- website/o3dv/modal.js | 52 +++++++++++++++++++++-------- website/o3dv/quantitiesdialog.js | 56 ++++++++++---------------------- website/o3dv/website.css | 16 +++++++++ website/o3dv/website.js | 20 +++--------- 7 files changed, 83 insertions(+), 83 deletions(-) diff --git a/website/o3dv/dialogs.js b/website/o3dv/dialogs.js index 22ab59f..bbca050 100644 --- a/website/o3dv/dialogs.js +++ b/website/o3dv/dialogs.js @@ -20,16 +20,7 @@ OV.ShowMessageDialog = function (title, message, subMessage) OV.ShowListPopup = function (button, items, callbacks) { let popup = new OV.ListPopup (); - popup.SetCustomResizeHandler (function (modalDiv) { - let offset = button.offset (); - let left = offset.left + button.outerWidth (false); - let bottom = offset.top + button.outerHeight (false); - modalDiv.offset ({ - left : left, - top : bottom - modalDiv.outerHeight (true) - }); - }); - popup.Init (); + popup.Init (button); for (let i = 0; i < items.length; i++) { let item = items[i]; popup.AddListItem (item, { diff --git a/website/o3dv/featureset.js b/website/o3dv/featureset.js index a20bdd7..e06b5ce 100644 --- a/website/o3dv/featureset.js +++ b/website/o3dv/featureset.js @@ -1,5 +1,4 @@ OV.FeatureSet = { - SetDefaultColor : false, - ModelQuantities : false + SetDefaultColor : false }; diff --git a/website/o3dv/info.js b/website/o3dv/info.js index 2bbe608..b170196 100644 --- a/website/o3dv/info.js +++ b/website/o3dv/info.js @@ -115,8 +115,8 @@ OV.InfoPanel = class let contentDiv = this.detailsItem.GetChildrenDiv (); let counterContainer = $('
').addClass ('ov_info_box').appendTo (contentDiv); - AddCounter (counterContainer, 'Vertices', info.vertexCount); - AddCounter (counterContainer, 'Triangles', info.triangleCount); + AddCounter (counterContainer, 'Vertices', info.element.VertexCount ()); + AddCounter (counterContainer, 'Triangles', info.element.TriangleCount ()); let sizeContainer = $('
').addClass ('ov_info_box').appendTo (contentDiv); $('
').addClass ('ov_info_box_title').html ('Size').appendTo (sizeContainer); @@ -134,6 +134,10 @@ OV.InfoPanel = class } let obj = this; + this.CreateButton (contentDiv, 'Calculate Quantities', function (button) { + obj.popup = OV.ShowQuantitiesPopup (button, info.element); + }); + let materialsText = 'Materials (' + materialItems.length + ')'; this.CreateButton (contentDiv, materialsText, function (button) { obj.popup = OV.ShowListPopup (button, materialItems, { diff --git a/website/o3dv/modal.js b/website/o3dv/modal.js index 60809f9..57e565d 100644 --- a/website/o3dv/modal.js +++ b/website/o3dv/modal.js @@ -181,19 +181,27 @@ OV.ButtonDialog = class } }; -OV.ListPopup = class +OV.PopupDialog = class { constructor () { this.modal = new OV.Modal (); - this.listDiv = null; } - Init () + Init (parentItem) { let contentDiv = this.modal.GetContentDiv (); contentDiv.addClass ('ov_popup'); - this.listDiv = $('
').addClass ('ov_popup_list').addClass ('ov_thin_scrollbar').appendTo (contentDiv); + this.modal.SetCustomResizeHandler (function (modalDiv) { + let offset = parentItem.offset (); + let left = offset.left + parentItem.outerWidth (false); + let bottom = offset.top + parentItem.outerHeight (false); + modalDiv.offset ({ + left : left, + top : bottom - modalDiv.outerHeight (true) + }); + }); + return contentDiv; } SetCustomResizeHandler (customResizeHandler) @@ -201,6 +209,32 @@ OV.ListPopup = class this.modal.SetCustomResizeHandler (customResizeHandler); } + Show () + { + this.modal.Open (); + } + + Hide () + { + this.modal.Close (); + } +}; + +OV.ListPopup = class extends OV.PopupDialog +{ + constructor () + { + super (); + this.listDiv = null; + } + + Init (parentItem) + { + let contentDiv = super.Init (parentItem); + this.listDiv = $('
').addClass ('ov_popup_list').addClass ('ov_thin_scrollbar').appendTo (contentDiv); + return contentDiv; + } + AddListItem (item, callbacks) { let listItemDiv = $('
').addClass ('ov_popup_list_item').appendTo (this.listDiv); @@ -220,14 +254,4 @@ OV.ListPopup = class ); } } - - Show () - { - this.modal.Open (); - } - - Hide () - { - this.modal.Close (); - } }; diff --git a/website/o3dv/quantitiesdialog.js b/website/o3dv/quantitiesdialog.js index 09fcc8a..a0d0552 100644 --- a/website/o3dv/quantitiesdialog.js +++ b/website/o3dv/quantitiesdialog.js @@ -1,51 +1,29 @@ -OV.ShowQuantitiesDialog = function (model) +OV.ShowQuantitiesPopup = function (parentItem, element) { - function AddTableRow (table, name, value) - { - let row = $('').appendTo (table); - $('').html (name).appendTo (row); - $('').addClass ('right').html (value).appendTo (row); - } + 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); - if (model === null) { - return OV.ShowMessageDialog ( - 'Quantity Calculation Failed', - 'Please load a model before calculating quantities.', - null - ); - } - - let dialog = new OV.ButtonDialog (); - let contentDiv = dialog.Init ('Quantities', [ - { - name : 'OK', - onClick () { - dialog.Hide (); - } - } - ]); - - let progressDialog = new OV.ProgressDialog (); - progressDialog.Show ('Calculating Quantities'); OV.RunTaskAsync (function () { - progressDialog.Hide (); - - const volume = OV.CalculateVolume (model); - const surfaceArea = OV.CalculateSurfaceArea (model); + const volume = OV.CalculateVolume (element); + const surfaceArea = OV.CalculateSurfaceArea (element); let volumeString = ''; if (volume === null) { - volumeString = 'Model is not closed'; + volumeString = 'The model is not closed.'; } else { volumeString = volume.toFixed (5); } let surfaceAreaString = surfaceArea.toFixed (5); - let table = $('').addClass ('ov_dialog_table').appendTo (contentDiv); - AddTableRow (table, 'Volume', volumeString); - AddTableRow (table, 'Surface Area', surfaceAreaString); - - dialog.Show (); - + + volumeDiv.html (volumeString); + surfaceAreaDiv.html (surfaceAreaString); }); - return dialog; + + popup.Show (); + return popup; }; diff --git a/website/o3dv/website.css b/website/o3dv/website.css index 0fb7f27..f5946c1 100644 --- a/website/o3dv/website.css +++ b/website/o3dv/website.css @@ -628,6 +628,22 @@ 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; diff --git a/website/o3dv/website.js b/website/o3dv/website.js index ff0b0da..59689ff 100644 --- a/website/o3dv/website.js +++ b/website/o3dv/website.js @@ -305,13 +305,7 @@ OV.Website = class }); }); } - if (OV.FeatureSet.ModelQuantities) { - AddSeparator (this.toolbar, true); - AddButton (this.toolbar, 'settings', 'Model Quantities', true, function () { - obj.dialog = OV.ShowQuantitiesDialog (obj.model); - }); - } - + this.parameters.fileInput.on ('change', function (ev) { if (ev.target.files.length > 0) { obj.LoadModelFromFileList (ev.target.files); @@ -440,17 +434,13 @@ OV.Website = class function GetMeshInfo (viewer, model, meshIndex) { let result = { - name : null, - vertexCount : null, - triangleCount : null, + element : null, usedMaterials : null, boundingBox : null }; let mesh = model.GetMesh (meshIndex); - result.name = mesh.GetName (); - result.vertexCount = mesh.VertexCount (); - result.triangleCount = mesh.TriangleCount (); + result.element = mesh; let userData = GetMeshUserData (viewer, meshIndex); result.usedMaterials = []; @@ -472,9 +462,7 @@ OV.Website = class function GetModelInfo (model, viewer) { let result = { - name : null, - vertexCount : model.VertexCount (), - triangleCount : model.TriangleCount (), + element : model, usedMaterials : null, boundingBox : null };