copy ResourceGrid.js from manager to manager5

www/manager5/grid/ResourceGrid.js

+// fixme: remove this fix
+// this hack is required for ExtJS 4.0.0
+Ext.override(Ext.grid.feature.Chunking, {
+    attachEvents: function() {
+        var grid = this.view.up('gridpanel'),
+            scroller = grid.down('gridscroller[dock=right]');
+        if (scroller === null ) {
+            grid.on("afterlayout", this.attachEvents, this);
+	    return;
+        }
+        scroller.el.on('scroll', this.onBodyScroll, this, {buffer: 300});
+    },
+    rowHeight: PVE.Utils.gridLineHeigh()
+});
+
+Ext.define('PVE.grid.ResourceGrid', {
+    extend: 'Ext.grid.GridPanel',
+    alias: ['widget.pveResourceGrid'],
+
+    //fixme: this makes still problems with the scrollbar
+    //features: [ {ftype: 'chunking'}],
+    
+    initComponent : function() {
+	var me = this;
+
+	var rstore = PVE.data.ResourceStore;
+	var sp = Ext.state.Manager.getProvider();
+
+	var coldef = rstore.defaultColums();
+
+	var store = Ext.create('Ext.data.Store', {
+	    model: 'PVEResources',
+	    sorters: [
+		{
+		    property : 'type',
+		    direction: 'ASC'
+		}
+	    ],
+	    proxy: { type: 'memory' }
+	});
+
+	var textfilter = '';
+
+	var textfilter_match = function(item) {
+	    var match = false;
+	    Ext.each(['name', 'storage', 'node', 'type', 'text'], function(field) {
+		var v = item.data[field];
+		if (v !== undefined) {
+		    v = v.toLowerCase();
+		    if (v.indexOf(textfilter) >= 0) {
+			match = true;
+			return false;
+		    }
+		}
+	    });
+	    return match;
+	};
+
+	var updateGrid = function() {
+
+	    var filterfn = me.viewFilter ? me.viewFilter.filterfn : null;
+	    
+	    //console.log("START GRID UPDATE " +  me.viewFilter);
+
+	    store.suspendEvents();
+
+	    var nodeidx = {};
+	    var gather_child_nodes = function(cn) {
+		if (!cn) {
+		    return;
+		}
+                var cs = cn.childNodes;
+		if (!cs) {
+		    return;
+		}
+		var len = cs.length, i = 0, n, res;
+
+                for (; i < len; i++) {
+		    var child = cs[i];
+		    var orgnode = rstore.data.get(child.data.id);
+		    if (orgnode) {
+			if ((!filterfn || filterfn(child)) &&
+			    (!textfilter || textfilter_match(child))) {
+			    nodeidx[child.data.id] = orgnode;
+			}
+		    }
+		    gather_child_nodes(child);
+		}
+	    };
+	    gather_child_nodes(me.pveSelNode);
+
+	    // remove vanished items
+	    var rmlist = [];
+	    store.each(function(olditem) {
+		var item = nodeidx[olditem.data.id];
+		if (!item) {
+		    //console.log("GRID REM UID: " + olditem.data.id);
+		    rmlist.push(olditem);
+		}
+	    });
+
+	    if (rmlist.length) {
+		store.remove(rmlist);
+	    }
+
+	    // add new items
+	    var addlist = [];
+	    var key;
+	    for (key in nodeidx) {
+		if (nodeidx.hasOwnProperty(key)) {
+		    var item = nodeidx[key];
+		
+		    // getById() use find(), which is slow (ExtJS4 DP5) 
+		    //var olditem = store.getById(item.data.id);
+		    var olditem = store.data.get(item.data.id);
+
+		    if (!olditem) {
+			//console.log("GRID ADD UID: " + item.data.id);
+			var info = Ext.apply({}, item.data);
+			var child = Ext.ModelMgr.create(info, store.model, info.id);
+			addlist.push(item);
+			continue;
+		    }
+		    // try to detect changes
+		    var changes = false;
+		    var fieldkeys = PVE.data.ResourceStore.fieldNames;
+		    var fieldcount = fieldkeys.length;
+		    var fieldind;
+		    for (fieldind = 0; fieldind < fieldcount; fieldind++) {
+			var field = fieldkeys[fieldind];
+			if (field != 'id' && item.data[field] != olditem.data[field]) {
+			    changes = true;
+			    //console.log("changed item " + item.id + " " + field + " " + item.data[field] + " != " + olditem.data[field]);
+			    olditem.beginEdit();
+			    olditem.set(field, item.data[field]);
+			}
+		    }
+		    if (changes) {
+			olditem.endEdit(true);
+			olditem.commit(true); 
+		    }
+		}
+	    }
+
+	    if (addlist.length) {
+		store.add(addlist);
+	    }
+
+	    store.sort();
+
+	    store.resumeEvents();
+
+	    store.fireEvent('datachanged', store);
+
+	    //console.log("END GRID UPDATE");
+	};
+
+	var filter_task = new Ext.util.DelayedTask(function(){
+	    updateGrid();
+	});
+
+	var load_cb = function() { 
+	    updateGrid(); 
+	};
+
+	Ext.applyIf(me, {
+	    title: gettext('Search')
+	});
+
+	Ext.apply(me, {
+	    store: store,
+	    tbar: [
+		'->', 
+		gettext('Search') + ':', ' ',
+		{
+		    xtype: 'textfield',
+		    width: 200,
+		    value: textfilter,
+		    enableKeyEvents: true,
+		    listeners: {
+			keyup: function(field, e) {
+			    var v = field.getValue();
+			    textfilter = v.toLowerCase();
+			    filter_task.delay(500);
+			}
+		    }
+		}
+	    ],
+	    viewConfig: {
+		stripeRows: true
+            },
+	    listeners: {
+		itemcontextmenu: function(v, record, item, index, event) {
+		    event.stopEvent();
+		    v.select(record);
+		    var menu;
+		    
+		    if (record.data.type === 'qemu' && !record.data.template) {
+			menu = Ext.create('PVE.qemu.CmdMenu', {
+			    pveSelNode: record
+			});
+		    } else if (record.data.type === 'qemu' && record.data.template) {
+			menu = Ext.create('PVE.qemu.TemplateMenu', {
+			    pveSelNode: record
+			});
+		    } else if (record.data.type === 'lxc') {
+			menu = Ext.create('PVE.lxc.CmdMenu', {
+			    pveSelNode: record
+			});
+		    } else {
+			return;
+		    }
+
+		    menu.showAt(event.getXY());
+		},
+		itemdblclick: function(v, record) {
+		    var ws = me.up('pveStdWorkspace');
+		    ws.selectById(record.data.id);
+		},
+		destroy: function() {
+		    rstore.un("load", load_cb);
+		}
+	    },
+            columns: coldef
+	});
+
+	me.callParent();
+
+	updateGrid();
+	rstore.on("load", load_cb);
+    }
+});