www/LoginView.js

   1 Ext.define('PBS.LoginView', {
   2     extend: 'Ext.container.Container',
   3     xtype: 'loginview',
   4
   5     controller: {
   6         xclass: 'Ext.app.ViewController',
   7
   8         submitForm: function() {
   9             var me = this;
  10             var view = me.getView();
  11             var loginForm = me.lookupReference('loginForm');
  12
  13             if (loginForm.isValid()) {
  14                 if (loginForm.isVisible()) {
  15                     loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
  16                 }
  17                 loginForm.submit({
  18                     success: function(form, action) {
  19                         // save login data and create cookie
  20                         PBS.Utils.updateLoginData(action.result.data);
  21                         PBS.app.changeView('mainview');
  22                     },
  23                     failure: function(form, action) {
  24                         loginForm.unmask();
  25                         Ext.MessageBox.alert(
  26                             gettext('Error'),
  27                             gettext('Login failed. Please try again')
  28                         );
  29                     }
  30                 });
  31             }
  32         },
  33
  34         control: {
  35             'button[reference=loginButton]': {
  36                 click: 'submitForm'
  37             }
  38         }
  39     },
  40
  41     plugins: 'viewport',
  42
  43     layout: {
  44         type: 'border'
  45     },
  46
  47     items: [
  48         {
  49             region: 'north',
  50             xtype: 'container',
  51             layout: {
  52                 type: 'hbox',
  53                 align: 'middle'
  54             },
  55             margin: '2 5 2 5',
  56             height: 38,
  57             items: [
  58                 {
  59                     xtype: 'proxmoxlogo'
  60                 },
  61                 {
  62                     xtype: 'versioninfo',
  63                     makeApiCall: false
  64                 }
  65             ]
  66         },
  67         {
  68             region: 'center'
  69         },
  70         {
  71             xtype: 'window',
  72             closable: false,
  73             resizable: false,
  74             reference: 'loginwindow',
  75             autoShow: true,
  76             modal: true,
  77
  78             //defaultFocus: 'usernameField',
  79             // TODO: use usernameField again once we have a real user-,
  80             // permission system and root@pam isn't the default anymore
  81             defaultFocus: 'passwordField',
  82
  83             layout: {
  84                 type: 'auto'
  85             },
  86
  87             title: gettext('Proxmox Backup Server Login'),
  88
  89             items: [
  90                 {
  91                     xtype: 'form',
  92                     layout: {
  93                         type: 'form'
  94                     },
  95                     defaultButton: 'loginButton',
  96                     url: '/api2/extjs/access/ticket',
  97                     reference: 'loginForm',
  98
  99                     fieldDefaults: {
 100                         labelAlign: 'right',
 101                         allowBlank: false
 102                     },
 103
 104                     items: [
 105                         {
 106                             xtype: 'textfield',
 107                             fieldLabel: gettext('User name'),
 108                             name: 'username',
 109                             value: 'root@pam',
 110                             itemId: 'usernameField',
 111                             reference: 'usernameField'
 112                         },
 113                         {
 114                             xtype: 'textfield',
 115                             inputType: 'password',
 116                             fieldLabel: gettext('Password'),
 117                             name: 'password',
 118                             itemId: 'passwordField',
 119                             reference: 'passwordField',
 120                         }
 121                     ],
 122                     buttons: [
 123                         {
 124                             text: gettext('Login'),
 125                             reference: 'loginButton',
 126                             formBind: true
 127                         }
 128                     ]
 129                 }
 130             ]
 131         }
 132     ]
 133 });