proxmox-backup/www/MainView.js
Thomas Lamprecht 87b4d953bf ui: main init: set username info
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2019-12-17 13:00:17 +01:00

189 lines
3.9 KiB
JavaScript

Ext.define('PBS.MainView', {
extend: 'Ext.container.Container',
xtype: 'mainview',
title: 'Proxmox Backup Server',
controller: {
xclass: 'Ext.app.ViewController',
routes: {
':path:subpath': {
action: 'changePath',
before: 'beforeChangePath',
conditions : {
':path' : '(?:([%a-zA-Z0-9\\-\\_\\s,]+))',
':subpath' : '(?:(?::)([%a-zA-Z0-9\\-\\_\\s,]+))?'
}
}
},
beforeChangePath: function(path, subpath, action) {
var me = this;
if (!Ext.ClassManager.getByAlias('widget.'+ path)) {
console.warn('xtype "'+path+'" not found');
action.stop();
return;
}
var lastpanel = me.lookupReference('contentpanel').getLayout().getActiveItem();
if (lastpanel && lastpanel.xtype === path) {
// we have the right component already,
// we just need to select the correct tab
// default to the first
subpath = subpath || 0;
if (lastpanel.getActiveTab) {
// we assume lastpanel is a tabpanel
if (lastpanel.getActiveTab().getItemId() !== subpath) {
// set the active tab
lastpanel.setActiveTab(subpath);
}
// else we are already there
}
action.stop();
return;
}
action.resume();
},
changePath: function(path,subpath) {
var me = this;
var contentpanel = me.lookupReference('contentpanel');
var lastpanel = contentpanel.getLayout().getActiveItem();
var obj = contentpanel.add({ xtype: path });
var treelist = me.lookupReference('navtree');
treelist.suspendEvents();
treelist.select(path);
treelist.resumeEvents();
if (Ext.isFunction(obj.setActiveTab)) {
obj.setActiveTab(subpath || 0);
obj.addListener('tabchange', function(tabpanel, newc, oldc) {
var newpath = path;
// only add the subpath part for the
// non-default tabs
if (tabpanel.items.findIndex('id', newc.id) !== 0) {
newpath += ":" + newc.getItemId();
}
me.redirectTo(newpath);
});
}
contentpanel.setActiveItem(obj);
if (lastpanel) {
contentpanel.remove(lastpanel, { destroy: true });
}
},
logout: function() {
PBS.app.logout();
},
navigate: function(treelist, item) {
this.redirectTo(item.get('path'));
},
control: {
'button[reference=logoutButton]': {
click: 'logout'
}
},
init: function(view) {
var me = this;
me.lookupReference('usernameinfo').update({username:Proxmox.UserName});
}
},
plugins: 'viewport',
layout: { type: 'border' },
items: [
{
region: 'north',
xtype: 'container',
layout: {
type: 'hbox',
align: 'middle'
},
margin: '2 5 2 5',
height: 38,
items: [
{
xtype: 'proxmoxlogo'
},
{
xtype: 'versioninfo'
},
{
flex: 1
},
{
baseCls: 'x-plain',
reference: 'usernameinfo',
padding: '0 5',
tpl: Ext.String.format(gettext("You are logged in as {0}"), "'{username}'")
},
{
xtype: 'button',
baseCls: 'x-btn',
cls: 'x-btn-default-toolbar-small proxmox-inline-button',
iconCls: 'fa fa-book x-btn-icon-el-default-toolbar-small ',
text: gettext('Documentation'),
href: '/docs/index.html',
margin: '0 5 0 0',
},
{
reference: 'logoutButton',
xtype: 'button',
iconCls: 'fa fa-sign-out',
text: gettext('Logout')
}
]
},
{
xtype: 'panel',
scrollable: 'y',
border: false,
region: 'west',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [{
xtype: 'navigationtree',
minWidth: 180,
reference: 'navtree',
// we have to define it here until extjs 6.2
// because of a bug where a viewcontroller does not detect
// the selectionchange event of a treelist
listeners: {
selectionchange: 'navigate'
}
}, {
xtype: 'box',
cls: 'x-treelist-nav',
flex: 1
}]
},
{
xtype: 'panel',
layout: { type: 'card' },
region: 'center',
border: false,
reference: 'contentpanel'
}
]
});