From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: 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 42918A05DC for ; Wed, 8 Nov 2023 16:49:59 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 28678AAF7 for ; Wed, 8 Nov 2023 16:49:59 +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 ; Wed, 8 Nov 2023 16:49:58 +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 5061947452 for ; Wed, 8 Nov 2023 16:49:58 +0100 (CET) From: Dominik Csapak To: pve-devel@lists.proxmox.com Date: Wed, 8 Nov 2023 16:49:56 +0100 Message-Id: <20231108154957.1593434-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 - URIBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to URIBL was blocked. See http://wiki.apache.org/spamassassin/DnsBlocklists#dnsbl-block for more information. [info.name] Subject: [pve-devel] [PATCH manager 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 List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Wed, 08 Nov 2023 15:49:59 -0000 and exclude the tags for that, since we want the tags to have their own tooltips Signed-off-by: Dominik Csapak --- not really sure if we want to do this, since creating a custom tree column type just for that seems overkill. also we have to touch private properties of that here to change it which i don't really like www/manager6/tree/ResourceTree.js | 87 ++++++++++++++++++++++++++++--- 1 file changed, 80 insertions(+), 7 deletions(-) diff --git a/www/manager6/tree/ResourceTree.js b/www/manager6/tree/ResourceTree.js index 54c6403d..f23f9f99 100644 --- a/www/manager6/tree/ResourceTree.js +++ b/www/manager6/tree/ResourceTree.js @@ -103,10 +103,15 @@ Ext.define('PVE.tree.ResourceTree', { }, setIconCls: function(info) { + let me = this; let cls = PVE.Utils.get_object_icon_class(info.type, info); if (cls !== '') { info.iconCls = cls; } + let tip = me.getToolTip(info); + if (tip) { + info.iconAttrs = `data-qtip="${tip}"`; + } }, // add additional elements to text. Currently only the usage indicator for storages @@ -130,15 +135,22 @@ Ext.define('PVE.tree.ResourceTree', { info.text = `${info.name} (${String(info.vmid)})`; } } + info.text = status + info.text; - info.text += PVE.Utils.renderTags(info.tags, PVE.UIOptions.tagOverrides); + let tip = me.getToolTip(info); + if (tip) { + info.text = `${info.text}`; + } - info.text = status + info.text; + info.text += PVE.Utils.renderTags(info.tags, PVE.UIOptions.tagOverrides); }, - 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 +161,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 +172,6 @@ Ext.define('PVE.tree.ResourceTree', { me.setIconCls(info); me.setText(info); - me.setToolTip(info); if (info.groupbyid) { info.text = info.groupbyid; @@ -315,7 +328,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()) { @@ -471,4 +483,65 @@ Ext.define('PVE.tree.ResourceTree', { rstore.startUpdate(); }, + hideHeaders: true, + + columns: [ + { + xtype: 'pveResourceTreeColumn', + text: 'Name', + flex: 1, + dataIndex: 'text', + }, + ], + +}); + +// we want to change how the icon div is rendered, so we have to subclass +// the whole tree column class to change the cellTpl and available data +Ext.define('PVE.tree.ResourceTreeColumn', { + extend: 'Ext.tree.Column', + alias: 'widget.pveResourceTreeColumn', + + // copied from Ext.tree.Column source except indentation and one detail (see inline comment) + cellTpl: [ + '', + '
lineempty" role="presentation">
', + '', + '
-end-plus {expanderCls}" role="presentation">
', + '', + '
{checkboxCls}-checked">
', + '', + '', + '', + 'style="font-family:{glyphFontFamily}"', + '', + '>{glyph}', + '', + '', + '', + '', + ' role="presentation" class="{childCls} {baseIconCls} {customIconCls} ', + '{baseIconCls}-leafparent-expandedparent {iconCls}" ', + // the line below has 'iconAttrs' added to it + 'style="background-image:url({icon})"/>{iconAttrs}>', + '', + '', + '{value}', + '', + '{value}', + '', + ], + + initTemplateRendererData: function(value, metaData, record, rowIdx, colIdx, store, view) { + let me = this; + let data = me.callParent(arguments); + data.iconAttrs = record.data.iconAttrs ?? ''; + return data; + }, }); -- 2.30.2