From f17fb5f1c8e844b7f50b23b57119d2c73a5b7506 Mon Sep 17 00:00:00 2001 From: Dominik Csapak Date: Mon, 24 Oct 2016 13:54:01 +0200 Subject: [PATCH] add 'my settings' to top bar this adds a menu right to the username with an entry 'my settings', this opens a window with (for now) browser specific settings and a place to reset them the plan would be to add password change, 2fa setup etc here one remark: the reset layout button reloads the window, to really apply the reset Signed-off-by: Dominik Csapak --- www/css/ext6-pve.css | 5 ++ www/manager6/Makefile | 1 + www/manager6/Workspace.js | 18 ++++- www/manager6/window/Settings.js | 122 ++++++++++++++++++++++++++++++++ 4 files changed, 145 insertions(+), 1 deletion(-) create mode 100644 www/manager6/window/Settings.js diff --git a/www/css/ext6-pve.css b/www/css/ext6-pve.css index c050aca6f..172c667ad 100644 --- a/www/css/ext6-pve.css +++ b/www/css/ext6-pve.css @@ -431,3 +431,8 @@ div.right-aligned { .x-treelist-row-over > * > .x-treelist-item-text{ color: #000; } + +/* some icons have to be color manually */ +.black { + color: #000; +} diff --git a/www/manager6/Makefile b/www/manager6/Makefile index 800586746..06fbd454d 100644 --- a/www/manager6/Makefile +++ b/www/manager6/Makefile @@ -86,6 +86,7 @@ JSSRC= \ window/Restore.js \ window/SafeDestroy.js \ window/BackupConfig.js \ + window/Settings.js \ panel/NotesView.js \ grid/SelectFeature.js \ grid/ObjectGrid.js \ diff --git a/www/manager6/Workspace.js b/www/manager6/Workspace.js index 4769d660d..87d363329 100644 --- a/www/manager6/Workspace.js +++ b/www/manager6/Workspace.js @@ -396,10 +396,26 @@ Ext.define('PVE.StdWorkspace', { }, { pack: 'end', - margin: '0 10 0 0', id: 'userinfo', stateful: false }, + { + xtype: 'button', + margin: '0 10 0 0', + iconCls: 'fa black fa-caret-down', + menuAlign: 'tr-br?', + menu: { + showSeparator: false, + items: [{ + text: gettext('My Settings'), + iconCls: 'fa fa-fw fa-gear', + handler: function() { + var win = Ext.create('PVE.window.Settings'); + win.show(); + } + }] + } + }, { xtype: 'pveHelpButton', hidden: false, diff --git a/www/manager6/window/Settings.js b/www/manager6/window/Settings.js new file mode 100644 index 000000000..d7b37e37e --- /dev/null +++ b/www/manager6/window/Settings.js @@ -0,0 +1,122 @@ +Ext.define('PVE.window.Settings', { + extend: 'Ext.window.Window', + + width: '400px', + title: gettext('My Settings'), + iconCls: 'fa fa-gear', + modal: true, + bodyPadding: 10, + resizable: false, + + buttons: [{ + text: gettext('Close'), + handler: function() { + this.up('window').close(); + } + }], + + layout: { + type: 'vbox', + align: 'center' + }, + + controller: { + xclass: 'Ext.app.ViewController', + + control: { + '#': { + show: function() { + var me = this; + var sp = Ext.state.Manager.getProvider(); + + var username = sp.get('login-username') || PVE.Utils.noneText; + me.lookupReference('savedUserName').setValue(username); + } + }, + 'button[name=reset]': { + click: function () { + var blacklist = ['GuiCap', 'login-username']; + var sp = Ext.state.Manager.getProvider(); + var state; + for (state in sp.state) { + if (sp.state.hasOwnProperty(state)) { + if (blacklist.indexOf(state) !== -1) { + continue; + } + + sp.clear(state); + } + } + + window.location.reload(); + } + }, + 'button[name=clear-username]': { + click: function () { + var me = this; + var usernamefield = me.lookupReference('savedUserName'); + var sp = Ext.state.Manager.getProvider(); + + usernamefield.setValue(PVE.Utils.noneText); + sp.clear('login-username'); + } + } + } + }, + + items: [{ + xtype: 'fieldset', + width: '90%', + title: gettext('Browser Settings'), + layout: { + type: 'vbox', + align: 'right' + }, + defaults: { + width: '100%', + margin: '0 0 10 0' + }, + items: [ + { + xtype: 'displayfield', + fieldLabel: gettext('Saved User name'), + labelAlign: 'left', + labelWidth: '50%', + fieldStyle: { + 'text-align':'right' + }, + stateId: 'login-username', + reference: 'savedUserName', + value: '' + }, + { + xtype: 'button', + text: gettext('Clear User name'), + width: 'auto', + name: 'clear-username' + }, + { + xtype: 'box', + autoEl: { tag: 'hr'} + }, + { + xtype: 'displayfield', + fieldLabel: gettext('Layout'), + labelAlign: 'left', + labelWidth: '50%' + }, + { + xtype: 'button', + text: gettext('Reset Layout'), + width: 'auto', + name: 'reset' + } + ] + }], + + onShow: function() { + var me = this; + me.callParent(); + + } +});