[pve-devel] [PATCH manager v8 04/12] ui: parse and save tag color overrides from /ui-options

[Dominik Csapak <d.csapak@proxmox.com>]

into a global list of overrides. on update, also parse the values
from the browser localstore. Also emits a GlobalEvent 'loadedUiOptions'
so that e.g. the tags can listen to that and refresh their colors

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/manager6/Utils.js     | 40 +++++++++++++++++++++++++++++++++++++++
 www/manager6/Workspace.js |  9 +++++++++
 2 files changed, 49 insertions(+)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 3c8c1417..e32c679a 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -1803,6 +1803,46 @@ Ext.define('PVE.Utils', {
     },
 
     notesTemplateVars: ['cluster', 'guestname', 'node', 'vmid'],
+
+    parseTagOverrides: function(overrides) {
+	let colors = {};
+	(overrides || "").split(';').forEach(color => {
+	    if (!color) {
+		return;
+	    }
+	    let [tag, color_hex, font_hex] = color.split(':');
+	    let r = parseInt(color_hex.slice(0, 2), 16);
+	    let g = parseInt(color_hex.slice(2, 4), 16);
+	    let b = parseInt(color_hex.slice(4, 6), 16);
+	    colors[tag] = [r, g, b];
+	    if (font_hex) {
+		colors[tag].push(parseInt(font_hex.slice(0, 2), 16));
+		colors[tag].push(parseInt(font_hex.slice(2, 4), 16));
+		colors[tag].push(parseInt(font_hex.slice(4, 6), 16));
+	    }
+	});
+	return colors;
+    },
+
+    tagOverrides: {},
+
+    updateTagOverrides: function(colors) {
+	let sp = Ext.state.Manager.getProvider();
+	let color_state = sp.get('colors', '');
+	let browser_colors = PVE.Utils.parseTagOverrides(color_state);
+	PVE.Utils.tagOverrides = Ext.apply({}, browser_colors, colors);
+	Ext.GlobalEvents.fireEvent('tag-color-override');
+    },
+
+    updateTagSettings: function(overrides, style) {
+	PVE.Utils.updateTagOverrides(PVE.Utils.parseTagOverrides(overrides ?? ""));
+
+	if (style === undefined || style === '__default__') {
+	    style = 'circle';
+	}
+
+	Ext.ComponentQuery.query('pveResourceTree')[0].setUserCls(`proxmox-tags-${style}`);
+    },
 },
 
     singleton: true,
diff --git a/www/manager6/Workspace.js b/www/manager6/Workspace.js
index 7e17964e..616f127f 100644
--- a/www/manager6/Workspace.js
+++ b/www/manager6/Workspace.js
@@ -224,6 +224,15 @@ Ext.define('PVE.StdWorkspace', {
     updateUIOptions: function(data) {
 	let me = this;
 	PVE.UIOptions = data ?? {};
+	let colors = data?.['tag-style']?.colors;
+	let shape = data?.['tag-style']?.['tree-shape'];
+
+	PVE.Utils.updateTagSettings(colors, shape);
+	if (colors) {
+	    // refresh tree once
+	    PVE.data.ResourceStore.fireEvent('load');
+	    Ext.GlobalEvents.fireEvent('loadedUiOptions');
+	}
     },
 
     initComponent: function() {
-- 
2.30.2