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
  80             layout: {
  81                 type: 'auto'
  82             },
  83
  84             title: gettext('Proxmox Backup Server Login'),
  85
  86             items: [
  87                 {
  88                     xtype: 'form',
  89                     layout: {
  90                         type: 'form'
  91                     },
  92                     defaultButton: 'loginButton',
  93                     url: '/api2/extjs/access/ticket',
  94                     reference: 'loginForm',
  95
  96                     fieldDefaults: {
  97                         labelAlign: 'right',
  98                         allowBlank: false
  99                     },
 100
 101                     items: [
 102                         {
 103                             xtype: 'textfield',
 104                             fieldLabel: gettext('User name'),
 105                             name: 'username',
 106                             itemId: 'usernameField',
 107                             reference: 'usernameField'
 108                         },
 109                         {
 110                             xtype: 'textfield',
 111                             inputType: 'password',
 112                             fieldLabel: gettext('Password'),
 113                             name: 'password',
 114                             reference: 'passwordField'
 115                         }
 116                     ],
 117                     buttons: [
 118                         {
 119                             text: gettext('Login'),
 120                             reference: 'loginButton',
 121                             formBind: true
 122                         }
 123                     ]
 124                 }
 125             ]
 126         }
 127     ]
 128 });