Proxmox/proxmox-backup
5
0
Fork 0
mirror of git://git.proxmox.com/git/proxmox-backup.git synced 2025-01-22 22:04:00 +03:00
Code Releases Activity

proxy/ui: implement theme switcher

Browse Source 
adds a theme switcher to the ui and handles the necessary cookies in
the backend.

this requires a bump of the widget toolkit so the necessary widgets
are present.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
This commit is contained in:
Stefan Sterz 2023-03-08 17:41:39 +01:00 committed by Thomas Lamprecht
parent dd06b7f1ee
commit a443dd5c52
3 changed files with 34 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/bin/proxmox-backup-proxy.rs
View File

@ -94,6 +94,21 @@ fn get_language(headers: &http::HeaderMap) -> String {
} }
} }
fn get_theme(headers: &http::HeaderMap) -> String {
let exists = |t: &str| {
Path::new(&format!(
"/usr/share/javascript/proxmox-widget-toolkit/themes/theme-{t}.css"
))
.exists()
};
match cookie_from_header(headers, "PBSThemeCookie") {
Some(theme) if theme == "auto" => theme,
Some(theme) if theme != "__default__" && exists(&theme) => theme,
_ => String::from(""),
}
}
async fn get_index_future(env: RestEnvironment, parts: Parts) -> Response<Body> { async fn get_index_future(env: RestEnvironment, parts: Parts) -> Response<Body> {
let auth_id = env.get_auth_id(); let auth_id = env.get_auth_id();
let api = env.api_config(); let api = env.api_config();
@ -133,11 +148,15 @@ async fn get_index_future(env: RestEnvironment, parts: Parts) -> Response<Body>
} }
} }
let theme = get_theme(&parts.headers);
let data = json!({ let data = json!({
"NodeName": nodename, "NodeName": nodename,
"UserName": user, "UserName": user,
"CSRFPreventionToken": csrf_token, "CSRFPreventionToken": csrf_token,
"language": get_language(&parts.headers), "language": get_language(&parts.headers),
"theme": theme,
"auto": theme == "auto",
"debug": debug, "debug": debug,
}); });

8
www/MainView.js
View File

@ -247,6 +247,14 @@ Ext.define('PBS.MainView', {
text: gettext('My Settings'), text: gettext('My Settings'),
handler: () => Ext.create('PBS.window.Settings').show(), handler: () => Ext.create('PBS.window.Settings').show(),
}, },
{
iconCls: 'fa fa-paint-brush',
text: gettext('Theme'),
handler: () => Ext.create('Proxmox.window.ThemeEditWindow', {
cookieName: 'PBSThemeCookie',
autoShow: true,
}),
},
{ {
iconCls: 'fa fa-language', iconCls: 'fa fa-language',
text: gettext('Language'), text: gettext('Language'),

7
www/index.hbs
View File

@ -12,6 +12,13 @@
<link rel="stylesheet" type="text/css" href="/fontawesome/css/font-awesome.css" /> <link rel="stylesheet" type="text/css" href="/fontawesome/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="/widgettoolkit/css/ext6-pmx.css" /> <link rel="stylesheet" type="text/css" href="/widgettoolkit/css/ext6-pmx.css" />
<link rel="stylesheet" type="text/css" href="/css/ext6-pbs.css" /> <link rel="stylesheet" type="text/css" href="/css/ext6-pbs.css" />
{{~#if theme}}
{{~#if auto}}
<link rel="stylesheet" type="text/css" media="(prefers-color-scheme: dark)" href="/widgettoolkit/themes/theme-proxmox-dark.css" />
{{~else}}
<link rel="stylesheet" type="text/css" href="/widgettoolkit/themes/theme-{{ theme }}.css" />
{{~/if}}
{{~/if}}
{{#if language}} {{#if language}}
<script type='text/javascript' src='/locale/pbs-lang-{{ language }}.js'></script> <script type='text/javascript' src='/locale/pbs-lang-{{ language }}.js'></script>
{{else}} {{else}}