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                             this.onLogon();
  58                         } else {
  59                             pf.focus(false);
  60                         }
  61                     }
  62                 }
  63             },
  64             'field[name=password]': {
  65                 specialkey: function(f, e) {
  66                     if (e.getKey() === e.ENTER) {
  67                         this.onLogon();
  68                     }
  69                 }
  70             },
  71             'field[name=realm]': {
  72                 change: function(f, value) {
  73                     var otp_field = this.lookupReference('otpField');
  74                     if (f.needOTP(value)) {
  75                         otp_field.setVisible(true);
  76                         otp_field.setDisabled(false);
  77                     } else {
  78                         otp_field.setVisible(false);
  79                         otp_field.setDisabled(true);
  80                     }
  81                 }
  82             },
  83             'field[name=lang]': {
  84                 change: function(f, value) {
  85                     var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
  86                     Ext.util.Cookies.set('PVELangCookie', value, dt);
  87                     this.getView().mask(gettext('Please wait...'), 'x-mask-loading');
  88                     window.location.reload();
  89                 }
  90             },
  91             'button[reference=loginButton]': {
  92                 click: 'onLogon'
  93             },
  94             '#': {
  95                 show: function() {
  96                     var sp = Ext.state.Manager.getProvider();
  97                     var checkboxField = this.lookupReference('saveunField');
  98                     var unField = this.lookupReference('usernameField');
  99
 100                     var checked = sp.get(checkboxField.getStateId());
 101                     checkboxField.setValue(checked);
 102
 103                     if(checked === true) {
 104                         var username = sp.get(unField.getStateId());
 105                         console.log(username);
 106                         unField.setValue(username);
 107                         var pwField = this.lookupReference('passwordField');
 108                         pwField.focus();
 109                     }
 110                 }
 111             }
 112         }
 113     },
 114
 115     width: 400,
 116
 117     modal: true,
 118
 119     border: false,
 120
 121     draggable: true,
 122
 123     closable: false,
 124
 125     resizable: false,
 126
 127     layout: 'auto',
 128
 129     title: gettext('Proxmox VE Login'),
 130
 131     defaultFocus: 'usernameField',
 132
 133     items: [{
 134         xtype: 'form',
 135         layout: 'form',
 136         url: '/api2/extjs/access/ticket',
 137         reference: 'loginForm',
 138
 139         fieldDefaults: {
 140             labelAlign: 'right',
 141             allowBlank: false
 142         },
 143
 144         items: [
 145             {
 146                 xtype: 'textfield',
 147                 fieldLabel: gettext('User name'),
 148                 name: 'username',
 149                 itemId: 'usernameField',
 150                 reference: 'usernameField',
 151                 stateId: 'login-username',
 152                 blankText: gettext("Enter your user name")
 153             },
 154             {
 155                 xtype: 'textfield',
 156                 inputType: 'password',
 157                 fieldLabel: gettext('Password'),
 158                 name: 'password',
 159                 reference: 'passwordField',
 160                 blankText: gettext("Enter your password")
 161             },
 162             {
 163                 xtype: 'textfield',
 164                 fieldLabel: gettext('OTP'),
 165                 name: 'otp',
 166                 reference: 'otpField',
 167                 allowBlank: false,
 168                 hidden: true
 169             },
 170             {
 171                 xtype: 'pveRealmComboBox',
 172                 name: 'realm'
 173             },
 174             {
 175                 xtype: 'pveLanguageSelector',
 176                 fieldLabel: gettext('Language'),
 177                 value: Ext.util.Cookies.get('PVELangCookie') || 'en',
 178                 name: 'lang',
 179                 reference: 'langField',
 180                 submitValue: false
 181             }
 182         ],
 183         buttons: [
 184             {
 185                 xtype: 'checkbox',
 186                 fieldLabel: gettext('Save User name'),
 187                 name: 'saveusername',
 188                 reference: 'saveunField',
 189                 stateId: 'login-saveusername',
 190                 labelWidth: 'auto',
 191                 labelAlign: 'right',
 192                 submitValue: false
 193             },
 194             {
 195                 text: gettext('Login'),
 196                 reference: 'loginButton'
 197             }
 198         ]
 199     }]
 200  });