From mboxrd@z Thu Jan  1 00:00:00 1970
Return-Path: <d.csapak@proxmox.com>
Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68])
 (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits)
 key-exchange X25519 server-signature RSA-PSS (2048 bits))
 (No client certificate requested)
 by lists.proxmox.com (Postfix) with ESMTPS id 61D06A099A
 for <pve-devel@lists.proxmox.com>; Thu,  9 Nov 2023 11:56:56 +0100 (CET)
Received: from firstgate.proxmox.com (localhost [127.0.0.1])
 by firstgate.proxmox.com (Proxmox) with ESMTP id 42B371389E
 for <pve-devel@lists.proxmox.com>; Thu,  9 Nov 2023 11:56:26 +0100 (CET)
Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com
 [94.136.29.106])
 (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits)
 key-exchange X25519 server-signature RSA-PSS (2048 bits))
 (No client certificate requested)
 by firstgate.proxmox.com (Proxmox) with ESMTPS
 for <pve-devel@lists.proxmox.com>; Thu,  9 Nov 2023 11:56:25 +0100 (CET)
Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1])
 by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 73D1F47715
 for <pve-devel@lists.proxmox.com>; Thu,  9 Nov 2023 11:56:25 +0100 (CET)
From: Dominik Csapak <d.csapak@proxmox.com>
To: pve-devel@lists.proxmox.com
Date: Thu,  9 Nov 2023 11:56:23 +0100
Message-Id: <20231109105624.2337910-1-d.csapak@proxmox.com>
X-Mailer: git-send-email 2.30.2
MIME-Version: 1.0
Content-Transfer-Encoding: 8bit
X-SPAM-LEVEL: Spam detection results:  0
 AWL 0.017 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
 SPF_HELO_NONE           0.001 SPF: HELO does not publish an SPF Record
 SPF_PASS               -0.001 SPF: sender matches SPF record
 T_SCC_BODY_TEXT_LINE    -0.01 -
Subject: [pve-devel] [PATCH manager v2 1/2] ui: resource tree: limit tooltip
 to icon and text
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>
X-List-Received-Date: Thu, 09 Nov 2023 10:56:56 -0000

and exclude the tags for that, since we want the tags to have their own
tooltips

we use the delegate function of the tooltips for that

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
changes from v1:
* instead of using a custom tree column class, use the same delegate
  mechanism as the next patch
 www/manager6/tree/ResourceTree.js | 40 ++++++++++++++++++++++++-------
 1 file changed, 31 insertions(+), 9 deletions(-)

diff --git a/www/manager6/tree/ResourceTree.js b/www/manager6/tree/ResourceTree.js
index 54c6403d..90f85fba 100644
--- a/www/manager6/tree/ResourceTree.js
+++ b/www/manager6/tree/ResourceTree.js
@@ -122,7 +122,7 @@ Ext.define('PVE.tree.ResourceTree', {
 		status = '<div class="usage-wrapper">';
 		status += `<div class="usage-negative" style="height: ${remainingHeight}%"></div>`;
 		status += `<div class="usage" style="height: ${barHeight}%"></div>`;
-		status += '</div> ';
+		status += '</div>';
 	    }
 	}
 	if (Ext.isNumeric(info.vmid) && info.vmid > 0) {
@@ -130,15 +130,16 @@ Ext.define('PVE.tree.ResourceTree', {
 		info.text = `${info.name} (${String(info.vmid)})`;
 	    }
 	}
-
+	info.text = `<span>${status} ${info.text}</span>`;
 	info.text += PVE.Utils.renderTags(info.tags, PVE.UIOptions.tagOverrides);
-
-	info.text = status + info.text;
     },
 
-    setToolTip: function(info) {
+    getToolTip: function(info) {
+	if (info.tip) {
+	    return info.tip;
+	}
 	if (info.type === 'pool' || info.groupbyid !== undefined) {
-	    return;
+	    return undefined;
 	}
 
 	let qtips = [gettext('Status') + ': ' + (info.qmpstatus || info.status)];
@@ -149,7 +150,9 @@ Ext.define('PVE.tree.ResourceTree', {
 	    qtips.push(gettext('HA State') + ": " + info.hastate);
 	}
 
-	info.qtip = qtips.join(', ');
+	let tip = qtips.join(', ');
+	info.tip = tip;
+	return tip;
     },
 
     // private
@@ -158,7 +161,6 @@ Ext.define('PVE.tree.ResourceTree', {
 
 	me.setIconCls(info);
 	me.setText(info);
-	me.setToolTip(info);
 
 	if (info.groupbyid) {
 	    info.text = info.groupbyid;
@@ -315,7 +317,6 @@ Ext.define('PVE.tree.ResourceTree', {
 		    Ext.apply(info, item.data);
 		    me.setIconCls(info);
 		    me.setText(info);
-		    me.setToolTip(info);
 		    olditem.commit();
 		}
 		if ((!item || moved) && olditem.isLeaf()) {
@@ -403,6 +404,27 @@ Ext.define('PVE.tree.ResourceTree', {
 		    return allow;
 		},
 		itemdblclick: PVE.Utils.openTreeConsole,
+		afterrender: function() {
+		    if (me.tip) {
+			return;
+		    }
+		    let selectors = [
+			'.x-tree-node-text > span:not(.proxmox-tag-dark):not(.proxmox-tag-light)',
+			'.x-tree-icon',
+		    ];
+		    me.tip = Ext.create('Ext.tip.ToolTip', {
+			target: me.el,
+			delegate: selectors.join(', '),
+			trackMouse: true,
+			renderTo: Ext.getBody(),
+			listeners: {
+			    beforeshow: function(tip) {
+				let rec = me.getView().getRecord(tip.triggerElement);
+				tip.update(me.getToolTip(rec.data));
+			    },
+			},
+		    });
+		},
 	    },
 	    setViewFilter: function(view) {
 		me.viewFilter = view;
-- 
2.30.2