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 5ED49693AA for ; Mon, 26 Jul 2021 10:12:36 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 558449963 for ; Mon, 26 Jul 2021 10:12:36 +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 id CBFF89955 for ; Mon, 26 Jul 2021 10:12:35 +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 9D76842795 for ; Mon, 26 Jul 2021 10:12:35 +0200 (CEST) To: Proxmox Backup Server development discussion , Dominik Csapak References: <20210723063151.292363-1-d.csapak@proxmox.com> From: Dietmar Maurer Message-ID: <9d8271c0-e3c7-c935-39a5-58980eb83942@proxmox.com> Date: Mon, 26 Jul 2021 10:12:34 +0200 User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:78.0) Gecko/20100101 Thunderbird/78.12.0 MIME-Version: 1.0 In-Reply-To: <20210723063151.292363-1-d.csapak@proxmox.com> Content-Type: text/plain; charset=utf-8; format=flowed Content-Transfer-Encoding: 7bit Content-Language: en-US X-SPAM-LEVEL: Spam detection results: 0 AWL 0.815 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 SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pbs-devel] applied: [PATCH proxmox-backup] ui: tape/ChangerStatus: improve layout for large libraries X-BeenThere: pbs-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Backup Server development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Mon, 26 Jul 2021 08:12:36 -0000 applied On 7/23/21 8:31 AM, Dominik Csapak wrote: > instead of having the grid be as tall as possible and the containing > panel scroll. limit the grids height to the panel size and scroll the > grid. > > this has two advantages: > * if a user has many slots, it is now possible to to navigate the other > grids to the position wanted > * having the grids scroll, means it can use extjs' buffered renderer, > which makes the view much more responsive (in case of hundreds of > slots) > > Signed-off-by: Dominik Csapak > --- > www/tape/ChangerStatus.js | 14 +++++++++++--- > 1 file changed, 11 insertions(+), 3 deletions(-) > > diff --git a/www/tape/ChangerStatus.js b/www/tape/ChangerStatus.js > index 97b8f78e..a99b6ba6 100644 > --- a/www/tape/ChangerStatus.js > +++ b/www/tape/ChangerStatus.js > @@ -693,9 +693,8 @@ Ext.define('PBS.TapeManagement.ChangerStatus', { > }, > ], > > - layout: 'auto', > + layout: 'fit', > bodyPadding: 5, > - scrollable: true, > > items: [ > { > @@ -703,7 +702,7 @@ Ext.define('PBS.TapeManagement.ChangerStatus', { > reference: 'content', > layout: { > type: 'hbox', > - aling: 'stretch', > + align: 'stretch', > }, > items: [ > { > @@ -711,6 +710,7 @@ Ext.define('PBS.TapeManagement.ChangerStatus', { > reference: 'slots', > title: gettext('Slots'), > padding: 5, > + srollable: true, > flex: 1, > store: { > type: 'diff', > @@ -771,10 +771,16 @@ Ext.define('PBS.TapeManagement.ChangerStatus', { > defaults: { > padding: 5, > }, > + layout: { > + type: 'vbox', > + align: 'stretch', > + }, > items: [ > { > xtype: 'grid', > reference: 'drives', > + scrollable: true, > + maxHeight: 350, // ~10 drives > title: gettext('Drives'), > store: { > type: 'diff', > @@ -918,6 +924,8 @@ Ext.define('PBS.TapeManagement.ChangerStatus', { > { > xtype: 'grid', > reference: 'import_export', > + flex: 1, > + srollable: true, > store: { > type: 'diff', > rstore: {