www/manager6/window/LoginWindow.js

   1 Ext.define('PVE.window.LoginWindow', {
   2     extend: 'Ext.window.Window',
   3
   4     controller: {
   5
   6         xclass: 'Ext.app.ViewController',
   7
   8         onLogon: function() {
   9             var me = this;
  10
  11             var form = this.lookupReference('loginForm');
  12             var unField = this.lookupReference('usernameField');
  13             var saveunField = this.lookupReference('saveunField');
  14             var view = this.getView();
  15
  16             if(form.isValid()){
  17                 view.el.mask(gettext('Please wait...'), 'x-mask-loading');
  18
  19                 // set or clear username
  20                 var sp = Ext.state.Manager.getProvider();
  21                 if (saveunField.getValue() === true) {
  22                     sp.set(unField.getStateId(), unField.getValue());
  23                 } else {
  24                     sp.clear(unField.getStateId());
  25                 }
  26                 sp.set(saveunField.getStateId(), saveunField.getValue());
  27
  28                 form.submit({
  29                     failure: function(f, resp){
  30                         view.el.unmask();
  31                         var handler = function() {
  32                             var uf = me.lookupReference('usernameField');
  33                             uf.focus(true, true);
  34                         };
  35
  36                         Ext.MessageBox.alert(gettext('Error'),
  37                                              gettext("Login failed. Please try again"),
  38                                              handler);
  39                     },
  40                     success: function(f, resp){
  41                         view.el.unmask();
  42
  43                         var handler = view.handler || Ext.emptyFn;
  44                         handler.call(me, resp.result.data);
  45                         view.close();
  46                     }
  47                 });
  48             }
  49         },
  50
  51         control: {
  52             'field[name=username]': {
  53                 specialkey: function(f, e) {
  54                     if (e.getKey() === e.ENTER) {
  55                         var pf = this.lookupReference('passwordField');
  56                         if (!pf.getValue()) {
  57                             pf.focus(false);
  58                         }
  59                     }
  60                 }
  61             },
  62             'field[name=realm]': {
  63                 change: function(f, value) {
  64                     var otp_field = this.lookupReference('otpField');
  65                     if (f.needOTP(value)) {
  66                         otp_field.setVisible(true);
  67                         otp_field.setDisabled(false);
  68                     } else {
  69                         otp_field.setVisible(false);
  70                         otp_field.setDisabled(true);
  71                     }
  72                 }
  73             },
  74             'field[name=lang]': {
  75                 change: function(f, value) {
  76                     var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
  77                     Ext.util.Cookies.set('PVELangCookie', value, dt);
  78                     this.getView().mask(gettext('Please wait...'), 'x-mask-loading');
  79                     window.location.reload();
  80                 }
  81             },
  82             'button[reference=loginButton]': {
  83                 click: 'onLogon'
  84             },
  85             '#': {
  86                 show: function() {
  87                     var sp = Ext.state.Manager.getProvider();
  88                     var checkboxField = this.lookupReference('saveunField');
  89                     var unField = this.lookupReference('usernameField');
  90
  91                     var checked = sp.get(checkboxField.getStateId());
  92                     checkboxField.setValue(checked);
  93
  94                     if(checked === true) {
  95                         var username = sp.get(unField.getStateId());
  96                         unField.setValue(username);
  97                         var pwField = this.lookupReference('passwordField');
  98                         pwField.focus();
  99                     }
 100                 }
 101             }
 102         }
 103     },
 104
 105     width: 400,
 106
 107     modal: true,
 108
 109     border: false,
 110
 111     draggable: true,
 112
 113     closable: false,
 114
 115     resizable: false,
 116
 117     layout: 'auto',
 118
 119     title: gettext('Proxmox VE Login'),
 120
 121     defaultFocus: 'usernameField',
 122
 123     defaultButton: 'loginButton',
 124
 125     items: [{
 126         xtype: 'form',
 127         layout: 'form',
 128         url: '/api2/extjs/access/ticket',
 129         reference: 'loginForm',
 130
 131         fieldDefaults: {
 132             labelAlign: 'right',
 133             allowBlank: false
 134         },
 135
 136         items: [
 137             {
 138                 xtype: 'textfield',
 139                 fieldLabel: gettext('User name'),
 140                 name: 'username',
 141                 itemId: 'usernameField',
 142                 reference: 'usernameField',
 143                 stateId: 'login-username'
 144             },
 145             {
 146                 xtype: 'textfield',
 147                 inputType: 'password',
 148                 fieldLabel: gettext('Password'),
 149                 name: 'password',
 150                 reference: 'passwordField'
 151             },
 152             {
 153                 xtype: 'textfield',
 154                 fieldLabel: gettext('OTP'),
 155                 name: 'otp',
 156                 reference: 'otpField',
 157                 allowBlank: false,
 158                 hidden: true
 159             },
 160             {
 161                 xtype: 'pveRealmComboBox',
 162                 name: 'realm'
 163             },
 164             {
 165                 xtype: 'proxmoxLanguageSelector',
 166                 fieldLabel: gettext('Language'),
 167                 value: Ext.util.Cookies.get('PVELangCookie') || 'en',
 168                 name: 'lang',
 169                 reference: 'langField',
 170                 submitValue: false
 171             }
 172         ],
 173         buttons: [
 174             {
 175                 xtype: 'checkbox',
 176                 fieldLabel: gettext('Save User name'),
 177                 name: 'saveusername',
 178                 reference: 'saveunField',
 179                 stateId: 'login-saveusername',
 180                 labelWidth: 'auto',
 181                 labelAlign: 'right',
 182                 submitValue: false
 183             },
 184             {
 185                 text: gettext('Login'),
 186                 reference: 'loginButton'
 187             }
 188         ]
 189     }]
 190  });