From mboxrd@z Thu Jan  1 00:00:00 1970
Return-Path: <pve-devel-bounces@lists.proxmox.com>
Received: from firstgate.proxmox.com (firstgate.proxmox.com [IPv6:2a01:7e0:0:424::9])
	by lore.proxmox.com (Postfix) with ESMTPS id 662CF1FF170
	for <inbox@lore.proxmox.com>; Tue, 19 Nov 2024 10:22:24 +0100 (CET)
Received: from firstgate.proxmox.com (localhost [127.0.0.1])
	by firstgate.proxmox.com (Proxmox) with ESMTP id BA0EE1DF07;
	Tue, 19 Nov 2024 10:22:27 +0100 (CET)
From: Dominik Csapak <d.csapak@proxmox.com>
To: pve-devel@lists.proxmox.com
Date: Tue, 19 Nov 2024 10:22:24 +0100
Message-Id: <20241119092224.785853-1-d.csapak@proxmox.com>
X-Mailer: git-send-email 2.39.5
MIME-Version: 1.0
X-SPAM-LEVEL: Spam detection results:  0
 AWL 0.016 Adjusted score from AWL reputation of From: address
 BAYES_00                 -1.9 Bayes spam probability is 0 to 1%
 DMARC_MISSING             0.1 Missing DMARC policy
 KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment
 RCVD_IN_VALIDITY_CERTIFIED_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to
 Validity was blocked. See
 https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more
 information.
 RCVD_IN_VALIDITY_RPBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to
 Validity was blocked. See
 https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more
 information.
 RCVD_IN_VALIDITY_SAFE_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to
 Validity was blocked. See
 https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more
 information.
 SPF_HELO_NONE           0.001 SPF: HELO does not publish an SPF Record
 SPF_PASS               -0.001 SPF: sender matches SPF record
Subject: [pve-devel] [PATCH manager] ui: resource tree: add collapse/expand
 all button
X-BeenThere: pve-devel@lists.proxmox.com
X-Mailman-Version: 2.1.29
Precedence: list
List-Id: Proxmox VE development discussion <pve-devel.lists.proxmox.com>
List-Unsubscribe: <https://lists.proxmox.com/cgi-bin/mailman/options/pve-devel>, 
 <mailto:pve-devel-request@lists.proxmox.com?subject=unsubscribe>
List-Archive: <http://lists.proxmox.com/pipermail/pve-devel/>
List-Post: <mailto:pve-devel@lists.proxmox.com>
List-Help: <mailto:pve-devel-request@lists.proxmox.com?subject=help>
List-Subscribe: <https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel>, 
 <mailto:pve-devel-request@lists.proxmox.com?subject=subscribe>
Reply-To: Proxmox VE development discussion <pve-devel@lists.proxmox.com>
Content-Type: text/plain; charset="us-ascii"
Content-Transfer-Encoding: 7bit
Errors-To: pve-devel-bounces@lists.proxmox.com
Sender: "pve-devel" <pve-devel-bounces@lists.proxmox.com>

which defaults to expand all, and only if all expanded, collapse all.

Changes icon dynamically when nodes expand/collapse.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
if we'd find an icon that would fit for both cases, we could omit the
event bubbling probably. If there are many nodes, the 'hasCollapsed'
check will trigger more often, iterating over all tree nodes..


 www/manager6/Workspace.js         | 20 ++++++++++++++++++++
 www/manager6/tree/ResourceTree.js | 31 +++++++++++++++++++++++++++++++
 2 files changed, 51 insertions(+)

diff --git a/www/manager6/Workspace.js b/www/manager6/Workspace.js
index 922e01df..7bc2aeea 100644
--- a/www/manager6/Workspace.js
+++ b/www/manager6/Workspace.js
@@ -260,6 +260,15 @@ Ext.define('PVE.StdWorkspace', {
 		    },
 		},
 	    },
+	    listeners: {
+		expansionchange: function(tree) {
+		    if (tree.hasCollapsed()) {
+			me.down('#collapseButton').setIconCls('fa fa-fw fa-plus-square-o x-btn-icon-el-default-toolbar-small');
+		    } else {
+			me.down('#collapseButton').setIconCls('fa fa-fw fa-minus-square-o x-btn-icon-el-default-toolbar-small');
+		    }
+		},
+	    },
 	});
 
 	selview.on('select', function(combo, records) {
@@ -470,6 +479,17 @@ Ext.define('PVE.StdWorkspace', {
 			    padding: '0 0 5 0',
 			    items: [
 				selview,
+				{
+				    xtype: 'button',
+				    cls: 'x-btn-default-toolbar-small',
+				    itemId: 'collapseButton',
+				    tooltip: gettext('Expand/Collapse Tree'),
+				    iconCls: 'fa fa-fw fa-plus-square-o x-btn-icon-el-default-toolbar-small',
+				    handler: () => {
+					let rt = me.down('pveResourceTree');
+					rt.toggleExpansion();
+				    },
+				},
 				{
 				    xtype: 'button',
 				    cls: 'x-btn-default-toolbar-small',
diff --git a/www/manager6/tree/ResourceTree.js b/www/manager6/tree/ResourceTree.js
index 8b7c2521..cef869f7 100644
--- a/www/manager6/tree/ResourceTree.js
+++ b/www/manager6/tree/ResourceTree.js
@@ -255,6 +255,30 @@ Ext.define('PVE.tree.ResourceTree', {
 	return changed;
     },
 
+    hasCollapsed: function() {
+	let me = this;
+	let root = me.store.getRootNode();
+	let collapsed = false;
+	root.cascade(function(rec) {
+	    if (!rec.isExpanded() && !rec.isLeaf()) {
+		collapsed = true;
+		return false;
+	    }
+	    return true;
+	});
+	return collapsed;
+    },
+
+    toggleExpansion: function() {
+	let me = this;
+	let root = me.store.getRootNode();
+	if (me.hasCollapsed()) {
+	    root.expandChildren(true);
+	} else {
+	    root.collapseChildren(false);
+	}
+    },
+
     initComponent: function() {
 	let me = this;
 	me.saveSortingOptions();
@@ -562,6 +586,13 @@ Ext.define('PVE.tree.ResourceTree', {
 	rstore.on("load", updateTree);
 	rstore.startUpdate();
 
+	store.on('nodeexpand', function() {
+	    me.fireEvent('expansionchange', me);
+	});
+	store.on('nodecollapse', function() {
+	    me.fireEvent('expansionchange', me);
+	});
+
 	me.mon(Ext.GlobalEvents, 'loadedUiOptions', () => {
 	    me.store.getRootNode().cascadeBy({
 		before: function(node) {
-- 
2.39.5



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel