Doni/ModelHandle
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add material color preview.

Browse Source
This commit is contained in:
kovacsv 2021-06-20 15:03:25 +02:00
parent eb55ec80a0
commit 12706c7f6a
5 changed files with 43 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
website/o3dv/modal.js
View File

@ -244,7 +244,9 @@ OV.ListPopup = class extends OV.PopupDialog
{
let listItemDiv = $('<div>').addClass ('ov_popup_list_item').appendTo (this.listDiv);
if (item.color) {
$('<div>').addClass ('ov_popup_list_item_rgbbox').css ('background', '#' + item.color).appendTo (listItemDiv);
let iconDiv = $('<div>').addClass ('ov_popup_list_item_icon').appendTo (listItemDiv);
let colorCircle = OV.CreateInlineColorCircle (item.color);
colorCircle.appendTo (iconDiv);
}
$('<div>').addClass ('ov_popup_list_item_name').html (item.name).appendTo (listItemDiv);
listItemDiv.click (callbacks.onClick);

2
website/o3dv/navigator.js
View File

@ -70,7 +70,7 @@ OV.NavigatorInfoPanel = class
let usedMaterial = usedMaterials[i];
materialItems.push ({
name : OV.GetMaterialName (usedMaterial.name),
color : OV.ColorToHexString (usedMaterial.diffuse)
color : usedMaterial.diffuse
});
}

14
website/o3dv/sidebar.js
View File

@ -45,16 +45,21 @@ OV.Sidebar = class
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 (property.name).attr ('title', property.name);
nameColum.html (property.name + ':').attr ('title', property.name);
let valueText = null;
if (property.type === OV.PropertyType.Text) {
valueText = property.value;
} else if (property.type === OV.PropertyType.Integer) {
valueText = property.value.toLocaleString ();
} else if (property.type === OV.PropertyType.Number) {
valueText = property.value.toFixed (2);
} 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);
let hexString = '#' + OV.ColorToHexString (property.value);
let colorCircle = OV.CreateInlineColorCircle (property.value);
colorCircle.appendTo (valueColumn);
$('<span>').html (hexString).appendTo (valueColumn);
}
if (valueText !== null) {
valueColumn.html (valueText).attr ('title', valueText);
@ -76,6 +81,11 @@ OV.Sidebar = class
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 ()));
let boundingBox = OV.GetBoundingBox (element);
let size = OV.SubCoord3D (boundingBox.max, boundingBox.min);
properties.push (new OV.Property (OV.PropertyType.Number, 'Size X', size.x));
properties.push (new OV.Property (OV.PropertyType.Number, 'Size Y', size.y));
properties.push (new OV.Property (OV.PropertyType.Number, 'Size Z', size.z));
this.AddProperties (properties);
}

12
website/o3dv/utils.js
View File

@ -136,3 +136,15 @@ OV.CreateIconButton = function (iconName, hoverIconName, title, link)
}
return buttonLink;
};
OV.CreateInlineColorCircle = function (color)
{
let hexString = '#' + OV.ColorToHexString (color);
let darkerColor = new OV.Color (
Math.max (0, color.r - 50),
Math.max (0, color.g - 50),
Math.max (0, color.b - 50)
);
let darkerColorHexString = '#' + OV.ColorToHexString (darkerColor);
return $('<div>').addClass ('ov_color_circle').css ('background', hexString).css ('border', '1px solid ' + darkerColorHexString);
};

22
website/o3dv/website.css
View File

@ -118,7 +118,7 @@ div.main
div.main_navigator
{
width: 240px;
width: 260px;
margin: 10px 0px 10px 10px;
overflow: none;
float: left;
@ -131,7 +131,7 @@ div.main_viewer
div.main_sidebar
{
width: 300px;
width: 260px;
margin: 10px 10px 10px 0px;
overflow: none;
float: right;
@ -348,6 +348,18 @@ div.ov_tree_view div.ov_tree_view_children
margin-left: 28px;
}
div.ov_color_circle
{
background: #ffffff;
border: 1px solid #000000;
width: 14px;
height: 14px;
display: inline-block;
margin-right: 5px;
margin-bottom: -2px;
border-radius: 10px;
}
div.ov_modal_overlay
{
@ -612,12 +624,8 @@ div.ov_popup div.ov_popup_list_item
cursor: pointer;
}
div.ov_popup div.ov_popup_list_item_rgbbox
div.ov_popup div.ov_popup_list_item_icon
{
width: 18px;
height: 18px;
margin-right: 5px;
border: 1px solid #222222;
float: left;
}