www/manager6/form/ViewSelector.js

   1 /*
   2  * Top left combobox, used to select a view of the underneath RessourceTree
   3  */
   4 Ext.define('PVE.form.ViewSelector', {
   5     extend: 'Ext.form.field.ComboBox',
   6     alias: ['widget.pveViewSelector'],
   7
   8     initComponent: function() {
   9         var me = this;
  10
  11         var default_views = {
  12             server: {
  13                 text: gettext('Server View'),
  14                 groups: ['node']
  15             },
  16             folder: {
  17                 text: gettext('Folder View'),
  18                 groups: ['type']
  19             },
  20             storage: {
  21                 text: gettext('Storage View'),
  22                 groups: ['node'],
  23                 filterfn: function(node) {
  24                     return node.data.type === 'storage' || node.data.type === 'node';
  25                 }
  26             },
  27             pool: {
  28                 text: gettext('Pool View'),
  29                 groups: ['pool'],
  30                 // Pool View only lists VMs and Containers
  31                 filterfn: function(node) {
  32                     return node.data.type === 'qemu' || node.data.type === 'lxc' || node.data.type === 'openvz' ||
  33                         node.data.type === 'pool';
  34                 }
  35             }
  36         };
  37
  38         var groupdef = [];
  39         Ext.Object.each(default_views, function(viewname, value) {
  40             groupdef.push([viewname, value.text]);
  41         });
  42
  43         var store = Ext.create('Ext.data.Store', {
  44             model: 'KeyValue',
  45             proxy: {
  46                 type: 'memory',
  47                 reader: 'array'
  48             },
  49             data: groupdef,
  50             autoload: true,
  51         });
  52
  53         Ext.apply(me, {
  54             hideLabel: true,
  55             store: store,
  56             value: groupdef[0][0],
  57             editable: false,
  58             allowBlank: false,
  59             forceSelection: true,
  60             autoSelect: false,
  61             valueField: 'key',
  62             displayField: 'value',
  63
  64             getViewFilter: function() {
  65                 var view = me.getValue();
  66                 return Ext.apply({ id: view }, default_views[view] || default_views.server);
  67             },
  68
  69             getState: function() {
  70                 return { value: me.getValue() };
  71             },
  72
  73             applyState : function(state, doSelect) {
  74                 var view = me.getValue();
  75                 if (state && state.value && (view != state.value)) {
  76                     var record = store.findRecord('key', state.value);
  77                     if (record) {
  78                         me.setValue(state.value, true);
  79                         if (doSelect) {
  80                             me.fireEvent('select', me, [record]);
  81                         }
  82                     }
  83                 }
  84             },
  85             stateEvents: [ 'select' ],
  86             stateful: true,
  87             id: 'view'
  88         });
  89
  90         me.callParent();
  91
  92         var statechange = function(sp, key, value) {
  93             if (key === me.id) {
  94                 me.applyState(value, true);
  95             }
  96         };
  97
  98         var sp = Ext.state.Manager.getProvider();
  99
 100         me.mon(sp, 'statechange', statechange, me);
 101     }
 102 });