www/manager6/UIOptions.js

   1 Ext.define('PVE.UIOptions', {
   2     singleton: true,
   3
   4     options: {
   5         'allowed-tags': [],
   6     },
   7
   8     update: function() {
   9         Proxmox.Utils.API2Request({
  10             url: '/cluster/options',
  11             method: 'GET',
  12             success: function(response) {
  13                 for (const option of ['allowed-tags', 'console', 'tag-style']) {
  14                     PVE.UIOptions.options[option] = response?.result?.data?.[option];
  15                 }
  16
  17                 PVE.UIOptions.updateTagList(PVE.UIOptions.options['allowed-tags']);
  18                 PVE.UIOptions.updateTagSettings(PVE.UIOptions.options['tag-style']);
  19                 PVE.UIOptions.fireUIConfigChanged();
  20             },
  21         });
  22     },
  23
  24     tagList: [],
  25
  26     updateTagList: function(tags) {
  27         PVE.UIOptions.tagList = [...new Set([...tags])].sort();
  28     },
  29
  30     parseTagOverrides: function(overrides) {
  31         let colors = {};
  32         (overrides || "").split(';').forEach(color => {
  33             if (!color) {
  34                 return;
  35             }
  36             let [tag, color_hex, font_hex] = color.split(':');
  37             let r = parseInt(color_hex.slice(0, 2), 16);
  38             let g = parseInt(color_hex.slice(2, 4), 16);
  39             let b = parseInt(color_hex.slice(4, 6), 16);
  40             colors[tag] = [r, g, b];
  41             if (font_hex) {
  42                 colors[tag].push(parseInt(font_hex.slice(0, 2), 16));
  43                 colors[tag].push(parseInt(font_hex.slice(2, 4), 16));
  44                 colors[tag].push(parseInt(font_hex.slice(4, 6), 16));
  45             }
  46         });
  47         return colors;
  48     },
  49
  50     tagOverrides: {},
  51
  52     updateTagOverrides: function(colors) {
  53         let sp = Ext.state.Manager.getProvider();
  54         let color_state = sp.get('colors', '');
  55         let browser_colors = PVE.UIOptions.parseTagOverrides(color_state);
  56         PVE.UIOptions.tagOverrides = Ext.apply({}, browser_colors, colors);
  57     },
  58
  59     updateTagSettings: function(style) {
  60         let overrides = style?.['color-map'];
  61         PVE.UIOptions.updateTagOverrides(PVE.UIOptions.parseTagOverrides(overrides ?? ""));
  62
  63         let shape = style?.shape ?? 'circle';
  64         if (shape === '__default__') {
  65             style = 'circle';
  66         }
  67
  68         Ext.ComponentQuery.query('pveResourceTree')[0].setUserCls(`proxmox-tags-${shape}`);
  69     },
  70
  71     tagTreeStyles: {
  72         '__default__': `${Proxmox.Utils.defaultText} (${gettext('Circle')})`,
  73         'full': gettext('Full'),
  74         'circle': gettext('Circle'),
  75         'dense': gettext('Dense'),
  76         'none': Proxmox.Utils.NoneText,
  77     },
  78
  79     tagOrderOptions: {
  80         '__default__': `${Proxmox.Utils.defaultText} (${gettext('Alphabetical')})`,
  81         'config': gettext('Configuration'),
  82         'alphabetical': gettext('Alphabetical'),
  83     },
  84
  85     shouldSortTags: function() {
  86         return !(PVE.UIOptions.options['tag-style']?.ordering === 'config');
  87     },
  88
  89     getTreeSortingValue: function(key) {
  90         let localStorage = Ext.state.Manager.getProvider();
  91         let browserValues = localStorage.get('pve-tree-sorting');
  92         let defaults = {
  93             'sort-field': 'vmid',
  94             'group-templates': true,
  95             'group-guest-types': true,
  96         };
  97
  98         return browserValues?.[key] ?? defaults[key];
  99     },
 100
 101     fireUIConfigChanged: function() {
 102         PVE.data.ResourceStore.refresh();
 103         Ext.GlobalEvents.fireEvent('loadedUiOptions');
 104     },
 105 });