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