Add basic information to the sidebar.
This commit is contained in:
parent
d6db051ac6
commit
ea77b98642
@ -27,6 +27,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
@ -28,6 +28,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
@ -27,6 +27,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
@ -27,6 +27,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
18
source/model/property.js
Normal file
18
source/model/property.js
Normal file
@ -0,0 +1,18 @@
|
||||
OV.PropertyType =
|
||||
{
|
||||
Text : 1,
|
||||
Integer : 2,
|
||||
Number : 3,
|
||||
Percent : 4,
|
||||
Color : 5
|
||||
};
|
||||
|
||||
OV.Property = class
|
||||
{
|
||||
constructor (type, name, value)
|
||||
{
|
||||
this.type = type;
|
||||
this.name = name;
|
||||
this.value = value;
|
||||
}
|
||||
};
|
||||
@ -22,6 +22,7 @@
|
||||
"source/io/fileutils.js",
|
||||
"source/model/material.js",
|
||||
"source/model/triangle.js",
|
||||
"source/model/property.js",
|
||||
"source/model/element.js",
|
||||
"source/model/mesh.js",
|
||||
"source/model/meshbuffer.js",
|
||||
|
||||
@ -35,6 +35,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
@ -35,6 +35,7 @@
|
||||
<script type="text/javascript" src="../source/io/fileutils.js"></script>
|
||||
<script type="text/javascript" src="../source/model/material.js"></script>
|
||||
<script type="text/javascript" src="../source/model/triangle.js"></script>
|
||||
<script type="text/javascript" src="../source/model/property.js"></script>
|
||||
<script type="text/javascript" src="../source/model/element.js"></script>
|
||||
<script type="text/javascript" src="../source/model/mesh.js"></script>
|
||||
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
|
||||
|
||||
@ -311,16 +311,16 @@ OV.Navigator = class
|
||||
let obj = this;
|
||||
if (this.selection === null) {
|
||||
let usedMaterials = this.callbacks.getMaterialsForModel ();
|
||||
this.sidebar.AddProperties (null);
|
||||
this.infoPanel.FillWithModelInfo (usedMaterials, {
|
||||
onMaterialSelect : function (materialIndex) {
|
||||
obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex));
|
||||
}
|
||||
});
|
||||
let model = this.callbacks.getModel ();
|
||||
this.sidebar.AddElementProperties (model);
|
||||
} else {
|
||||
if (this.selection.type === OV.SelectionType.Material) {
|
||||
let usedByMeshes = this.callbacks.getMeshesForMaterial (this.selection.index);
|
||||
this.sidebar.AddProperties (null);
|
||||
this.infoPanel.FillWithMaterialInfo (usedByMeshes, {
|
||||
onMeshHover : function (meshIndex) {
|
||||
obj.SetTempSelectedMeshIndex (meshIndex);
|
||||
@ -329,14 +329,19 @@ OV.Navigator = class
|
||||
obj.SetSelection (new OV.Selection (OV.SelectionType.Mesh, meshIndex));
|
||||
}
|
||||
});
|
||||
let model = this.callbacks.getModel ();
|
||||
let material = model.GetMaterial (this.selection.index);
|
||||
this.sidebar.AddMaterialProperties (material);
|
||||
} else if (this.selection.type === OV.SelectionType.Mesh) {
|
||||
let usedMaterials = this.callbacks.getMaterialsForMesh (this.selection.index);
|
||||
this.sidebar.AddProperties (null);
|
||||
this.infoPanel.FillWithModelInfo (usedMaterials, {
|
||||
onMaterialSelect : function (materialIndex) {
|
||||
obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex));
|
||||
}
|
||||
});
|
||||
let model = this.callbacks.getModel ();
|
||||
let mesh = model.GetMesh (this.selection.index);
|
||||
this.sidebar.AddElementProperties (mesh);
|
||||
}
|
||||
}
|
||||
this.Resize ();
|
||||
|
||||
@ -1,8 +1,3 @@
|
||||
OV.PropertyType =
|
||||
{
|
||||
Text : 1
|
||||
};
|
||||
|
||||
OV.Sidebar = class
|
||||
{
|
||||
constructor (parentDiv)
|
||||
@ -45,37 +40,51 @@ OV.Sidebar = class
|
||||
|
||||
AddProperties (properties)
|
||||
{
|
||||
function AddProperty (table, name, value)
|
||||
function AddProperty (table, property)
|
||||
{
|
||||
let row = $('<tr>').appendTo (table);
|
||||
let nameColum = $('<td>').addClass ('ov_property_table_name').appendTo (row);
|
||||
let valueColumn = $('<td>').addClass ('ov_property_table_value').appendTo (row);
|
||||
nameColum.html (name).attr ('title', name);
|
||||
valueColumn.html (value).attr ('title', value);
|
||||
nameColum.html (property.name).attr ('title', property.name);
|
||||
let valueText = null;
|
||||
if (property.type === OV.PropertyType.Integer) {
|
||||
valueText = property.value.toLocaleString ();
|
||||
} else if (property.type === OV.PropertyType.Percent) {
|
||||
valueText = parseInt (property.value * 100, 10).toString () + '%';
|
||||
} else if (property.type === OV.PropertyType.Color) {
|
||||
valueText = '#' + OV.ColorToHexString (property.value);
|
||||
}
|
||||
if (valueText !== null) {
|
||||
valueColumn.html (valueText).attr ('title', valueText);
|
||||
}
|
||||
}
|
||||
|
||||
this.Clear ();
|
||||
let table = $('<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');
|
||||
for (let i = 0; i < properties.length; i++) {
|
||||
let property = properties[i];
|
||||
AddProperty (table, property);
|
||||
}
|
||||
|
||||
this.Resize ();
|
||||
}
|
||||
|
||||
AddElementProperties (element)
|
||||
{
|
||||
let properties = [];
|
||||
properties.push (new OV.Property (OV.PropertyType.Integer, 'Vertex Count', element.VertexCount ()));
|
||||
properties.push (new OV.Property (OV.PropertyType.Integer, 'Triangle Count', element.TriangleCount ()));
|
||||
this.AddProperties (properties);
|
||||
}
|
||||
|
||||
AddMaterialProperties (material)
|
||||
{
|
||||
let properties = [];
|
||||
properties.push (new OV.Property (OV.PropertyType.Color, 'Color', material.diffuse));
|
||||
properties.push (new OV.Property (OV.PropertyType.Percent, 'Opacity', material.opacity));
|
||||
this.AddProperties (properties);
|
||||
}
|
||||
|
||||
Resize ()
|
||||
{
|
||||
let titleHeight = this.titleDiv.outerHeight (true);
|
||||
|
||||
@ -651,6 +651,7 @@ div.ov_progress div.ov_progress_text
|
||||
|
||||
table.ov_property_table
|
||||
{
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
|
||||
@ -477,6 +477,9 @@ OV.Website = class
|
||||
},
|
||||
getMaterialsForModel : function () {
|
||||
return GetMaterialsForModel (obj.model);
|
||||
},
|
||||
getModel : function () {
|
||||
return obj.model;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user