www/mobile/Login.js

   1 Ext.define('PVE.Login', {
   2     extend: 'Ext.form.Panel',
   3     alias: "widget.pveLogin",
   4     config: {
   5         title: 'Login',
   6         padding: 10,
   7         appUrl: 'login',
   8         items: [
   9             {
  10                 xtype: 'image',
  11                 src: '/pve2/images/proxmox_logo.png',
  12                 height: 30,
  13                 width: 209
  14             },
  15             {
  16                 xtype: 'fieldset',
  17                 title: 'Proxmox VE Login',
  18                 items: [
  19                     {
  20                         xtype: 'textfield',
  21                         placeHolder: gettext('User name'),
  22                         itemId: 'userNameTextField',
  23                         name: 'username',
  24                         required: true
  25                     },
  26                     {
  27                         xtype: 'passwordfield',
  28                         placeHolder: gettext('Password'),
  29                         itemId: 'passwordTextField',
  30                         name: 'password',
  31                         required: true
  32                     },
  33                     {
  34                         xtype: 'textfield',
  35                         itemId: 'otpField',
  36                         placeHolder: gettext('OTP'),
  37                         name: 'otp',
  38                         allowBlank: false,
  39                         hidden: true
  40                     },
  41                     {
  42                         xtype: 'pveRealmSelector',
  43                         itemId: 'realmSelectorField',
  44                         name: 'realm',
  45                         listeners: {
  46                             change: function(f, value) {
  47                                 var form = this.up('formpanel');
  48
  49                                 var otp_field = form.down('#otpField');
  50
  51                                 if (f.needOTP(value)) {
  52                                     otp_field.setHidden(false);
  53                                     otp_field.enable();
  54                                 } else {
  55                                     otp_field.setHidden(true);
  56                                     otp_field.disable();
  57                                 }
  58                             }
  59                         }
  60                     }
  61                 ]
  62             },
  63             {
  64                 xtype: 'label',
  65                 html: 'Login failed. Please enter the correct credentials.',
  66                 itemId: 'signInFailedLabel',
  67                 hidden: true,
  68                 hideAnimation: 'fadeOut',
  69                 showAnimation: 'fadeIn',
  70                 style: 'color:#990000;margin:5px 0px;'
  71             },
  72             {
  73                 xtype: 'button',
  74                 itemId: 'logInButton',
  75                 ui: 'action',
  76                 text: 'Log In',
  77                 handler: function() {
  78                     var form = this.up('formpanel');
  79
  80                     var usernameField = form.down('#userNameTextField'),
  81                     passwordField = form.down('#passwordTextField'),
  82                     realmField = form.down('#realmSelectorField'),
  83                     otpField = form.down('#otpField'),
  84                     label = form.down('#signInFailedLabel');
  85
  86                     label.hide();
  87
  88                     var username = usernameField.getValue();
  89                     var password = passwordField.getValue();
  90                     var realm = realmField.getValue();
  91                     var otp = otpField.getValue();
  92
  93                     PVE.Utils.API2Request({
  94                         url: '/access/ticket',
  95                         method: 'POST',
  96                         waitMsgTarget: form,
  97                         params: { username: username, password: password, realm: realm, otp: otp},
  98                         failure: function(response, options) {
  99                             label.show();
 100                         },
 101                         success: function(response, options) {
 102                             usernameField.setValue('');
 103                             passwordField.setValue('');
 104                             PVE.Workspace.updateLoginData(response.result.data);
 105                         }
 106                     });
 107                 }
 108             }
 109         ]
 110     }
 111 });