From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 17C059568; Wed, 8 Mar 2023 17:38:19 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id C8C3F9491; Wed, 8 Mar 2023 17:37:48 +0100 (CET) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [94.136.29.106]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS; Wed, 8 Mar 2023 17:37:48 +0100 (CET) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 866D445DF2; Wed, 8 Mar 2023 17:37:47 +0100 (CET) From: Stefan Sterz To: pve-devel@lists.proxmox.com, pbs-devel@lists.proxmox.com, pmg-devel@lists.proxmox.com Date: Wed, 8 Mar 2023 17:37:43 +0100 Message-Id: <20230308163744.2456083-1-s.sterz@proxmox.com> X-Mailer: git-send-email 2.30.2 In-Reply-To: <20230308161840.2396113-1-s.sterz@proxmox.com> References: <20230308161840.2396113-1-s.sterz@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL -0.096 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pve-devel] [PATCH widget-toolkit v1 5/6] util/window/form: add a theme selector X-BeenThere: pve-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox VE development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Wed, 08 Mar 2023 16:38:19 -0000 From: Daniel Tschlatscher add a widget that implements a theme selector and sets a cookie to load the appropriate theme. Co-authored-by: Daniel Tschlatscher Co-authored-by: Stefan Sterz Signed-off-by: Daniel Tschlatscher Signed-off-by: Stefan Sterz --- src/Makefile | 2 ++ src/Utils.js | 25 ++++++++++++++++++++ src/form/ThemeSelector.js | 6 +++++ src/window/ThemeEdit.js | 49 +++++++++++++++++++++++++++++++++++++++ 4 files changed, 82 insertions(+) create mode 100644 src/form/ThemeSelector.js create mode 100644 src/window/ThemeEdit.js diff --git a/src/Makefile b/src/Makefile index 54727f6..11790a0 100644 --- a/src/Makefile +++ b/src/Makefile @@ -44,6 +44,7 @@ JSSRC= \ form/TaskTypeSelector.js \ form/ACME.js \ form/UserSelector.js \ + form/ThemeSelector.js \ button/Button.js \ button/AltText.js \ button/HelpButton.js \ @@ -90,6 +91,7 @@ JSSRC= \ window/AddYubico.js \ window/TfaEdit.js \ window/NotesEdit.js \ + window/ThemeEdit.js \ node/APT.js \ node/APTRepositories.js \ node/NetworkEdit.js \ diff --git a/src/Utils.js b/src/Utils.js index 8a97487..2ab1d0a 100644 --- a/src/Utils.js +++ b/src/Utils.js @@ -109,6 +109,31 @@ utilities: { return data; }, + theme_map: { + auto: 'auto', + "proxmox-dark": 'Proxmox Dark', + }, + + render_theme: function(value) { + if (!value || value === '__default__') { + return Proxmox.Utils.defaultText + ' (Light theme)'; + } + let text = Proxmox.Utils.theme_map[value]; + if (text) { + return text; + } + return value; + }, + + theme_array: function() { + let data = [['__default__', Proxmox.Utils.render_theme('')]]; + Ext.Object.each(Proxmox.Utils.theme_map, function(key, value) { + data.push([key, Proxmox.Utils.render_theme(value)]); + }); + + return data; + }, + bond_mode_gettext_map: { '802.3ad': 'LACP (802.3ad)', 'lacp-balance-slb': 'LACP (balance-slb)', diff --git a/src/form/ThemeSelector.js b/src/form/ThemeSelector.js new file mode 100644 index 0000000..fa5ddb7 --- /dev/null +++ b/src/form/ThemeSelector.js @@ -0,0 +1,6 @@ +Ext.define('Proxmox.form.ThemeSelector', { + extend: 'Proxmox.form.KVComboBox', + xtype: 'proxmoxThemeSelector', + + comboItems: Proxmox.Utils.theme_array(), +}); diff --git a/src/window/ThemeEdit.js b/src/window/ThemeEdit.js new file mode 100644 index 0000000..aec7082 --- /dev/null +++ b/src/window/ThemeEdit.js @@ -0,0 +1,49 @@ +Ext.define('Proxmox.window.ThemeEditWindow', { + extend: 'Ext.window.Window', + alias: 'widget.pmxThemeEditWindow', + + viewModel: { + parent: null, + data: { + language: '__default__', + }, + }, + controller: { + xclass: 'Ext.app.ViewController', + init: function(view) { + let theme = Ext.util.Cookies.get(view.cookieName) || '__default__'; + this.getViewModel().set('theme', theme); + }, + applyTheme: function(button) { + let view = this.getView(); + let vm = this.getViewModel(); + + let expire = Ext.Date.add(new Date(), Ext.Date.YEAR, 10); + Ext.util.Cookies.set(view.cookieName, vm.get('theme'), expire); + view.mask(gettext('Please wait...'), 'x-mask-loading'); + window.location.reload(); + }, + }, + + cookieName: 'PVEThemeCookie', + + title: gettext('Theme'), + modal: true, + bodyPadding: 10, + resizable: false, + items: [ + { + xtype: 'proxmoxThemeSelector', + fieldLabel: gettext('Theme'), + bind: { + value: '{theme}', + }, + }, + ], + buttons: [ + { + text: gettext('Apply'), + handler: 'applyTheme', + }, + ], +}); -- 2.30.2