[pve-devel] front end: basic guidelines for removing items form gui

[Dominik Csapak]

On 08/22/2018 07:18 PM, Rudolf Clausius wrote:
> hi congrats on all this work guys!

hi and thanks :)

> 
> Could you please enlighten me on what framework is used for the web
> frontend? is it the smarty engine?
> 
> Unfortunately I cant see past the index.html.tpl and the .js files.
> 

for the frontend we use sencha extjs [1] (currently version 6.0.1)
there is version specific documentation [2]

for the index.html.tpl we use Perls 'Template', but this is not 
necessary for gui development (it is only used for including the 
correctly lang files and default settings)

Just for completeness sake i explain the gui architecture a bit:

we have the daemons 'pveproxy' and 'pvedaemon' which provide a REST-API[3]

for the url '/' the proxy provides the 'index.html.tpl'
which is an extjs single page application

the source files of that is in 'pve-manager/www/manager6' and get
concatenated into pvemanagerlib.js

we also have the proxmox-widget-toolkit [4] (seperate git repository and 
package) which provides common components, functions and data for
Proxmox VE and Proxmox Mail Gateway (which also uses the same architecture)

> My goal is to simplify how the gui looks by removing some buttons and
> settings some users see.
> Current Behavior: buttons greyed out when user not authorized to use them
> Goal: buttons should disappear

While i guess on most places this is fine, there are some places where
we would not want this, to avoid 'jumping' buttons when changing from 
one page to the next (e.g. from a container to another), but if this
is avoidable then it is no problem

if you tell us where exactly you want to do this, we can give further
direction on where you can/should start

> 
> I would really appreciate being pointed to the right direction, I will do
> my best to pick it up from there.

i hope my answer does help you, and if you have any further questions,
please just ask :)


1: https://www.sencha.com/products/extjs/
2: https://docs.sencha.com/extjs/6.0.1/index.html
3: https://pve.proxmox.com/wiki/Proxmox_VE_API
4: https://git.proxmox.com/?p=proxmox-widget-toolkit.git;a=summary