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

Init sidebar panels from the website code.

Browse Source
This commit is contained in:
kovacsv 2021-07-10 18:48:59 +02:00
parent 5929ed0a55
commit f85eebfb3f
5 changed files with 91 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
source/core/core.js
View File

@ -10,3 +10,12 @@ OV.ValueOrDefault = function (val, def)
}
return val;
};
OV.EnumerateKeyValuePairs = function (arr, proc)
{
for (let key in arr) {
if (arr.hasOwnProperty (key)) {
proc (key, arr[key]);
}
}
};

14
website/o3dv/navigator.js
View File

@ -108,10 +108,9 @@ OV.NavigatorInfoPanel = class
OV.Navigator = class
{
constructor (parentDiv, propertiesPanel)
constructor (parentDiv)
{
this.parentDiv = parentDiv;
this.propertiesPanel = propertiesPanel;
this.callbacks = null;
this.titleDiv = $('<div>').addClass ('ov_navigator_tree_title').appendTo (parentDiv);
this.treeDiv = $('<div>').addClass ('ov_navigator_tree_panel').addClass ('ov_thin_scrollbar').appendTo (parentDiv);
@ -316,8 +315,7 @@ OV.Navigator = class
obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex));
}
});
let model = this.callbacks.getModel ();
this.propertiesPanel.AddElementProperties (model);
this.callbacks.onModelSelected ();
} else {
if (this.selection.type === OV.SelectionType.Material) {
let usedByMeshes = this.callbacks.getMeshesForMaterial (this.selection.index);
@ -329,9 +327,7 @@ 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.propertiesPanel.AddMaterialProperties (material);
this.callbacks.onMaterialSelected (this.selection.index);
} else if (this.selection.type === OV.SelectionType.Mesh) {
let usedMaterials = this.callbacks.getMaterialsForMesh (this.selection.index);
this.infoPanel.FillWithModelInfo (usedMaterials, {
@ -339,9 +335,7 @@ OV.Navigator = class
obj.SetSelection (new OV.Selection (OV.SelectionType.Material, materialIndex));
}
});
let model = this.callbacks.getModel ();
let mesh = model.GetMesh (this.selection.index);
this.propertiesPanel.AddElementProperties (mesh);
this.callbacks.onMeshSelected (this.selection.index);
}
}
this.Resize ();

39
website/o3dv/sidebar.js
View File

@ -1,9 +1,3 @@
OV.SidebarPanelId =
{
Details : 0,
Settings : 1
};
OV.Sidebar = class
{
constructor (parentDiv)
@ -12,10 +6,13 @@ OV.Sidebar = class
this.visible = true;
this.titleDiv = null;
this.contentDiv = null;
this.panels = [
new OV.DetailsSidebarPanel (this.parentDiv),
new OV.SettingsSidebarPanel (this.parentDiv)
];
this.panels = [];
}
AddPanel (panel)
{
this.panels.push (panel);
return this.panels.length - 1;
}
GetPanel (id)
@ -25,8 +22,8 @@ OV.Sidebar = class
Init (callbacks)
{
for (let i = 0; i < this.panels.length; i++) {
this.panels[i].Init (callbacks);
for (let id = 0; id < this.panels.length; id++) {
this.panels[id].Init (callbacks);
}
}
@ -35,9 +32,9 @@ OV.Sidebar = class
if (panelId !== null) {
this.visible = true;
this.parentDiv.show ();
for (let i = 0; i < this.panels.length; i++) {
const panel = this.panels[i];
if (i === panelId) {
for (let id = 0; id < this.panels.length; id++) {
let panel = this.panels[id];
if (id === panelId) {
panel.Show (true);
} else {
panel.Show (false);
@ -59,9 +56,9 @@ OV.Sidebar = class
if (!this.visible) {
return null;
}
for (let i = 0; i < this.panels.length; i++) {
if (this.panels[i].IsVisible ()) {
return i;
for (let id = 0; id < this.panels.length; id++) {
if (this.panels[id].IsVisible ()) {
return id;
}
}
return null;
@ -69,8 +66,8 @@ OV.Sidebar = class
Resize ()
{
for (let i = 0; i < this.panels.length; i++) {
this.panels[i].Resize ();
}
for (let id = 0; id < this.panels.length; id++) {
this.panels[id].Resize ();
}
}
};

14
website/o3dv/toolbar.js
View File

@ -20,7 +20,6 @@ OV.ToolbarButton = class
}
this.buttonDiv.attr ('alt', this.imageTitle);
OV.InstallTooltip (this.buttonDiv, this.imageTitle);
this.Update ();
}
AddClass (className)
@ -28,13 +27,14 @@ OV.ToolbarButton = class
this.buttonDiv.addClass (className);
}
Update ()
SetSelected (selected)
{
this.selected = selected;
if (!this.selected) {
this.buttonDiv.removeClass ('selected');
} else {
this.buttonDiv.addClass ('selected');
}
}
}
};
@ -61,17 +61,15 @@ OV.Toolbar = class
for (let i = 0; i < buttons.length; i++) {
let currentButton = buttons[i];
if (i === buttonIndex) {
currentButton.selected = true;
currentButton.SetSelected (true);
} else {
currentButton.selected = false;
currentButton.SetSelected (false);
}
currentButton.Update ();
}
onClick (buttonIndex);
});
if (selectedIndex === buttonIndex) {
button.selected = true;
button.Update ();
button.SetSelected (true);
}
buttons.push (button);
}

