grid/ObjectGrid.js

   1 /* Renders a list of key values objets
   2
   3 mandatory config parameters:
   4 rows: an object container where each propery is a key-value object we want to render
   5        var rows = {
   6            keyboard: {
   7                header: gettext('Keyboard Layout'),
   8                editor: 'Your.KeyboardEdit',
   9                required: true
  10            },
  11
  12 optional:
  13 disabled: setting this parameter to true will disable selection and focus on the
  14 proxmoxObjectGrid as well as greying out input elements.
  15 Useful for a readonly tabular display
  16
  17 */
  18
  19 Ext.define('Proxmox.grid.ObjectGrid', {
  20     extend: 'Ext.grid.GridPanel',
  21     alias: ['widget.proxmoxObjectGrid'],
  22     disabled: false,
  23     hideHeaders: true,
  24
  25     getObjectValue: function(key, defaultValue) {
  26         var me = this;
  27         var rec = me.store.getById(key);
  28         if (rec) {
  29             return rec.data.value;
  30         }
  31         return defaultValue;
  32     },
  33
  34     renderKey: function(key, metaData, record, rowIndex, colIndex, store) {
  35         var me = this;
  36         var rows = me.rows;
  37         var rowdef = (rows && rows[key]) ?  rows[key] : {};
  38         return rowdef.header || key;
  39     },
  40
  41     renderValue: function(value, metaData, record, rowIndex, colIndex, store) {
  42         var me = this;
  43         var rows = me.rows;
  44         var key = record.data.key;
  45         var rowdef = (rows && rows[key]) ?  rows[key] : {};
  46
  47         var renderer = rowdef.renderer;
  48         if (renderer) {
  49             return renderer(value, metaData, record, rowIndex, colIndex, store);
  50         }
  51
  52         return value;
  53     },
  54
  55     initComponent : function() {
  56         var me = this;
  57
  58         var rows = me.rows;
  59
  60         if (!me.rstore) {
  61             if (!me.url) {
  62                 throw "no url specified";
  63             }
  64
  65             me.rstore = Ext.create('Proxmox.data.ObjectStore', {
  66                 url: me.url,
  67                 interval: me.interval,
  68                 extraParams: me.extraParams,
  69                 rows: me.rows
  70             });
  71         }
  72
  73         var rstore = me.rstore;
  74
  75         var store = Ext.create('Proxmox.data.DiffStore', { rstore: rstore,
  76             sorters: [],
  77             filters: []
  78         });
  79
  80         if (rows) {
  81             Ext.Object.each(rows, function(key, rowdef) {
  82                 if (Ext.isDefined(rowdef.defaultValue)) {
  83                     store.add({ key: key, value: rowdef.defaultValue });
  84                 } else if (rowdef.required) {
  85                     store.add({ key: key, value: undefined });
  86                 }
  87             });
  88         }
  89
  90         if (me.sorterFn) {
  91             store.sorters.add(Ext.create('Ext.util.Sorter', {
  92                 sorterFn: me.sorterFn
  93             }));
  94         }
  95
  96         store.filters.add(Ext.create('Ext.util.Filter', {
  97             filterFn: function(item) {
  98                 if (rows) {
  99                     var rowdef = rows[item.data.key];
 100                     if (!rowdef || (rowdef.visible === false)) {
 101                         return false;
 102                     }
 103                 }
 104                 return true;
 105             }
 106         }));
 107
 108         Proxmox.Utils.monStoreErrors(me, rstore);
 109
 110         Ext.applyIf(me, {
 111             store: store,
 112             stateful: false,
 113             columns: [
 114                 {
 115                     header: gettext('Name'),
 116                     width: me.cwidth1 || 200,
 117                     dataIndex: 'key',
 118                     renderer: me.renderKey
 119                 },
 120                 {
 121                     flex: 1,
 122                     header: gettext('Value'),
 123                     dataIndex: 'value',
 124                     renderer: me.renderValue
 125                 }
 126             ]
 127         });
 128
 129         me.callParent();
 130    }
 131 });