diff --git a/website/o3dv/info.js b/website/o3dv/info.js deleted file mode 100644 index 2e59dbe..0000000 --- a/website/o3dv/info.js +++ /dev/null @@ -1,173 +0,0 @@ -OV.InfoPanel = class -{ - constructor (parentDiv) - { - this.mainDiv = $('
').addClass ('ov_info_panel_main').appendTo (parentDiv); - this.treeView = new OV.TreeView (this.mainDiv); - this.detailsItem = new OV.TreeViewGroupItem ('Details', 'assets/images/tree/details.svg'); - this.detailsItem.ShowChildren (!OV.IsSmallHeight (), null); - this.treeView.AddItem (this.detailsItem); - let childrenDiv = this.detailsItem.CreateChildrenDiv (); - childrenDiv.addClass ('ov_info_panel_content'); - this.popup = null; - } - - SetOpenCloseHandler (openCloseHandler) - { - this.detailsItem.SetAnimated (false); - this.detailsItem.SetOpenCloseHandler (openCloseHandler); - } - - FillWithMaterialInfo (info, callbacks) - { - function AddRow (container, name, fillValue) - { - let row = $('
').addClass ('ov_info_box_row').appendTo (container); - $('
').addClass ('ov_info_box_row_name').html (name).appendTo (row); - let value = $('
').addClass ('ov_info_box_row_value').appendTo (row); - fillValue (value); - } - - function AddTextRow (container, name, value) - { - AddRow (container, name, function (valueDiv) { - valueDiv.html (value).attr ('title', value); - }); - } - - function AddTextureRow (container, textureName) - { - AddRow (container, textureName.type, function (valueDiv) { - valueDiv.html (textureName.name).attr ('title', textureName.path); - }); - } - - this.Clear (); - if (info === null) { - return; - } - - let contentDiv = this.detailsItem.GetChildrenDiv (); - - let infoContainer = $('
').addClass ('ov_info_box').appendTo (contentDiv); - AddRow (infoContainer, 'Color', function (valueDiv) { - let colorString = '#' + OV.ColorToHexString (info.diffuse); - $('
').addClass ('ov_info_box_rgbbox').css ('background', colorString).attr ('title', colorString).appendTo (valueDiv); - $('
').addClass ('ov_info_box_rgbtext').html (colorString).attr ('title', colorString).appendTo (valueDiv); - }); - let opacityString = parseInt (Math.round (info.opacity * 100.0), 10) + '%'; - AddTextRow (infoContainer, 'Opacity', opacityString); - - if (info.textureNames.length > 0) { - let texturesContainer = $('
').addClass ('ov_info_box').appendTo (contentDiv); - $('
').addClass ('ov_info_box_title').html ('Textures').appendTo (texturesContainer); - let texturesContent = $('
').addClass ('ov_info_box_details').appendTo (texturesContainer); - for (let i = 0; i < info.textureNames.length; i++) { - let textureName = info.textureNames[i]; - AddTextureRow (texturesContent, textureName); - } - } - - let meshItems = []; - for (let i = 0; i < info.usedByMeshes.length; i++) { - let meshInfo = info.usedByMeshes[i]; - meshItems.push ({ - name : OV.GetMeshName (meshInfo.name) - }); - } - - let obj = this; - let meshesText = 'Meshes (' + meshItems.length + ')'; - this.CreateButton (contentDiv, meshesText, function (button) { - if (meshItems.length === 0) { - return; - } - obj.popup = OV.ShowListPopup (button, meshItems, { - onHoverStart : function (index) { - const meshItem = info.usedByMeshes[index]; - callbacks.onMeshHover (meshItem.index); - }, - onHoverStop : function (index) { - callbacks.onMeshHover (null); - }, - onClick : function (index) { - const meshItem = info.usedByMeshes[index]; - callbacks.onMeshSelect (meshItem.index); - } - }); - }); - } - - FillWithModelInfo (info, callbacks) - { - function AddCounter (parent, name, value) - { - let infoBox = $('
').addClass ('ov_info_box_column').css ('width', '50%').appendTo (parent); - $('
').addClass ('ov_info_box_title').html (name).appendTo (infoBox); - $('
').addClass ('ov_info_box_content_big').html (value.toLocaleString ('en-US')).appendTo (infoBox); - } - - this.Clear (); - if (info === null) { - return; - } - - let contentDiv = this.detailsItem.GetChildrenDiv (); - - let counterContainer = $('
').addClass ('ov_info_box').appendTo (contentDiv); - 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); - let size = OV.SubCoord3D (info.boundingBox.max, info.boundingBox.min); - let sizeString = size.x.toFixed (1) + ' x ' + size.y.toFixed (1) + ' x ' + size.z.toFixed (1); - $('
').addClass ('ov_info_box_content').html (sizeString).attr ('title', sizeString).appendTo (sizeContainer); - - let materialItems = []; - for (let i = 0; i < info.usedMaterials.length; i++) { - let usedMaterial = info.usedMaterials[i]; - materialItems.push ({ - name : OV.GetMaterialName (usedMaterial.name), - color : OV.ColorToHexString (usedMaterial.diffuse) - }); - } - - let obj = this; - if (OV.FeatureSet.CalculateQuantities) { - 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, { - onClick : function (index) { - let usedMaterial = info.usedMaterials[index]; - callbacks.onMaterialSelect (usedMaterial.index); - } - }); - }); - } - - CreateButton (parentDiv, buttonText, onClick) - { - let button = $('
').addClass ('ov_info_box_button').appendTo (parentDiv); - $('
').addClass ('ov_info_box_button_text').html (buttonText).appendTo (button); - $('').addClass ('ov_info_box_button_icon').attr ('src', 'assets/images/tree/arrow_right.svg').appendTo (button); - button.click (function () { - onClick (button); - }); - } - - Clear () - { - if (this.popup !== null) { - this.popup.Hide (); - this.popup = null; - } - let contentDiv = this.detailsItem.GetChildrenDiv (); - contentDiv.empty (); - } -}; diff --git a/website/o3dv/navigator.js b/website/o3dv/navigator.js index 08daa21..5402f1c 100644 --- a/website/o3dv/navigator.js +++ b/website/o3dv/navigator.js @@ -21,16 +21,16 @@ OV.NavigatorInfoPanel = class this.popup = null; } - FillWithMaterialInfo (info, callbacks) + FillWithMaterialInfo (usedByMeshes, callbacks) { this.Clear (); - if (info === null) { + if (usedByMeshes === null) { return; } let meshItems = []; - for (let i = 0; i < info.usedByMeshes.length; i++) { - let meshInfo = info.usedByMeshes[i]; + for (let i = 0; i < usedByMeshes.length; i++) { + let meshInfo = usedByMeshes[i]; meshItems.push ({ name : OV.GetMeshName (meshInfo.name) }); @@ -44,30 +44,30 @@ OV.NavigatorInfoPanel = class } obj.popup = OV.ShowListPopup (button, meshItems, { onHoverStart : function (index) { - const meshItem = info.usedByMeshes[index]; + const meshItem = usedByMeshes[index]; callbacks.onMeshHover (meshItem.index); }, onHoverStop : function (index) { callbacks.onMeshHover (null); }, onClick : function (index) { - const meshItem = info.usedByMeshes[index]; + const meshItem = usedByMeshes[index]; callbacks.onMeshSelect (meshItem.index); } }); }); } - FillWithModelInfo (info, callbacks) + FillWithModelInfo (usedMaterials, callbacks) { this.Clear (); - if (info === null) { + if (usedMaterials === null) { return; } let materialItems = []; - for (let i = 0; i < info.usedMaterials.length; i++) { - let usedMaterial = info.usedMaterials[i]; + for (let i = 0; i < usedMaterials.length; i++) { + let usedMaterial = usedMaterials[i]; materialItems.push ({ name : OV.GetMaterialName (usedMaterial.name), color : OV.ColorToHexString (usedMaterial.diffuse) @@ -75,17 +75,11 @@ OV.NavigatorInfoPanel = class } let obj = this; - if (OV.FeatureSet.CalculateQuantities) { - this.CreateButton (this.parentDiv, 'Calculate Quantities', function (button) { - obj.popup = OV.ShowQuantitiesPopup (button, info.element); - }); - } - let materialsText = 'Materials (' + materialItems.length + ')'; this.CreateButton (this.parentDiv, materialsText, function (button) { obj.popup = OV.ShowListPopup (button, materialItems, { onClick : function (index) { - let usedMaterial = info.usedMaterials[index]; + let usedMaterial = usedMaterials[index]; callbacks.onMaterialSelect (usedMaterial.index); } }); @@ -114,9 +108,10 @@ OV.NavigatorInfoPanel = class OV.Navigator = class { - constructor (parentDiv) + constructor (parentDiv, sidebar) { this.parentDiv = parentDiv; + this.sidebar = sidebar; this.callbacks = null; this.titleDiv = $('
').addClass ('ov_navigator_tree_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv); this.treeDiv = $('
').addClass ('ov_navigator_tree_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv); @@ -315,16 +310,16 @@ OV.Navigator = class { let obj = this; if (this.selection === null) { - let modelInfo = this.callbacks.getModelInformation (); - this.infoPanel.FillWithModelInfo (modelInfo, { + let usedMaterial = this.callbacks.getMaterialsForModel (); + this.infoPanel.FillWithModelInfo (usedMaterial, { onMaterialSelect : function (materialIndex) { obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex)); } }); } else { if (this.selection.type === OV.SelectionType.Material) { - let materialInfo = this.callbacks.getMaterialInformation (this.selection.index); - this.infoPanel.FillWithMaterialInfo (materialInfo, { + let usedByMeshes = this.callbacks.getMeshesForMaterial (this.selection.index); + this.infoPanel.FillWithMaterialInfo (usedByMeshes, { onMeshHover : function (meshIndex) { obj.SetTempSelectedMeshIndex (meshIndex); }, @@ -333,8 +328,8 @@ OV.Navigator = class } }); } else if (this.selection.type === OV.SelectionType.Mesh) { - let meshInfo = this.callbacks.getMeshInformation (this.selection.index); - this.infoPanel.FillWithModelInfo (meshInfo, { + let usedByMeshes = this.callbacks.getMaterialsForMesh (this.selection.index); + this.infoPanel.FillWithModelInfo (usedByMeshes, { onMaterialSelect : function (materialIndex) { obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex)); } diff --git a/website/o3dv/sidebar.js b/website/o3dv/sidebar.js index 539157e..3a0c5ef 100644 --- a/website/o3dv/sidebar.js +++ b/website/o3dv/sidebar.js @@ -1,3 +1,8 @@ +OV.PropertyType = +{ + Text : 1 +}; + OV.Sidebar = class { constructor (parentDiv) @@ -5,5 +10,8 @@ OV.Sidebar = class this.parentDiv = parentDiv; this.titleDiv = $('
').addClass ('ov_sidebar_title').addClass ('ov_thin_scrollbar').appendTo (parentDiv); this.titleDiv.html ('Details'); + this.contentDiv = $('
').appendTo (parentDiv); } + + }; diff --git a/website/o3dv/website.js b/website/o3dv/website.js index 2e40a78..042f29f 100644 --- a/website/o3dv/website.js +++ b/website/o3dv/website.js @@ -7,8 +7,8 @@ OV.Website = class this.hashHandler = new OV.HashHandler (); 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.navigator = new OV.Navigator (this.parameters.navigatorDiv, this.sidebar); this.importSettings = new OV.ImportSettings (); this.modelLoader = new OV.ThreeModelLoader (); this.highlightMaterial = new THREE.MeshPhongMaterial ({ @@ -372,58 +372,19 @@ OV.Website = class return userData; } - function GetBoundingBoxInfo (boundingBox) + function GetMeshesForMaterial (viewer, model, materialIndex) { - if (boundingBox === null) { - return null; - } - return { - min : new OV.Coord3D (boundingBox.min.x, boundingBox.min.y, boundingBox.min.z), - max : new OV.Coord3D (boundingBox.max.x, boundingBox.max.y, boundingBox.max.z) - }; - } - - function GetMaterialInfo (viewer, model, materialIndex) - { - function AddTexture (textureNames, type, texture) - { - if (texture === null) { - return; - } - textureNames.push ({ - type : type, - name : OV.GetFileName (texture.name), - path : texture.name - }); - } - - let material = model.GetMaterial (materialIndex); - let materialInfo = { - name : material.name, - ambient : material.ambient.Clone (), - diffuse : material.diffuse.Clone (), - specular : material.specular.Clone (), - opacity : material.opacity, - textureNames : [], - usedByMeshes : [] - }; - - AddTexture (materialInfo.textureNames, 'Base', material.diffuseMap); - AddTexture (materialInfo.textureNames, 'Specular', material.specularMap); - AddTexture (materialInfo.textureNames, 'Bump', material.bumpMap); - AddTexture (materialInfo.textureNames, 'Normal', material.normalMap); - AddTexture (materialInfo.textureNames, 'Emissive', material.emissiveMap); - + let usedByMeshes = []; viewer.EnumerateMeshesUserData (function (meshUserData) { if (meshUserData.originalMaterials.indexOf (materialIndex) !== -1) { const mesh = model.GetMesh (meshUserData.originalMeshIndex); - materialInfo.usedByMeshes.push ({ + usedByMeshes.push ({ index : meshUserData.originalMeshIndex, name : mesh.GetName () }); } }); - return materialInfo; + return usedByMeshes; } function GetMaterialReferenceInfo (model, materialIndex) @@ -436,50 +397,27 @@ OV.Website = class }; } - function GetMeshInfo (viewer, model, meshIndex) + function GetMaterialsForMesh (viewer, model, meshIndex) { - let result = { - element : null, - usedMaterials : null, - boundingBox : null - }; - - let mesh = model.GetMesh (meshIndex); - result.element = mesh; - + let usedMaterials = []; let userData = GetMeshUserData (viewer, meshIndex); - result.usedMaterials = []; for (let i = 0; i < userData.originalMaterials.length; i++) { const materialIndex = userData.originalMaterials[i]; - result.usedMaterials.push (GetMaterialReferenceInfo (model, materialIndex)); + usedMaterials.push (GetMaterialReferenceInfo (model, materialIndex)); } - result.usedMaterials.sort (function (a, b) { + usedMaterials.sort (function (a, b) { return a.index - b.index; }); - - let boundingBox = viewer.GetBoundingBox (function (meshUserData) { - return meshUserData.originalMeshIndex === meshIndex; - }); - result.boundingBox = GetBoundingBoxInfo (boundingBox); - return result; + return usedMaterials; } - function GetModelInfo (model, viewer) + function GetMaterialsForModel (model) { - let result = { - element : model, - usedMaterials : null, - boundingBox : null - }; - let boundingBox = viewer.GetBoundingBox (function (meshUserData) { - return true; - }); - result.usedMaterials = []; + let usedMaterials = []; for (let materialIndex = 0; materialIndex < model.MaterialCount (); materialIndex++) { - result.usedMaterials.push (GetMaterialReferenceInfo (model, materialIndex)); + usedMaterials.push (GetMaterialReferenceInfo (model, materialIndex)); } - result.boundingBox = GetBoundingBoxInfo (boundingBox); - return result; + return usedMaterials; } let obj = this; @@ -496,14 +434,14 @@ OV.Website = class fitMeshToWindow : function (meshIndex) { obj.FitMeshToWindow (meshIndex); }, - getMaterialInformation : function (materialIndex) { - return GetMaterialInfo (obj.viewer, obj.model, materialIndex); + getMeshesForMaterial : function (materialIndex) { + return GetMeshesForMaterial (obj.viewer, obj.model, materialIndex); }, - getMeshInformation : function (meshIndex) { - return GetMeshInfo (obj.viewer, obj.model, meshIndex); + getMaterialsForMesh : function (meshIndex) { + return GetMaterialsForMesh (obj.viewer, obj.model, meshIndex); }, - getModelInformation : function () { - return GetModelInfo (obj.model, obj.viewer); + getMaterialsForModel : function () { + return GetMaterialsForModel (obj.model); } }); }