91
website/o3dv/website.js
View File

@ -8,7 +8,7 @@ OV.Website = class
this.cookieHandler = new OV.CookieHandler ();
this.toolbar = new OV.Toolbar (this.parameters.toolbarDiv);
this.sidebar = new OV.Sidebar (this.parameters.sidebarDiv);
this.navigator = new OV.Navigator (this.parameters.navigatorDiv, this.sidebar.GetPanel (OV.SidebarPanelId.Details));
this.navigator = new OV.Navigator (this.parameters.navigatorDiv);
this.viewerSettings = new OV.ViewerSettings ();
this.importSettings = new OV.ImportSettings ();
this.modelLoader = new OV.ThreeModelLoader ();
@ -16,6 +16,7 @@ OV.Website = class
color : 0x8ec9f0,
side : THREE.DoubleSide
});
this.detailsPanel = null;
this.model = null;
this.dialog = null;
}
@ -81,21 +82,6 @@ OV.Website = class
}
}
ShowSidebar (panelId)
{
this.sidebar.Show (panelId);
this.cookieHandler.SetBoolVal ('ov_show_sidebar', this.sidebar.IsVisible ());
}
ToggleSidebar (panelId)
{
if (this.sidebar.GetVisiblePanelId () !== panelId) {
this.ShowSidebar (panelId);
} else {
this.ShowSidebar (null);
}
}
ClearModel ()
{
if (this.dialog !== null) {
@ -256,13 +242,6 @@ OV.Website = class
return button;
}
function AddRightButton (toolbar, imageName, imageTitle, onlyFullWidth, onClick)
{
let button = AddButton (toolbar, imageName, imageTitle, onlyFullWidth, onClick);
button.AddClass ('right');
return button;
}
function AddRadioButton (toolbar, imageNames, imageTitles, selectedIndex, onlyFullWidth, onClick)
{
let imageData = [];
@ -337,16 +316,6 @@ OV.Website = class
AddButton (this.toolbar, 'share', 'Share model', true, function () {
obj.dialog = OV.ShowSharingDialog (importer, obj.viewerSettings, obj.importSettings, obj.viewer.GetCamera ());
});
AddRightButton (this.toolbar, 'details', 'Details panel', true, function () {
obj.ToggleSidebar (OV.SidebarPanelId.Details);
obj.Resize ();
});
if (OV.FeatureSet.SettingsAvailable) {
AddRightButton (this.toolbar, 'settings', 'Settings panel', true, function () {
obj.ToggleSidebar (OV.SidebarPanelId.Settings);
obj.Resize ();
});
}
this.parameters.fileInput.on ('change', function (ev) {
if (ev.target.files.length > 0) {
@ -398,15 +367,57 @@ OV.Website = class
InitSidebar ()
{
function AddSidebarButton (toolbar, imageName, imageTitle, onClick)
{
let image = 'assets/images/toolbar/' + imageName + '.svg';
let button = toolbar.AddImageButton (image, imageTitle, onClick);
button.AddClass ('only_full_width');
button.AddClass ('right');
return button;
}
function ShowSidebar (sidebar, cookieHandler, panelId)
{
sidebar.Show (panelId);
cookieHandler.SetBoolVal ('ov_show_sidebar', sidebar.IsVisible ());
}
function ToggleSidebar (sidebar, cookieHandler, panelId)
{
if (sidebar.GetVisiblePanelId () !== panelId) {
ShowSidebar (sidebar, cookieHandler, panelId);
} else {
ShowSidebar (sidebar, cookieHandler, null);
}
}
const detailsPanelId = this.sidebar.AddPanel (new OV.DetailsSidebarPanel (this.parameters.sidebarDiv));
const settingsPanelId = this.sidebar.AddPanel (new OV.SettingsSidebarPanel (this.parameters.sidebarDiv));
this.detailsPanel = this.sidebar.GetPanel (detailsPanelId);
let obj = this;
AddSidebarButton (this.toolbar, 'details', 'Details panel', function () {
ToggleSidebar (obj.sidebar, obj.cookieHandler, detailsPanelId);
obj.Resize ();
});
if (OV.FeatureSet.SettingsAvailable) {
AddSidebarButton (this.toolbar, 'settings', 'Settings panel', function () {
ToggleSidebar (obj.sidebar, obj.cookieHandler, settingsPanelId);
obj.Resize ();
});
}
this.sidebar.Init ({
onClose : function () {
obj.ShowSidebar (null);
ShowSidebar (obj.sidebar, obj.cookieHandler, null);
obj.Resize ();
}
});
let show = this.cookieHandler.GetBoolVal ('ov_show_sidebar', true);
this.ShowSidebar (show ? OV.SidebarPanelId.Details : null);
ShowSidebar (this.sidebar, this.cookieHandler, show ? detailsPanelId : null);
}
InitNavigator ()
@ -493,8 +504,14 @@ OV.Website = class
getMaterialsForModel : function () {
return GetMaterialsForModel (obj.model);
},
getModel : function () {
return obj.model;
onModelSelected : function () {
obj.detailsPanel.AddElementProperties (obj.model);
},
onMeshSelected : function (meshIndex) {
obj.detailsPanel.AddElementProperties (obj.model.GetMesh (meshIndex));
},
onMaterialSelected : function (materialIndex) {
obj.detailsPanel.AddMaterialProperties (obj.model.GetMaterial (materialIndex));
}
});
}