]> git.proxmox.com Git - proxmox-backup.git/commitdiff
gui: improve login view (use realms)
authorDietmar Maurer <dietmar@proxmox.com>
Thu, 9 Apr 2020 11:37:14 +0000 (13:37 +0200)
committerDietmar Maurer <dietmar@proxmox.com>
Thu, 9 Apr 2020 11:37:14 +0000 (13:37 +0200)
www/LoginView.js
www/Makefile
www/RealmComboBox.js [new file with mode: 0644]

index b00d169af10fa672dff3914a5ebb77423b30f0b0..6a03ab3ac85e55afe963b7b4f487799f473afc22 100644 (file)
@@ -9,31 +9,89 @@ Ext.define('PBS.LoginView', {
            var me = this;
            var view = me.getView();
            var loginForm = me.lookupReference('loginForm');
+           var unField = me.lookupReference('usernameField');
+           var saveunField = me.lookupReference('saveunField');
 
-           if (loginForm.isValid()) {
-               if (loginForm.isVisible()) {
-                   loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
-               }
-               loginForm.submit({
-                   success: function(form, action) {
-                       // save login data and create cookie
-                       PBS.Utils.updateLoginData(action.result.data);
-                       PBS.app.changeView('mainview');
-                   },
-                   failure: function(form, action) {
-                       loginForm.unmask();
-                       Ext.MessageBox.alert(
-                           gettext('Error'),
-                           gettext('Login failed. Please try again')
-                       );
-                   }
-               });
+           if (!loginForm.isValid()) {
+               return;
+           }
+
+           let params = loginForm.getValues();
+
+           params.username = params.username + '@' + params.realm;
+           delete(params.realm);
+
+           if (loginForm.isVisible()) {
+               loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
            }
+
+           // set or clear username
+           var sp = Ext.state.Manager.getProvider();
+           if (saveunField.getValue() === true) {
+               sp.set(unField.getStateId(), unField.getValue());
+           } else {
+               sp.clear(unField.getStateId());
+           }
+           sp.set(saveunField.getStateId(), saveunField.getValue());
+
+           Proxmox.Utils.API2Request({
+               url: '/api2/extjs/access/ticket',
+               params: params,
+               method: 'POST',
+               success: function(resp, opts) {
+                   // save login data and create cookie
+                   PBS.Utils.updateLoginData(resp.result.data);
+                   PBS.app.changeView('mainview');
+               },
+               failure: function(resp, opts) {
+                   Proxmox.Utils.authClear();
+                   loginForm.unmask();
+                   Ext.MessageBox.alert(
+                       gettext('Error'),
+                       gettext('Login failed. Please try again')
+                   );
+               }
+           });
        },
 
        control: {
+           'field[name=username]': {
+               specialkey: function(f, e) {
+                   if (e.getKey() === e.ENTER) {
+                       var pf = this.lookupReference('passwordField');
+                       if (!pf.getValue()) {
+                           pf.focus(false);
+                       }
+                   }
+               }
+           },
+           'field[name=lang]': {
+               change: function(f, value) {
+                   var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
+                   Ext.util.Cookies.set('PBSLangCookie', value, dt);
+                   this.getView().mask(gettext('Please wait...'), 'x-mask-loading');
+                   window.location.reload();
+               }
+           },
            'button[reference=loginButton]': {
                click: 'submitForm'
+           },
+           'window[reference=loginwindow]': {
+               show: function() {
+                   var sp = Ext.state.Manager.getProvider();
+                   var checkboxField = this.lookupReference('saveunField');
+                   var unField = this.lookupReference('usernameField');
+
+                   var checked = sp.get(checkboxField.getStateId());
+                   checkboxField.setValue(checked);
+
+                   if(checked === true) {
+                       var username = sp.get(unField.getStateId());
+                       unField.setValue(username);
+                       var pwField = this.lookupReference('passwordField');
+                       pwField.focus();
+                   }
+               }
            }
        }
     },
@@ -74,11 +132,9 @@ Ext.define('PBS.LoginView', {
            reference: 'loginwindow',
            autoShow: true,
            modal: true,
+           width: 400,
 
-           //defaultFocus: 'usernameField',
-           // TODO: use usernameField again once we have a real user-,
-           // permission system and root@pam isn't the default anymore
-           defaultFocus: 'passwordField',
+           defaultFocus: 'usernameField',
 
            layout: {
                type: 'auto'
@@ -102,13 +158,17 @@ Ext.define('PBS.LoginView', {
                    },
 
                    items: [
+                       {
+                           xtype: 'pbsRealmComboBox',
+                           name: 'realm'
+                       },
                        {
                            xtype: 'textfield',
                            fieldLabel: gettext('User name'),
                            name: 'username',
-                           value: 'root@pam',
                            itemId: 'usernameField',
-                           reference: 'usernameField'
+                           reference: 'usernameField',
+                           stateId: 'login-username'
                        },
                        {
                            xtype: 'textfield',
@@ -117,9 +177,27 @@ Ext.define('PBS.LoginView', {
                            name: 'password',
                            itemId: 'passwordField',
                            reference: 'passwordField',
+                       },
+                       {
+                           xtype: 'proxmoxLanguageSelector',
+                           fieldLabel: gettext('Language'),
+                           value: Ext.util.Cookies.get('PBSLangCookie') || Proxmox.defaultLang || 'en',
+                           name: 'lang',
+                           reference: 'langField',
+                           submitValue: false
                        }
                    ],
                    buttons: [
+                       {
+                           xtype: 'checkbox',
+                           fieldLabel: gettext('Save User name'),
+                           name: 'saveusername',
+                           reference: 'saveunField',
+                           stateId: 'login-saveusername',
+                           labelWidth: 250,
+                           labelAlign: 'right',
+                           submitValue: false
+                       },
                        {
                            text: gettext('Login'),
                            reference: 'loginButton',
index 506e9b674fdbbf7055fcad46f2951ef45f14899c..4c1efccb247741aa97ad4ef356cc1fc246019b28 100644 (file)
@@ -7,6 +7,7 @@ IMAGES := \
 JSSRC=                                                 \
        Utils.js                                        \
        Logo.js                                         \
+       RealmComboBox.js                                \
        LoginView.js                                    \
        VersionInfo.js                                  \
        SystemConfiguration.js                          \
diff --git a/www/RealmComboBox.js b/www/RealmComboBox.js
new file mode 100644 (file)
index 0000000..001b1d7
--- /dev/null
@@ -0,0 +1,67 @@
+Ext.define('pbs-domains', {
+    extend: "Ext.data.Model",
+    fields: [ 'realm', 'comment', 'default' ],
+    idProperty: 'realm',
+    proxy: {
+       type: 'proxmox',
+       url: "/api2/json/access/domains"
+    }
+});
+
+Ext.define('PBS.form.RealmComboBox', {
+    extend: 'Ext.form.field.ComboBox',
+    alias: ['widget.pbsRealmComboBox'],
+
+    controller: {
+       xclass: 'Ext.app.ViewController',
+
+       init: function(view) {
+           view.store.on('load', this.onLoad, view);
+       },
+
+       onLoad: function(store, records, success) {
+           if (!success) {
+               return;
+           }
+           var me = this;
+           var val = me.getValue();
+           if (!val || !me.store.findRecord('realm', val)) {
+               var def = 'pam';
+               Ext.each(records, function(rec) {
+                   if (rec.data && rec.data['default']) {
+                       def = rec.data.realm;
+                   }
+               });
+               me.setValue(def);
+           }
+       }
+    },
+
+    fieldLabel: gettext('Realm'),
+    name: 'realm',
+    queryMode: 'local',
+    allowBlank: false,
+    editable: false,
+    forceSelection: true,
+    autoSelect: false,
+    triggerAction: 'all',
+    valueField: 'realm',
+    displayField: 'comment',
+    getState: function() {
+       return { value: this.getValue() };
+    },
+    applyState : function(state) {
+       if (state && state.value) {
+           this.setValue(state.value);
+       }
+    },
+    stateEvents: [ 'select' ],
+    stateful: true, // last chosen auth realm is saved between page reloads
+    id: 'pbsloginrealm', // We need stable ids when using stateful, not autogenerated
+    stateID: 'pbsloginrealm',
+
+    store: {
+       model: 'pbs-domains',
+       autoLoad: true
+    }
+});