From mboxrd@z Thu Jan  1 00:00:00 1970
Return-Path: <a.lauterer@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 43BA492C7B
 for <pve-devel@lists.proxmox.com>; Wed, 14 Sep 2022 16:15:09 +0200 (CEST)
Received: from firstgate.proxmox.com (localhost [127.0.0.1])
 by firstgate.proxmox.com (Proxmox) with ESMTP id 314E32D2DD
 for <pve-devel@lists.proxmox.com>; Wed, 14 Sep 2022 16:15:09 +0200 (CEST)
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>; Wed, 14 Sep 2022 16:15:08 +0200 (CEST)
Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1])
 by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 419CC44206
 for <pve-devel@lists.proxmox.com>; Wed, 14 Sep 2022 16:15:08 +0200 (CEST)
Message-ID: <ba881002-2cba-7ae2-9b45-e18be9e71f10@proxmox.com>
Date: Wed, 14 Sep 2022 16:15:07 +0200
MIME-Version: 1.0
User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:102.0) Gecko/20100101
 Thunderbird/102.2.2
From: Aaron Lauterer <a.lauterer@proxmox.com>
To: Proxmox VE development discussion <pve-devel@lists.proxmox.com>,
 Dominik Csapak <d.csapak@proxmox.com>
References: <20220621092012.1776825-1-d.csapak@proxmox.com>
 <20220621092012.1776825-16-d.csapak@proxmox.com>
Content-Language: en-US
In-Reply-To: <20220621092012.1776825-16-d.csapak@proxmox.com>
Content-Type: text/plain; charset=UTF-8; format=flowed
Content-Transfer-Encoding: 7bit
X-SPAM-LEVEL: Spam detection results:  0
 AWL 0.772 Adjusted score from AWL reputation of From: address
 BAYES_00                 -1.9 Bayes spam probability is 0 to 1%
 KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment
 NICE_REPLY_A           -1.583 Looks like a legit reply (A)
 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: Re: [pve-devel] [PATCH manager v7 05/14] ui: add form/TagColorGrid
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: Wed, 14 Sep 2022 14:15:09 -0000

One thing I noticed in a few places regarding variable names was that they 
probably could use some camel casing for better readabilty. E.g.:

newcls -> newCls
newrbd -> newRgb or maybe newRGB?

More comments inline.

On 6/21/22 11:20, Dominik Csapak wrote:
> this provides a basic grid to edit a list of tag color overrides.
> We'll use this for editing the datacenter.cfg overrides and the
> browser storage overrides.
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>

[...]

> +++ b/www/manager6/form/TagColorGrid.js
> @@ -0,0 +1,357 @@
> +Ext.define('PVE.form.ColorPicker', {
> +    extend: 'Ext.form.FieldContainer',
> +    alias: 'widget.pveColorPicker',
> +
> +    defaultBindProperty: 'value',
> +
> +    config: {
> +	value: null,
> +    },
> +
> +    height: 24,
> +
> +    layout: {
> +	type: 'hbox',
> +	align: 'stretch',
> +    },
> +
> +    getValue: function() {
> +	return this.realvalue.slice(1);
> +    },
> +
> +    setValue: function(value) {
> +	let me = this;
> +	me.setColor(value);
> +	if (value && value.length === 6) {
> +	    me.picker.value = value[0] !== '#' ? `#${value}` : value;

if we do check the length to be 6 characters long, can we run into the situation 
that it is already prefixed by a #?

> +	}
> +    },
> +
> +    setColor: function(value) {
> +	let me = this;
> +	let oldValue = me.realvalue;
> +	me.realvalue = value;
> +	let color = value.length === 6 ? `#${value}` : undefined;
> +	me.down('#picker').setStyle('background-color', color);
> +	me.down('#text').setValue(value ?? "");
> +	me.fireEvent('change', me, me.realvalue, oldValue);
> +    },

[...]

> +
> +	backgroundChange: function(field, newValue, oldValue) {
> +	    let me = this;
> +	    let rec = field.getWidgetRecord();
> +	    if (!rec) {
> +		return;
> +	    }
> +	    if (newValue && newValue !== oldValue) {
> +		let newrgb = Proxmox.Utils.hexToRGB(newValue);
> +		let newcls = Proxmox.Utils.getTextContrastClass(newrgb);
> +		let hexvalue = newcls === 'dark' ? '000000' : 'FFFFFF';

s/hexvalue/textHexVal/ or something in that direction so the variable name 
reflects what is contains?

> +		if (!rec.get('text')) {
> +		    rec.set('text', hexvalue);
> +		} else if (oldValue) {
> +		    let oldrgb = Proxmox.Utils.hexToRGB(oldValue);
> +		    let oldcls = Proxmox.Utils.getTextContrastClass(oldrgb);
> +		    let oldvalue = oldcls === 'dark' ? '000000' : 'FFFFFF';
> +		    if (rec.get('text') === oldvalue) {
> +			rec.set('text', hexvalue);
> +		    }
> +		}

[...]