ui: MainView/NavigationTree: improve tree selection handling
this fixes some bugs related to selection handling in the treelist: * datastores were not selected after a reload * reloading when in a tabpanel on any tab but the first, would not select a treenode * changing between datastores on any tab but the first would not select the same tab on the new datastore fixed those by mostly rewriting the changePath handling for datastores and tabpanels in general Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
		
				
					committed by
					
						
						Thomas Lamprecht
					
				
			
			
				
	
			
			
			
						parent
						
							7ece65a01e
						
					
				
				
					commit
					2565fdd075
				
			@ -67,46 +67,48 @@ Ext.define('PBS.MainView', {
 | 
				
			|||||||
	    var contentpanel = me.lookupReference('contentpanel');
 | 
						    var contentpanel = me.lookupReference('contentpanel');
 | 
				
			||||||
	    var lastpanel = contentpanel.getLayout().getActiveItem();
 | 
						    var lastpanel = contentpanel.getLayout().getActiveItem();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	    var obj;
 | 
						    let tabChangeListener = function(tp, newc, oldc) {
 | 
				
			||||||
	    if (PBS.Utils.isDataStorePath(path)) {
 | 
							let newpath = path;
 | 
				
			||||||
		let datastore = PBS.Utils.getDataStoreFromPath(path);
 | 
					 | 
				
			||||||
		obj = contentpanel.add({
 | 
					 | 
				
			||||||
		    xtype: 'pbsDataStorePanel',
 | 
					 | 
				
			||||||
		    nodename: 'localhost',
 | 
					 | 
				
			||||||
		    datastore,
 | 
					 | 
				
			||||||
		});
 | 
					 | 
				
			||||||
	    } else {
 | 
					 | 
				
			||||||
		obj = contentpanel.add({
 | 
					 | 
				
			||||||
		    xtype: path,
 | 
					 | 
				
			||||||
		    nodename: 'localhost',
 | 
					 | 
				
			||||||
		    border: false,
 | 
					 | 
				
			||||||
		});
 | 
					 | 
				
			||||||
	    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	    var treelist = me.lookupReference('navtree');
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	    treelist.suspendEvents();
 | 
					 | 
				
			||||||
	    if (subpath === undefined) {
 | 
					 | 
				
			||||||
		treelist.select(path);
 | 
					 | 
				
			||||||
	    } else {
 | 
					 | 
				
			||||||
		treelist.select(path + ':' + subpath);
 | 
					 | 
				
			||||||
	    }
 | 
					 | 
				
			||||||
	    treelist.resumeEvents();
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
	    if (Ext.isFunction(obj.setActiveTab)) {
 | 
					 | 
				
			||||||
		obj.setActiveTab(subpath || 0);
 | 
					 | 
				
			||||||
		obj.addListener('tabchange', function(tabpanel, newc, oldc) {
 | 
					 | 
				
			||||||
		    var newpath = path;
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
		// only add the subpath part for the
 | 
							// only add the subpath part for the
 | 
				
			||||||
		// non-default tabs
 | 
							// non-default tabs
 | 
				
			||||||
		    if (tabpanel.items.findIndex('id', newc.id) !== 0) {
 | 
							if (tp.items.findIndex('id', newc.id) !== 0) {
 | 
				
			||||||
			newpath += ":" + newc.getItemId();
 | 
							    newpath += `:${newc.getItemId()}`;
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		me.redirectTo(newpath);
 | 
							me.redirectTo(newpath);
 | 
				
			||||||
		});
 | 
						    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						    let xtype = path;
 | 
				
			||||||
 | 
						    var obj;
 | 
				
			||||||
 | 
						    let datastore;
 | 
				
			||||||
 | 
						    if (PBS.Utils.isDataStorePath(path)) {
 | 
				
			||||||
 | 
							datastore = PBS.Utils.getDataStoreFromPath(path);
 | 
				
			||||||
 | 
							if (lastpanel && lastpanel.xtype === 'pbsDataStorePanel' && !subpath) {
 | 
				
			||||||
 | 
							    let activeTab = lastpanel.getActiveTab();
 | 
				
			||||||
 | 
							    let newpath = path;
 | 
				
			||||||
 | 
							    if (lastpanel.items.indexOf(activeTab) !== 0) {
 | 
				
			||||||
 | 
								subpath = activeTab.getItemId();
 | 
				
			||||||
 | 
								newpath += `:${subpath}`;
 | 
				
			||||||
		    }
 | 
							    }
 | 
				
			||||||
 | 
							    me.redirectTo(newpath);
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
							xtype = 'pbsDataStorePanel';
 | 
				
			||||||
 | 
						    }
 | 
				
			||||||
 | 
						    obj = contentpanel.add({
 | 
				
			||||||
 | 
							xtype,
 | 
				
			||||||
 | 
							datastore,
 | 
				
			||||||
 | 
							nodename: 'localhost',
 | 
				
			||||||
 | 
							border: false,
 | 
				
			||||||
 | 
							activeTab: subpath || 0,
 | 
				
			||||||
 | 
							listeners: {
 | 
				
			||||||
 | 
							    tabchange: tabChangeListener,
 | 
				
			||||||
 | 
							},
 | 
				
			||||||
 | 
						    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						    var treelist = me.lookupReference('navtree');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						    treelist.select(path, true);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	    contentpanel.setActiveItem(obj);
 | 
						    contentpanel.setActiveItem(obj);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
@ -163,6 +163,12 @@ Ext.define('PBS.view.main.NavigationTree', {
 | 
				
			|||||||
	    });
 | 
						    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	    Ext.Array.forEach(erase_list, function(node) { list.removeChild(node, true); });
 | 
						    Ext.Array.forEach(erase_list, function(node) { list.removeChild(node, true); });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						    if (view.pathToSelect !== undefined) {
 | 
				
			||||||
 | 
							let path = view.pathToSelect;
 | 
				
			||||||
 | 
							delete view.pathToSelect;
 | 
				
			||||||
 | 
							view.select(path, true);
 | 
				
			||||||
 | 
						    }
 | 
				
			||||||
	},
 | 
						},
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -186,10 +192,20 @@ Ext.define('PBS.view.main.NavigationTree', {
 | 
				
			|||||||
	},
 | 
						},
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    select: function(path) {
 | 
					    select: function(path, silent) {
 | 
				
			||||||
	var me = this;
 | 
						var me = this;
 | 
				
			||||||
 | 
						if (me.rstore.isLoaded()) {
 | 
				
			||||||
 | 
						    if (silent) {
 | 
				
			||||||
 | 
							me.suspendEvents(false);
 | 
				
			||||||
 | 
						    }
 | 
				
			||||||
	    var item = me.getStore().findRecord('path', path, 0, false, true, true);
 | 
						    var item = me.getStore().findRecord('path', path, 0, false, true, true);
 | 
				
			||||||
	    me.setSelection(item);
 | 
						    me.setSelection(item);
 | 
				
			||||||
 | 
						    if (silent) {
 | 
				
			||||||
 | 
							me.resumeEvents(true);
 | 
				
			||||||
 | 
						    }
 | 
				
			||||||
 | 
						} else {
 | 
				
			||||||
 | 
						    me.pathToSelect = path;
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    animation: false,
 | 
					    animation: false,
 | 
				
			||||||
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user