public inbox for pve-devel@lists.proxmox.com
 help / color / mirror / Atom feed
From: "Dominic Jäger" <d.jaeger@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [pve-devel] [PATCH widget-toolkit] input panel: Add drawing of layout
Date: Fri, 27 Nov 2020 12:08:12 +0100	[thread overview]
Message-ID: <20201127110812.102886-1-d.jaeger@proxmox.com> (raw)

The drawing makes clear in a few seconds:
 - what columnT and columnB stand for
 - what additional containers and panels are created
 - to which of those the elements of column1, column2... go to

When you're in the JS debugger and lost overview of where in this
element hierarchy you are, you can quickly check xtype + layout. Then
consulting this drawing solves the mistery.

Signed-off-by: Dominic Jäger <d.jaeger@proxmox.com>
---
IMO it's not that easy/quick to see where everything goes to.
initComponent is not that short. I actually drew the layout on paper
to keep an overview while reading it.

There was a drawing already in the commit message of
455f5fe input panel: support convenience top column
so I assumed I'm not the only one who finds such a drawing useful and
it is easier to find here than in the commit message.
 
 src/panel/InputPanel.js | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/panel/InputPanel.js b/src/panel/InputPanel.js
index 67f7352..a9c7263 100644
--- a/src/panel/InputPanel.js
+++ b/src/panel/InputPanel.js
@@ -76,6 +76,20 @@ Ext.define('Proxmox.panel.InputPanel', {
 	});
     },
 
+    /**
+     *  inputpanel, vbox
+     * +---------------------------------------------------------------------+
+     * |                             columnT                                 |
+     * +---------------------------------------------------------------------+
+     * |                          container, hbox                            |
+     * |  +---------------+---------------+---------------+---------------+  |
+     * |  |    column1    |    column2    |    column3    |    column4    |  |
+     * |  | panel, anchor | panel, anchor | panel, anchor | panel, anchor |  |
+     * |  +---------------+---------------+---------------+---------------+  |
+     * +---------------------------------------------------------------------+
+     * |                             columnB                                 |
+     * +---------------------------------------------------------------------+
+     */
     initComponent: function() {
 	let me = this;
 
-- 
2.20.1




             reply	other threads:[~2020-11-27 11:08 UTC|newest]

Thread overview: 2+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2020-11-27 11:08 Dominic Jäger [this message]
2021-01-26 17:55 ` [pve-devel] applied: " Thomas Lamprecht

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20201127110812.102886-1-d.jaeger@proxmox.com \
    --to=d.jaeger@proxmox.com \
    --cc=pve-devel@lists.proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal