js/LoginView.js

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