www/manager6/window/LoginWindow.js

   1 /*global u2f*/
   2 Ext.define('PVE.window.LoginWindow', {
   3     extend: 'Ext.window.Window',
   4
   5     controller: {
   6
   7         xclass: 'Ext.app.ViewController',
   8
   9         onLogon: function() {
  10             var me = this;
  11
  12             var form = this.lookupReference('loginForm');
  13             var unField = this.lookupReference('usernameField');
  14             var saveunField = this.lookupReference('saveunField');
  15             var view = this.getView();
  16
  17             if (!form.isValid()) {
  18                 return;
  19             }
  20
  21             view.el.mask(gettext('Please wait...'), 'x-mask-loading');
  22
  23             // set or clear username
  24             var sp = Ext.state.Manager.getProvider();
  25             if (saveunField.getValue() === true) {
  26                 sp.set(unField.getStateId(), unField.getValue());
  27             } else {
  28                 sp.clear(unField.getStateId());
  29             }
  30             sp.set(saveunField.getStateId(), saveunField.getValue());
  31
  32             form.submit({
  33                 failure: function(f, resp){
  34                     me.failure(resp);
  35                 },
  36                 success: function(f, resp){
  37                     view.el.unmask();
  38
  39                     var data = resp.result.data;
  40                     if (Ext.isDefined(data.U2FChallenge)) {
  41                         me.perform_u2f(data);
  42                     } else {
  43                         me.success(data);
  44                     }
  45                 }
  46             });
  47
  48         },
  49         failure: function(resp) {
  50             var me = this;
  51             var view = me.getView();
  52             view.el.unmask();
  53             var handler = function() {
  54                 var uf = me.lookupReference('usernameField');
  55                 uf.focus(true, true);
  56             };
  57
  58             Ext.MessageBox.alert(gettext('Error'),
  59                                  gettext("Login failed. Please try again"),
  60                                  handler);
  61         },
  62         success: function(data) {
  63             var me = this;
  64             var view = me.getView();
  65             var handler = view.handler || Ext.emptyFn;
  66             handler.call(me, data);
  67             view.close();
  68         },
  69
  70         perform_u2f: function(data) {
  71             var me = this;
  72             // Store first factor login information first:
  73             data.LoggedOut = true;
  74             Proxmox.Utils.setAuthData(data);
  75             // Show the message:
  76             var msg = Ext.Msg.show({
  77                 title: 'U2F: '+gettext('Verification'),
  78                 message: gettext('Please press the button on your U2F Device'),
  79                 buttons: []
  80             });
  81             var chlg = data.U2FChallenge;
  82             var key = {
  83                 version: chlg.version,
  84                 keyHandle: chlg.keyHandle
  85             };
  86             u2f.sign(chlg.appId, chlg.challenge, [key], function(res) {
  87                 msg.close();
  88                 if (res.errorCode) {
  89                     Proxmox.Utils.authClear();
  90                     Ext.Msg.alert(gettext('Error'), "U2F Error: "+res.errorCode);
  91                     return;
  92                 }
  93                 delete res.errorCode;
  94                 me.finish_u2f(res);
  95             });
  96         },
  97         finish_u2f: function(res) {
  98             var me = this;
  99             var view = me.getView();
 100             view.el.mask(gettext('Please wait...'), 'x-mask-loading');
 101             var params = { response: JSON.stringify(res) };
 102             Proxmox.Utils.API2Request({
 103                 url: '/api2/extjs/access/tfa',
 104                 params: params,
 105                 method: 'POST',
 106                 timeout: 5000, // it'll delay both success & failure
 107                 success: function(resp, opts) {
 108                     view.el.unmask();
 109                     // Fill in what we copy over from the 1st factor:
 110                     var data = resp.result.data;
 111                     data.CSRFPreventionToken = Proxmox.CSRFPreventionToken;
 112                     data.username = Proxmox.UserName;
 113                     // Finish logging in:
 114                     me.success(data);
 115                 },
 116                 failure: function(resp, opts) {
 117                     Proxmox.Utils.authClear();
 118                     me.failure(resp);
 119                 }
 120             });
 121         },
 122
 123         control: {
 124             'field[name=username]': {
 125                 specialkey: function(f, e) {
 126                     if (e.getKey() === e.ENTER) {
 127                         var pf = this.lookupReference('passwordField');
 128                         if (!pf.getValue()) {
 129                             pf.focus(false);
 130                         }
 131                     }
 132                 }
 133             },
 134             'field[name=realm]': {
 135                 change: function(f, value) {
 136                     var otp_field = this.lookupReference('otpField');
 137                     if (f.needOTP(value)) {
 138                         otp_field.setConfig('allowBlank', false);
 139                         otp_field.setEmptyText(gettext('2nd factor'));
 140                     } else {
 141                         otp_field.setConfig('allowBlank', true);
 142                         otp_field.setEmptyText(gettext('2nd factor, if required'));
 143                     }
 144                     otp_field.validate();
 145                 }
 146             },
 147             'field[name=lang]': {
 148                 change: function(f, value) {
 149                     var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
 150                     Ext.util.Cookies.set('PVELangCookie', value, dt);
 151                     this.getView().mask(gettext('Please wait...'), 'x-mask-loading');
 152                     window.location.reload();
 153                 }
 154             },
 155             'button[reference=loginButton]': {
 156                 click: 'onLogon'
 157             },
 158             '#': {
 159                 show: function() {
 160                     var sp = Ext.state.Manager.getProvider();
 161                     var checkboxField = this.lookupReference('saveunField');
 162                     var unField = this.lookupReference('usernameField');
 163
 164                     var checked = sp.get(checkboxField.getStateId());
 165                     checkboxField.setValue(checked);
 166
 167                     if(checked === true) {
 168                         var username = sp.get(unField.getStateId());
 169                         unField.setValue(username);
 170                         var pwField = this.lookupReference('passwordField');
 171                         pwField.focus();
 172                     }
 173                 }
 174             }
 175         }
 176     },
 177
 178     width: 400,
 179
 180     modal: true,
 181
 182     border: false,
 183
 184     draggable: true,
 185
 186     closable: false,
 187
 188     resizable: false,
 189
 190     layout: 'auto',
 191
 192     title: gettext('Proxmox VE Login'),
 193
 194     defaultFocus: 'usernameField',
 195
 196     defaultButton: 'loginButton',
 197
 198     items: [{
 199         xtype: 'form',
 200         layout: 'form',
 201         url: '/api2/extjs/access/ticket',
 202         reference: 'loginForm',
 203
 204         fieldDefaults: {
 205             labelAlign: 'right',
 206             allowBlank: false
 207         },
 208
 209         items: [
 210             {
 211                 xtype: 'textfield',
 212                 fieldLabel: gettext('User name'),
 213                 name: 'username',
 214                 itemId: 'usernameField',
 215                 reference: 'usernameField',
 216                 stateId: 'login-username'
 217             },
 218             {
 219                 xtype: 'textfield',
 220                 inputType: 'password',
 221                 fieldLabel: gettext('Password'),
 222                 name: 'password',
 223                 reference: 'passwordField'
 224             },
 225             {
 226                 xtype: 'textfield',
 227                 fieldLabel: gettext('OTP'),
 228                 name: 'otp',
 229                 reference: 'otpField',
 230                 allowBlank: true,
 231                 emptyText: gettext('2nd factor, if required')
 232             },
 233             {
 234                 xtype: 'pveRealmComboBox',
 235                 name: 'realm'
 236             },
 237             {
 238                 xtype: 'proxmoxLanguageSelector',
 239                 fieldLabel: gettext('Language'),
 240                 value: Ext.util.Cookies.get('PVELangCookie') || Proxmox.defaultLang || 'en',
 241                 name: 'lang',
 242                 reference: 'langField',
 243                 submitValue: false
 244             }
 245         ],
 246         buttons: [
 247             {
 248                 xtype: 'checkbox',
 249                 fieldLabel: gettext('Save User name'),
 250                 name: 'saveusername',
 251                 reference: 'saveunField',
 252                 stateId: 'login-saveusername',
 253                 labelWidth: 'auto',
 254                 labelAlign: 'right',
 255                 submitValue: false
 256             },
 257             {
 258                 text: gettext('Login'),
 259                 reference: 'loginButton'
 260             }
 261         ]
 262     }]
 263  });