js/LoginView.js

   1 /*global Proxmox*/
   2 Ext.define('PMG.form.RealmComboBox', {
   3     extend: 'Proxmox.form.KVComboBox',
   4     xtype: 'pmgRealmComboBox',
   5
   6     getState: function() {
   7         return { value: this.getValue() };
   8     },
   9     applyState : function(state) {
  10         if (state && state.value) {
  11             this.setValue(state.value);
  12         }
  13     },
  14     stateEvents: [ 'select' ],
  15     stateful: true, // last chosen auth realm is saved between page reloads
  16     id: 'pmgloginrealm', // We need stable ids when using stateful, not autogenerated
  17     stateID: 'pmgloginrealm',
  18
  19     comboItems: [
  20         ['pam', 'Local System (PAM)'],
  21         ['pmg', 'Proxmox Mail Gateway']
  22     ]
  23 });
  24
  25 Ext.define('PMG.LoginView', {
  26     extend: 'Ext.container.Container',
  27     xtype: 'loginview',
  28
  29     controller: {
  30         xclass: 'Ext.app.ViewController',
  31
  32         init: function(view) {
  33             var me = this;
  34             var loginForm = this.lookupReference('loginForm');
  35
  36             // try autologin with quarantine ticket from URL
  37
  38             var qs = Ext.Object.fromQueryString(location.search);
  39             if (qs.ticket == undefined) { return; }
  40             var ticket = decodeURIComponent(qs.ticket);
  41             var match = ticket.match(/^PMGQUAR:([^\s\:]+):/);
  42             if (!match) { return; }
  43             var username = match[1];
  44             var loginwin = me.lookup('loginwindow');
  45             loginwin.autoShow = false;
  46             loginwin.setVisible(false);
  47             me.lookup('realmfield').setDisabled(true);
  48
  49             me.lookup('usernameField').setValue(username);
  50             me.lookup('passwordField').setValue(ticket);
  51
  52             me.submitForm();
  53         },
  54
  55         submitForm: function() {
  56             var me = this;
  57             var view = me.getView();
  58             var loginForm = me.lookupReference('loginForm');
  59
  60             if (loginForm.isValid()) {
  61                 if (loginForm.isVisible()) {
  62                     loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
  63                 }
  64                 loginForm.submit({
  65                     success: function(form, action) {
  66                         // save login data and create cookie
  67                         PMG.Utils.updateLoginData(action.result.data);
  68                         PMG.app.changeView(view.targetview);
  69                     },
  70                     failure: function(form, action) {
  71                         loginForm.unmask();
  72                         Ext.MessageBox.alert(
  73                             gettext('Error'),
  74                             gettext('Login failed. Please try again')
  75                         );
  76                     }
  77                 });
  78             }
  79         },
  80
  81         control: {
  82             'field[name=lang]': {
  83                 change: function(f, value) {
  84                     var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
  85                     Ext.util.Cookies.set('PMGLangCookie', value, dt);
  86
  87                     var loginwin = this.lookupReference('loginwindow');
  88                     loginwin.mask(gettext('Please wait...'), 'x-mask-loading');
  89                     window.location.reload();
  90                 }
  91             },
  92             'button[reference=loginButton]': {
  93                 click: 'submitForm'
  94             }
  95         }
  96     },
  97
  98     plugins: 'viewport',
  99
 100     layout: {
 101         type: 'border'
 102     },
 103
 104     items: [
 105         {
 106             region: 'north',
 107             xtype: 'container',
 108             layout: {
 109                 type: 'hbox',
 110                 align: 'middle'
 111             },
 112             margin: '2 5 2 5',
 113             height: 38,
 114             items: [
 115                 {
 116                     xtype: 'proxmoxlogo'
 117                 },
 118                 {
 119                     xtype: 'versioninfo',
 120                     makeApiCall: false
 121                 }
 122             ]
 123         },
 124         {
 125             region: 'center'
 126         },
 127         {
 128             xtype: 'window',
 129             closable: false,
 130             resizable: false,
 131             reference: 'loginwindow',
 132             autoShow: true,
 133             modal: true,
 134
 135             defaultFocus: 'usernameField',
 136
 137             layout: {
 138                 type: 'auto'
 139             },
 140
 141             title: gettext('Proxmox Mail Gateway Login'),
 142
 143             items: [
 144                 {
 145                     xtype: 'form',
 146                     layout: {
 147                         type: 'form'
 148                     },
 149                     defaultButton: 'loginButton',
 150                     url: '/api2/extjs/access/ticket',
 151                     reference: 'loginForm',
 152
 153                     fieldDefaults: {
 154                         labelAlign: 'right',
 155                         allowBlank: false
 156                     },
 157
 158                     items: [
 159                         {
 160                             xtype: 'textfield',
 161                             fieldLabel: gettext('User name'),
 162                             name: 'username',
 163                             itemId: 'usernameField',
 164                             reference: 'usernameField'
 165                         },
 166                         {
 167                             xtype: 'textfield',
 168                             inputType: 'password',
 169                             fieldLabel: gettext('Password'),
 170                             name: 'password',
 171                             reference: 'passwordField'
 172                         },
 173                         {
 174                             xtype: 'pmgRealmComboBox',
 175                             fieldLabel: gettext('Realm'),
 176                             reference: 'realmfield',
 177                             name: 'realm',
 178                             value: 'pam'
 179                         },
 180                         {
 181                             xtype: 'proxmoxLanguageSelector',
 182                             fieldLabel: gettext('Language'),
 183                             value: Ext.util.Cookies.get('PMGLangCookie') || 'en',
 184                             name: 'lang',
 185                             submitValue: false
 186                         }
 187                     ],
 188                     buttons: [
 189                         {
 190                             text: gettext('Login'),
 191                             reference: 'loginButton',
 192                             formBind: true
 193                         }
 194                     ]
 195                 }
 196             ]
 197         }
 198     ]
 199 });