The full package description is often quite long, and for upgrades
it's not relevant most of the time. But, it can be intresting to
have, if one wonders what a package is even used for.
So add a checkbox in the top bar which allows to switch between
showing and hiding the description, simply done by re-using the
'grid-row-body-hidden' ExtJS CSS class (got the idea from the
RowBody feature source code).
Default it to off, as it's better to not overwhelm users here with a
huge pile of text by default, showing the list of package with the
short one line title is enough most of the times, I'd guess.

Signed-off-by: Thomas Lamprecht <t.lampre...@proxmox.com>
---
 node/APT.js | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/node/APT.js b/node/APT.js
index 68075b6..4e09962 100644
--- a/node/APT.js
+++ b/node/APT.js
@@ -75,11 +75,11 @@ Ext.define('Proxmox.node.APT', {
             getAdditionalData: function (data, rowIndex, record, orig) {
                 var headerCt = this.view.headerCt;
                 var colspan = headerCt.getColumnCount();
-                // Usually you would style the my-body-class in CSS file
                 return {
                     rowBody: '<div style="padding: 1em">' +
                        Ext.String.htmlEncode(data.Description) +
                        '</div>',
+                   rowBodyCls: me.full_description ? '' : Ext.baseCSSPrefix + 
'grid-row-body-hidden',
                     rowBodyColspan: colspan
                 };
            }
@@ -178,10 +178,21 @@ Ext.define('Proxmox.node.APT', {
            }
        });
 
+       var verbose_desc_checkbox = new Ext.form.field.Checkbox({
+           boxLabel: gettext('Show Full Description'),
+           value: false,
+           listeners: {
+               change: (f, val) => {
+                   me.full_description = val;
+                   me.getView().refresh();
+               }
+           }
+       });
+
        if (me.upgradeBtn) {
-           me.tbar =  [ update_btn, me.upgradeBtn, changelog_btn ];
+           me.tbar =  [ update_btn, me.upgradeBtn, changelog_btn, '->', 
verbose_desc_checkbox ];
        } else {
-           me.tbar =  [ update_btn, changelog_btn ];
+           me.tbar =  [ update_btn, changelog_btn, '->', verbose_desc_checkbox 
];
        }
 
        Ext.apply(me, {
-- 
2.20.1


_______________________________________________
pve-devel mailing list
pve-devel@pve.proxmox.com
https://pve.proxmox.com/cgi-bin/mailman/listinfo/pve-devel

Reply via email to