').html (paramName).addClass ('ov_dialog_table_row_name').appendTo (colorRow);
- let valueColumn = $('
').addClass ('ov_dialog_table_row_value').appendTo (colorRow);
- let colorInput = $('').attr ('type', 'color').addClass ('ov_dialog_color').appendTo (valueColumn);
- $('').addClass ('ov_dialog_table_row_comment').html (paramDesc).appendTo (valueColumn);
- colorInput.val ('#' + OV.ColorToHexString (defaultColor));
- return colorInput;
- }
-
- let dialogSettings = {
- backgroundColor: viewerSettings.backgroundColor,
- defaultColor : importSettings.defaultColor
- };
- let dialog = new OV.ButtonDialog ();
- let contentDiv = dialog.Init ('Settings', [
- {
- name : 'Cancel',
- subClass : 'outline',
- onClick () {
- dialog.Hide ();
- }
- },
- {
- name : 'OK',
- onClick () {
- dialog.Hide ();
- onOk (dialogSettings);
- }
- }
- ]);
-
- let backgroundColorInput = AddColorRow (contentDiv, dialogSettings.backgroundColor, 'Background Color', '(Visualization only)');
- backgroundColorInput.change (function () {
- let colorStr = backgroundColorInput.val ().substr (1);
- dialogSettings.backgroundColor = OV.HexStringToColor (colorStr);
- });
-
- let colorInput = AddColorRow (contentDiv, dialogSettings.defaultColor, 'Default Color', '(When no material defined)');
- colorInput.change (function () {
- let colorStr = colorInput.val ().substr (1);
- dialogSettings.defaultColor = OV.HexStringToColor (colorStr);
- });
-
- dialog.Show ();
- return dialog;
-};
diff --git a/website/o3dv/settingssidebarpanel.js b/website/o3dv/settingssidebarpanel.js
new file mode 100644
index 0000000..91a3bac
--- /dev/null
+++ b/website/o3dv/settingssidebarpanel.js
@@ -0,0 +1,17 @@
+OV.SettingsSidebarPanel = class extends OV.SidebarPanel
+{
+ constructor (parentDiv)
+ {
+ super (parentDiv);
+ }
+
+ GetTitle ()
+ {
+ return 'Settings';
+ }
+
+ InitContent ()
+ {
+ this.contentDiv.html ('Settings Content...');
+ }
+};
diff --git a/website/o3dv/sidebar.js b/website/o3dv/sidebar.js
index 9c28600..1c48f65 100644
--- a/website/o3dv/sidebar.js
+++ b/website/o3dv/sidebar.js
@@ -1,6 +1,7 @@
OV.SidebarPanelId =
{
- Details : 0
+ Details : 0,
+ Settings : 1
};
OV.Sidebar = class
@@ -12,7 +13,8 @@ OV.Sidebar = class
this.titleDiv = null;
this.contentDiv = null;
this.panels = [
- new OV.DetailsSidebarPanel (this.parentDiv)
+ new OV.DetailsSidebarPanel (this.parentDiv),
+ new OV.SettingsSidebarPanel (this.parentDiv)
];
}
@@ -24,7 +26,7 @@ OV.Sidebar = class
Init (callbacks)
{
for (let i = 0; i < this.panels.length; i++) {
- this.panels[i].Init ('Details', callbacks);
+ this.panels[i].Init (callbacks);
}
}
diff --git a/website/o3dv/sidebarpanel.js b/website/o3dv/sidebarpanel.js
index 1a809c7..34afcf0 100644
--- a/website/o3dv/sidebarpanel.js
+++ b/website/o3dv/sidebarpanel.js
@@ -9,16 +9,27 @@ OV.SidebarPanel = class
this.visible = false;
}
- Init (title, callbacks)
+ Init (callbacks)
{
this.titleDiv = $('
').addClass ('ov_sidebar_title').appendTo (this.panelDiv);
this.contentDiv = $('
').addClass ('ov_sidebar_content').addClass ('ov_thin_scrollbar').appendTo (this.panelDiv);
- let titleTextDiv = $('
').addClass ('ov_sidebar_title_text').html (title).appendTo (this.titleDiv);
+ let titleTextDiv = $('
').addClass ('ov_sidebar_title_text').html (this.GetTitle ()).appendTo (this.titleDiv);
let titleImg = $('![]()
').addClass ('ov_sidebar_title_img').attr ('src', 'assets/images/sidebar/close.svg').appendTo (this.titleDiv);
titleImg.click (function () {
callbacks.onClose ();
});
- }
+ this.InitContent ();
+ }
+
+ GetTitle ()
+ {
+ return '';
+ }
+
+ InitContent ()
+ {
+
+ }
Show (show)
{
@@ -33,5 +44,17 @@ OV.SidebarPanel = class
IsVisible ()
{
return this.visible;
- }
+ }
+
+ Resize ()
+ {
+ let titleHeight = this.titleDiv.outerHeight (true);
+ let height = this.parentDiv.height ();
+ this.contentDiv.outerHeight (height - titleHeight, true);
+ }
+
+ Clear ()
+ {
+ this.contentDiv.empty ();
+ }
};
diff --git a/website/o3dv/website.js b/website/o3dv/website.js
index 74c9bf5..c11357a 100644
--- a/website/o3dv/website.js
+++ b/website/o3dv/website.js
@@ -337,29 +337,17 @@ OV.Website = class
AddButton (this.toolbar, 'share', 'Share model', true, function () {
obj.dialog = OV.ShowSharingDialog (importer, obj.viewerSettings, obj.importSettings, obj.viewer.GetCamera ());
});
- if (OV.FeatureSet.SettingsAvailable) {
- AddSeparator (this.toolbar, true);
- AddButton (this.toolbar, 'settings', 'Settings', true, function () {
- obj.dialog = OV.ShowSettingsDialog (obj.viewerSettings, obj.importSettings, function (dialogSettings) {
- obj.viewerSettings.backgroundColor = dialogSettings.backgroundColor;
- obj.viewer.SetBackgroundColor (obj.viewerSettings.backgroundColor);
- obj.cookieHandler.SetColorVal ('ov_background_color', obj.viewerSettings.backgroundColor);
-
- let reload = !OV.ColorIsEqual (obj.importSettings.defaultColor, dialogSettings.defaultColor);
- obj.importSettings.defaultColor = dialogSettings.defaultColor;
- obj.cookieHandler.SetColorVal ('ov_default_color', obj.importSettings.defaultColor);
-
- if (reload) {
- obj.ReloadFiles ();
- }
- });
- });
- }
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) {
obj.LoadModelFromFileList (ev.target.files);