webui: fix the login window

The login window now functions correctly under ExtJS 4.0.

1 files changed, 31 insertions, 24 deletions

diff --git a/deluge/ui/web/js/deluge-all/LoginWindow.js b/deluge/ui/web/js/deluge-all/LoginWindow.js
index 0a08a6d39..699a80788 100644
--- a/deluge/ui/web/js/deluge-all/LoginWindow.js
+++ b/deluge/ui/web/js/deluge-all/LoginWindow.js
@@ -46,35 +46,41 @@ Ext.define('Deluge.LoginWindow', {
     resizable:   false,
     title:       _('Login'),
     width:       300,
-    height:      120,
+    height:      105,
 
     initComponent: function() {
         this.callParent(arguments);
         this.on('show', this.onShow, this);
 
-//        this.addButton({
-//            text: _('Login'),
-//            handler: this.onLogin,
-//            scope: this
-//        });
+        this.addDocked({
+            xtype: 'toolbar',
+            dock: 'bottom',
+            defaultType: 'button',
+            items: [
+                '->',
+                {text: _('Login'), handler: this.onLogin, scope: this}
+            ]
+        });
 
         this.form = this.add({
             xtype: 'form',
             baseCls: 'x-plain',
-            labelWidth: 55,
             width: 300,
-            defaults: {width: 200},
-            defaultType: 'textfield'
-        });
-
-        this.passwordField = this.form.add({
-            xtype: 'textfield',
-            fieldLabel: _('Password'),
-            id: '_password',
-            name: 'password',
-            inputType: 'password'
+            items: [{
+                xtype: 'textfield',
+                fieldLabel: _('Password'),
+                name: 'password',
+                inputType: 'password',
+                labelWidth: 60,
+                width: 275,
+                listeners: {
+                    specialkey: {
+                        scope: this,
+                        fn: this.onSpecialKey
+                    }
+                }
+            }]
         });
-        this.passwordField.on('specialkey', this.onSpecialKey, this);
     },
 
     logout: function() {
@@ -94,7 +100,7 @@ Ext.define('Deluge.LoginWindow', {
         }
 
         if (skipCheck) {
-            return this.callParent(arguments);
+            return this.callParent();
         }
 
         deluge.client.auth.check_session({
@@ -117,13 +123,14 @@ Ext.define('Deluge.LoginWindow', {
     },
 
     onLogin: function() {
-        var passwordField = this.passwordField;
-        deluge.client.auth.login(passwordField.getValue(), {
+        var f = this.form.getForm(),
+            p = f.getValues().password;;
+        deluge.client.auth.login(p, {
             success: function(result) {
                 if (result) {
                     deluge.events.fire('login');
                     this.hide();
-                    passwordField.setRawValue('');
+                    f.setValues({password: ''});
                 } else {
                     Ext.MessageBox.show({
                         title: _('Login Failed'),
@@ -131,7 +138,7 @@ Ext.define('Deluge.LoginWindow', {
                         buttons: Ext.MessageBox.OK,
                         modal: false,
                         fn: function() {
-                            passwordField.focus(true, 10);
+                            f.findField('password').focus(true, 10);
                         },
                         icon: Ext.MessageBox.WARNING,
                         iconCls: 'x-deluge-icon-warning'
@@ -150,6 +157,6 @@ Ext.define('Deluge.LoginWindow', {
     },
 
     onShow: function() {
-        this.passwordField.focus(true, true);
+        this.form.getForm().findField('password').focus(true, 10);
     }
 });