subscription: remove hard-coded white background

[pmg-gui.git] / js / MainView.js

diff --git a/js/MainView.js b/js/MainView.js
index 7a05776c5787c87d4e07ad82f7858373a0b860b2..2cc140c1eceba870da226d25980638f8df322d2f 100644 (file)
--- a/js/MainView.js
+++ b/js/MainView.js
@@ -17,8 +17,14 @@ Ext.define('PMG.MainView', {
            },
        },
 
-       beforeChangePath: function(path, subpath, action) {
-           var me = this;
+       beforeChangePath: function(path, subpathOrAction, action) {
+           let me = this;
+
+           let subpath = subpathOrAction;
+           if (!action) {
+               action = subpathOrAction;
+               subpath = undefined;
+           }
 
            if (!Ext.ClassManager.getByAlias('widget.'+ path)) {
                console.warn('xtype "'+path+'" not found');
@@ -26,7 +32,7 @@ Ext.define('PMG.MainView', {
                return;
            }
 
-           var lastpanel = me.lookupReference('contentpanel').getLayout().getActiveItem();
+           let 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
@@ -48,12 +54,12 @@ Ext.define('PMG.MainView', {
        },
 
        changePath: function(path, subpath) {
-           var me = this;
-           var contentpanel = me.lookupReference('contentpanel');
-           var lastpanel = contentpanel.getLayout().getActiveItem();
+           let me = this;
+           let contentpanel = me.lookupReference('contentpanel');
+           let lastpanel = contentpanel.getLayout().getActiveItem();
 
-           var obj = contentpanel.add({ xtype: path });
-           var treelist = me.lookupReference('navtree');
+           let obj = contentpanel.add({ xtype: path });
+           let treelist = me.lookupReference('navtree');
 
            treelist.suspendEvents();
            treelist.select(path);
@@ -62,7 +68,7 @@ Ext.define('PMG.MainView', {
            if (Ext.isFunction(obj.setActiveTab)) {
                obj.setActiveTab(subpath || 0);
                obj.addListener('tabchange', function(tabpanel, newc, oldc) {
-                   var newpath = path;
+                   let newpath = path;
 
                    // only add the subpath part for the
                    // non-default tabs
@@ -105,7 +111,7 @@ Ext.define('PMG.MainView', {
        },
 
        init: function(view) {
-           var me = this;
+           let me = this;
 
            // load username
            me.lookupReference('usernameinfo').setText(Proxmox.UserName);
@@ -113,7 +119,7 @@ Ext.define('PMG.MainView', {
            // show login on requestexception
            // fixme: what about other errors
            Ext.Ajax.on('requestexception', function(conn, response, options) {
-               if (response.status == 401) { // auth failure
+               if (response.status === 401) { // auth failure
                    me.logout();
                }
            });
@@ -121,7 +127,7 @@ Ext.define('PMG.MainView', {
            // get ticket periodically
            Ext.TaskManager.start({
                run: function() {
-                   var ticket = Proxmox.Utils.authOK();
+                   let ticket = Proxmox.Utils.authOK();
                    if (!ticket || !Proxmox.UserName) {
                        return;
                    }
@@ -137,7 +143,7 @@ Ext.define('PMG.MainView', {
                            me.logout();
                        },
                        success: function(response, opts) {
-                           var obj = Ext.decode(response.responseText);
+                           let obj = Ext.decode(response.responseText);
                            PMG.Utils.updateLoginData(obj.data);
                        },
                    });
@@ -146,8 +152,8 @@ Ext.define('PMG.MainView', {
            });
 
            // select treeitem and load page from url fragment
-           var token = Ext.util.History.getToken() || 'pmgDashboard';
-           this.redirectTo(token, true);
+           let token = Ext.util.History.getToken() || 'pmgDashboard';
+           this.redirectTo(token, { force: true });
        },
     },
 
@@ -197,6 +203,19 @@ Ext.define('PMG.MainView', {
                    margin: '0 5 0 0',
                    iconCls: 'fa fa-user',
                    menu: [
+                       {
+                           iconCls: 'fa fa-gear',
+                           text: gettext('My Settings'),
+                           handler: () => Ext.create('PMG.window.Settings').show(),
+                       },
+                       {
+                           iconCls: 'fa fa-paint-brush',
+                           text: gettext('Theme'),
+                           handler: () => Ext.create('Proxmox.window.ThemeEditWindow', {
+                               cookieName: 'PMGThemeCookie',
+                               autoShow: true,
+                           }),
+                       },
                        {
                            iconCls: 'fa fa-language',
                            text: gettext('Language'),
@@ -221,21 +240,23 @@ Ext.define('PMG.MainView', {
                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',
+           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-pve-nav',
+                   flex: 1,
                },
-           }, {
-               xtype: 'box',
-               cls: 'x-treelist-nav',
-               flex: 1,
-           }],
+           ],
        },
        {
            xtype: 'panel',