ui: use some icons from widget-toolkit

[pve-manager.git] / www / manager6 / panel / ConfigPanel.js

diff --git a/www/manager6/panel/ConfigPanel.js b/www/manager6/panel/ConfigPanel.js
index 4356c24e880e070ddd2624b43c5fe58e24e0f36d..23a6ee581a8be435d31e1e9c15589223ca5684bb 100644 (file)
--- a/www/manager6/panel/ConfigPanel.js
+++ b/www/manager6/panel/ConfigPanel.js
@@ -56,7 +56,7 @@ Ext.define('PVE.panel.Config', {
        style: {
            backgroundColor: '#f5f5f5',
            padding: 0,
-           margin: 0
+           margin: 0,
        },
        items: {
            xtype: 'treelist',
@@ -94,16 +94,16 @@ Ext.define('PVE.panel.Config', {
                    } else {
                        info.toggle = true;
                    }
-               }
-           }
-       }
+               },
+           },
+       },
     },
     {
        xtype: 'toolbar',
        itemId: 'toolbar',
        dock: 'top',
        height: 36,
-       overflowHandler: 'scroller'
+       overflowHandler: 'scroller',
     }],
 
     firstItem: '',
@@ -176,12 +176,12 @@ Ext.define('PVE.panel.Config', {
        me.tbar = undefined;
 
        if (!me.onlineHelp) {
-           switch(me.pveSelNode.data.id) {
-               case 'type/storage':me.onlineHelp = 'chapter-pvesm.html'; break;
-               case 'type/qemu':me.onlineHelp = 'chapter-qm.html'; break;
-               case 'type/lxc':me.onlineHelp = 'chapter-pct.html'; break;
-               case 'type/pool':me.onlineHelp = 'chapter-pveum.html#_pools'; break;
-               case 'type/node':me.onlineHelp = 'chapter-sysadmin.html'; break;
+           switch (me.pveSelNode.data.id) {
+               case 'type/storage': me.onlineHelp = 'chapter-pvesm.html'; break;
+               case 'type/qemu': me.onlineHelp = 'chapter-qm.html'; break;
+               case 'type/lxc': me.onlineHelp = 'chapter-pct.html'; break;
+               case 'type/pool': me.onlineHelp = 'chapter-pveum.html#_pools'; break;
+               case 'type/node': me.onlineHelp = 'chapter-sysadmin.html'; break;
            }
        }
 
@@ -191,13 +191,13 @@ Ext.define('PVE.panel.Config', {
        tbar.unshift({
            xtype: 'tbtext',
            text: title,
-           baseCls: 'x-panel-header-text'
+           baseCls: 'x-panel-header-text',
        });
 
        me.helpButton = Ext.create('Proxmox.button.Help', {
            hidden: false,
            listenToGlobalEvent: false,
-           onlineHelp: me.onlineHelp || undefined
+           onlineHelp: me.onlineHelp || undefined,
        });
 
        tbar.push(me.helpButton);
@@ -212,7 +212,7 @@ Ext.define('PVE.panel.Config', {
                title: gettext('Search'),
                iconCls: 'fa fa-search',
                xtype: 'pveResourceGrid',
-               pveSelNode: me.pveSelNode
+               pveSelNode: me.pveSelNode,
            });
        }
 
@@ -223,17 +223,65 @@ Ext.define('PVE.panel.Config', {
 
        me.store = Ext.create('Ext.data.TreeStore', {
            root: {
-               expanded: true
-           }
+               expanded: true,
+           },
        });
        var root = me.store.getRoot();
-       me.items.forEach(function(item){
-           var treeitem = Ext.create('Ext.data.TreeModel',{
+       me.insertNodes(me.items);
+
+       delete me.items;
+       me.defaults = me.defaults || {};
+       Ext.apply(me.defaults, {
+           pveSelNode: me.pveSelNode,
+           viewFilter: me.viewFilter,
+           workspace: me.workspace,
+           border: 0,
+       });
+
+       me.callParent();
+
+       var menu = me.down('#menu');
+       var selection = root.findChild('id', activeTab, true) || root.firstChild;
+       var node = selection;
+       while (node !== root) {
+           node.expand();
+           node = node.parentNode;
+       }
+       menu.setStore(me.store);
+       menu.setSelection(selection);
+
+       // on a state change,
+       // select the new item
+       var statechange = function(sp, key, state) {
+           // it the state change is for this panel
+           if (stateid && key === stateid && state) {
+               // get active item
+               var acard = me.getLayout().getActiveItem().itemId;
+               // get the itemid of the new value
+               var ncard = state.value || me.firstItem;
+               if (ncard && acard != ncard) {
+                   // select the chosen item
+                   menu.setSelection(root.findChild('id', ncard, true) || root.firstChild);
+               }
+           }
+       };
+
+       if (stateid) {
+           me.mon(me.sp, 'statechange', statechange);
+       }
+    },
+
+    insertNodes: function(items) {
+       var me = this;
+       var root = me.store.getRoot();
+
+       items.forEach(function(item) {
+           var treeitem = Ext.create('Ext.data.TreeModel', {
                id: item.itemId,
                text: item.title,
                iconCls: item.iconCls,
                leaf: true,
-               expanded: item.expandedOnInit
+               expanded: item.expandedOnInit,
            });
            item.header = false;
            if (me.savedItems[item.itemId] !== undefined) {
@@ -269,46 +317,5 @@ Ext.define('PVE.panel.Config', {
                throw "id already exists";
            }
        });
-
-       delete me.items;
-       me.defaults = me.defaults || {};
-       Ext.apply(me.defaults, {
-           pveSelNode: me.pveSelNode,
-           viewFilter: me.viewFilter,
-           workspace: me.workspace,
-           border: 0
-       });
-
-       me.callParent();
-
-       var menu = me.down('#menu');
-       var selection = root.findChild('id', activeTab, true) || root.firstChild;
-       var node = selection;
-       while (node !== root) {
-           node.expand();
-           node = node.parentNode;
-       }
-       menu.setStore(me.store);
-       menu.setSelection(selection);
-
-       // on a state change,
-       // select the new item
-       var statechange = function(sp, key, state) {
-           // it the state change is for this panel
-           if (stateid && (key === stateid) && state) {
-               // get active item
-               var acard = me.getLayout().getActiveItem().itemId;
-               // get the itemid of the new value
-               var ncard = state.value || me.firstItem;
-               if (ncard && (acard != ncard)) {
-                   // select the chosen item
-                   menu.setSelection(root.findChild('id', ncard, true) || root.firstChild);
-               }
-           }
-       };
-
-       if (stateid) {
-           me.mon(me.sp, 'statechange', statechange);
-       }
-    }
+    },
 });