www/manager/form/ViewSelector.js

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