Add theme to website settings.

This commit is contained in:
kovacsv 2021-08-30 15:37:53 +02:00
parent 671f77d827
commit 36e666b221
4 changed files with 57 additions and 48 deletions

View File

@ -1,26 +1,26 @@
:root
{
--ov_foreground_color: #000000;
--ov_background_color: #ffffff;
--ov_button_color: #3393bd;
--ov_button_hover_color: #146a8f;
--ov_button_text_color: #ffffff;
--ov_outline_button_color: #3393bd;
--ov_outline_button_hover_color: #c9e5f8;
--ov_outline_button_text_color: #3393bd;
--ov_icon_color: #263238;
--ov_hover_color: #c9e5f8;
--ov_light_icon_color: #838383;
--ov_logo_text_color: #15334a;
--ov_logo_border_color: #000000;
--ov_toolbar_background_color: #f5f5f5;
--ov_toolbar_selected_color: #e1e1e1;
--ov_toolbar_separator_color: #cccccc;
--ov_treeview_selected_color: #eeeeee;
--ov_dialog_foreground_color: #000000;
--ov_dialog_background_color: #ffffff;
--ov_border_color: #dddddd;
--ov_shadow: 0px 0px 10px #cccccc;
--ov_foreground_color: none;
--ov_background_color: none;
--ov_button_color: none;
--ov_button_hover_color: none;
--ov_button_text_color: none;
--ov_outline_button_color: none;
--ov_outline_button_hover_color: none;
--ov_outline_button_text_color: none;
--ov_icon_color: none;
--ov_hover_color: none;
--ov_light_icon_color: none;
--ov_logo_text_color: none;
--ov_logo_border_color: none;
--ov_toolbar_background_color: none;
--ov_toolbar_selected_color: none;
--ov_toolbar_separator_color: none;
--ov_treeview_selected_color: none;
--ov_dialog_foreground_color: none;
--ov_dialog_background_color: none;
--ov_border_color: none;
--ov_shadow: none;
}
@font-face

View File

@ -17,7 +17,7 @@ OV.CookieHandler = class
document.cookie = key + '=' + value + '; expires=' + date.toUTCString () + ';';
}
GetStringVal (key)
GetStringVal (key, defVal)
{
let cookie = decodeURIComponent (document.cookie);
let cookieParts = cookie.split (';');
@ -27,12 +27,12 @@ OV.CookieHandler = class
return currentCookie.substr (key.length + 1);
}
}
return null;
return defVal;
}
GetBoolVal (key, defVal)
{
let stringVal = this.GetStringVal (key);
let stringVal = this.GetStringVal (key, null);
if (stringVal === null) {
return defVal;
}
@ -46,7 +46,7 @@ OV.CookieHandler = class
GetColorVal (key, defVal)
{
let stringVal = this.GetStringVal (key);
let stringVal = this.GetStringVal (key, null);
if (stringVal === null) {
return defVal;
}

View File

@ -158,7 +158,6 @@ OV.ProgressDialog = class extends OV.Dialog
contentDiv.addClass ('ov_progress');
$('<svg><use href="assets/images/3dviewer_net_logo.svg#logo"></use></svg>').addClass ('ov_progress_img').appendTo (contentDiv);
console.log (contentDiv.html ());
this.textDiv = $('<div>').addClass ('ov_progress_text').appendTo (contentDiv);
this.SetText (text);
}

View File

@ -4,18 +4,21 @@ OV.WebsiteSettings = class
{
this.backgroundColor = new OV.Color (255, 255, 255);
this.defaultColor = new OV.Color (200, 200, 200);
this.themeName = 'light';
}
LoadFromCookies (cookieHandler)
{
this.backgroundColor = cookieHandler.GetColorVal ('ov_background_color', new OV.Color (255, 255, 255));
this.defaultColor = cookieHandler.GetColorVal ('ov_default_color', new OV.Color (200, 200, 200));
this.themeName = cookieHandler.GetStringVal ('ov_theme_name', 'light');
}
SaveToCookies (cookieHandler)
{
cookieHandler.SetColorVal ('ov_background_color', this.backgroundColor);
cookieHandler.SetColorVal ('ov_default_color', this.defaultColor);
cookieHandler.SetStringVal ('ov_theme_name', this.themeName);
}
};
@ -46,8 +49,8 @@ OV.Website = class
Load ()
{
this.themeHandler.SwitchTheme ('dark');
this.settings.LoadFromCookies (this.cookieHandler);
this.SwitchTheme (this.settings.themeName);
this.InitViewer ();
this.InitToolbar ();
@ -209,6 +212,27 @@ OV.Website = class
});
}
OnHashChange ()
{
if (this.hashHandler.HasHash ()) {
let urls = this.hashHandler.GetModelFilesFromHash ();
if (urls === null) {
return;
}
let importSettings = new OV.ImportSettings ();
importSettings.defaultColor = this.settings.defaultColor;
let defaultColor = this.hashHandler.GetDefaultColorFromHash ();
if (defaultColor !== null) {
importSettings.defaultColor = defaultColor;
}
this.eventHandler.HandleEvent ('model_load_started', { source : 'hash' });
this.LoadModelFromUrlList (urls, importSettings);
} else {
this.ClearModel ();
this.parameters.introDiv.show ();
}
}
OpenFileBrowserDialog ()
{
this.parameters.fileInput.trigger ('click');
@ -276,25 +300,11 @@ OV.Website = class
}
}
OnHashChange ()
SwitchTheme (newThemeName)
{
if (this.hashHandler.HasHash ()) {
let urls = this.hashHandler.GetModelFilesFromHash ();
if (urls === null) {
return;
}
let importSettings = new OV.ImportSettings ();
importSettings.defaultColor = this.settings.defaultColor;
let defaultColor = this.hashHandler.GetDefaultColorFromHash ();
if (defaultColor !== null) {
importSettings.defaultColor = defaultColor;
}
this.eventHandler.HandleEvent ('model_load_started', { source : 'hash' });
this.LoadModelFromUrlList (urls, importSettings);
} else {
this.ClearModel ();
this.parameters.introDiv.show ();
}
this.settings.themeName = newThemeName;
this.themeHandler.SwitchTheme (newThemeName);
this.settings.SaveToCookies (this.cookieHandler);
}
InitViewer ()
@ -405,14 +415,14 @@ OV.Website = class
});
// TODO: remove
let theme = 'dark';
AddButton (this.toolbar, this.eventHandler, 'share', 'Dark Mode', true, () => {
if (theme === 'dark') {
let theme = 'light';
if (this.settings.themeName === 'dark') {
theme = 'light';
} else {
theme = 'dark';
}
this.themeHandler.SwitchTheme (theme);
this.SwitchTheme (theme);
});
this.parameters.fileInput.on ('change', (ev) => {