[pve-devel] [PATCH manager v10 04/13] ui: parse and save tag infos from /ui-options

Dominik Csapak d.csapak at proxmox.com
Tue Nov 15 14:02:39 CET 2022


stores the color-map 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

also saves the list of 'allowed-tags' into PVE.Utils

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
changes from v9:
* remove unused global 'override' event
* refactored the UIOptions update function and updateTagSettings a bit
  (now takes the full 'tag-style' object and handles it)
 www/manager6/Utils.js | 56 ++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 55 insertions(+), 1 deletion(-)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 29bf667b4..4ff8a1a55 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -1860,10 +1860,64 @@ Ext.define('PVE.Utils', {
 	    url: '/ui-options',
 	    method: 'GET',
 	    success: function(response) {
-		PVE.UIOptions = response?.result?.data ?? {};
+		PVE.UIOptions = response?.result?.data ?? {
+		    'allowed-tags': [],
+		};
+
+		PVE.Utils.updateTagList(PVE.UIOptions['allowed-tags']);
+		PVE.Utils.updateTagSettings(PVE.UIOptions?.['tag-style']);
 	    },
 	});
     },
+
+    tagList: new Set(),
+
+    updateTagList: function(tags) {
+	PVE.Utils.tagList = [...new Set([...tags])].sort();
+    },
+
+    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);
+    },
+
+    updateTagSettings: function(style) {
+	let overrides = style?.['color-map'];
+	PVE.Utils.updateTagOverrides(PVE.Utils.parseTagOverrides(overrides ?? ""));
+
+	let shape = style?.shape ?? 'circle';
+	if (shape === '__default__') {
+	    style = 'circle';
+	}
+
+	Ext.ComponentQuery.query('pveResourceTree')[0].setUserCls(`proxmox-tags-${shape}`);
+	PVE.data.ResourceStore.fireEvent('load');
+	Ext.GlobalEvents.fireEvent('loadedUiOptions');
+    },
 },
 
     singleton: true,
-- 
2.30.2






More information about the pve-devel mailing list