tidy up the login window code, extend Ext.Window instead.

focus the password field upon the login window being displayed

deluge/ui/web/js/deluge-bars.js

@@ -50,7 +50,7 @@ Deluge.ToolBar = {
 	onLogout: function() {
 		this.Bar.items.get('logout').disable();
 		Deluge.Events.fire('logout');
-		Deluge.Login.Window.show();
+		Deluge.Login.show();
 	},
 	
 	onConnectionManagerClick: function(item) {

deluge/ui/web/js/deluge-login.js

@@ -21,79 +21,96 @@ Copyright:
 		Boston, MA  02110-1301, USA.
 */
 
-Deluge.Login = {
+(function(){
-    onLogin: function() {
+	var LoginWindow = function(config) {
-        var passwordField = Deluge.Login.Form.items.get('password');
+		Ext.apply(this, {
-        Deluge.Client.web.login(passwordField.getValue(), {
+			layout: 'fit',
-            onSuccess: function(result) {
+			width: 300,
-                if (result == true) {
+			height: 120,
-                    Deluge.Login.Window.hide();
+			bodyStyle: 'padding: 10px 5px;',
-                    Deluge.Connections.loginShow();
+			buttonAlign: 'center',
-                    passwordField.setRawValue('');
+			closeAction: 'hide',
-                    Deluge.Events.fire('login')
+			closable: false,
-                } else {
+			modal: true,
-                    Ext.MessageBox.show({
+			plain: true,
-                        title: _('Login Failed'),
+			resizable: false,
-                        msg: _('You entered an incorrect password'),
+			title: _('Login'),
-                        buttons: Ext.MessageBox.OK,
+			iconCls: 'x-deluge-login-window-icon'
-                        modal: false,
+		});
-                        icon: Ext.MessageBox.WARNING,
+		Ext.apply(this, config);
-                        iconCls: 'x-deluge-icon-warning'
+		LoginWindow.superclass.constructor.call(this);
-                    });
+	};
-                }
+	
-            }
+	Ext.extend(LoginWindow, Ext.Window, {
-        });
+		initComponent: function() {
-    },
+			LoginWindow.superclass.initComponent.call();
-    
+			Deluge.Events.on('logout', this.onLogout);
-    onLogout: function() {
+			this.on('show', this.onShow, this);
-        Deluge.Login.Window.show();
+			
-    },
+			this.addButton({
-    
+				text: _('Login'),
-    onKey: function(field, e) {
+				handler: this.onLogin,
-        if (e.getKey() == 13) Deluge.Login.onLogin();
+				scope: this
-    },
+			});
-    
+			
-    onRender: function() {  
+			this.loginForm = this.add({
-        Deluge.Events.on('logout', this.onLogout);
+				xtype: 'form',
-    }
+				defaultType: 'textfield',
-}
+				id: 'loginForm',
-
+				baseCls: 'x-plain',
-Deluge.Login.Form = new Ext.form.FormPanel({
+				labelWidth: 55,
-    defaultType: 'textfield',
+				items: [{
-    id: 'loginForm',
+					fieldLabel: _('Password'),
-    baseCls: 'x-plain',
+					id: 'password',
-    labelWidth: 55,
+					name: 'password',
-    items: [{
+					inputType: 'password',
-        fieldLabel: _('Password'),
+					anchor: '100%',
-        id: 'password',
+					listeners: {
-        name: 'password',
+						'specialkey': {
-        inputType: 'password',
+							fn: this.onKey,
-        anchor: '100%',
+							scope: this
-        listeners: {
+						}
-            'specialkey': {
+					}
-                fn: Deluge.Login.onKey,
+				}]
-                scope: Deluge.Login
+			});
-            }
+		},
-        }
+		
-    }]
+		onKey: function(field, e) {
-});
+			if (e.getKey() == 13) this.onLogin();
-
+		},
-Deluge.Login.Window = new Ext.Window({
+		
-    layout: 'fit',
+		onLogin: function() {
-    width: 300,
+			var passwordField = this.loginForm.items.get('password');
-    height: 120,
+			Deluge.Client.web.login(passwordField.getValue(), {
-    bodyStyle: 'padding: 10px 5px;',
+				onSuccess: function(result) {
-    buttonAlign: 'center',
+					if (result == true) {
-    closeAction: 'hide',
+						this.hide();
-    closable: false,
+						Deluge.Connections.loginShow();
-    modal: true,
+						passwordField.setRawValue('');
-    plain: true,
+						Deluge.Events.fire('login')
-    title: _('Login'),
+					} else {
-    iconCls: 'x-deluge-login-window-icon',
+						Ext.MessageBox.show({
-    items: Deluge.Login.Form,
+							title: _('Login Failed'),
-    buttons: [{
+							msg: _('You entered an incorrect password'),
-        text: _('Login'),
+							buttons: Ext.MessageBox.OK,
-        handler: Deluge.Login.onLogin
+							modal: false,
-    }],
+							icon: Ext.MessageBox.WARNING,
-    listeners: {'render': {fn: Deluge.Login.onRender, scope: Deluge.Login}}
+							iconCls: 'x-deluge-icon-warning'
-});
+						});
+					}
+				}.bindWithEvent(this)
+			});
+		},
+		
+		onLogout: function() {
+			this.show();
+		},
+		
+		onShow: function() {
+			var passwordField = this.loginForm.items.get('password');
+			passwordField.focus(false, 150);
+		}
+	});
+	
+	Deluge.Login = new LoginWindow();
+})();

deluge/ui/web/js/deluge-ui.js

@@ -48,7 +48,7 @@ Deluge.UI = {
 			items: [this.MainPanel]
 		});
 
-		Deluge.Login.Window.show();
+		Deluge.Login.show();
 		
 		Deluge.Events.on("connect", this.onConnect.bindWithEvent(this));
 		Deluge.Events.on("disconnect", this.onDisconnect.bindWithEvent(this));
@@ -56,7 +56,7 @@ Deluge.UI = {
 	},
 	
 	notify: function(title, message) {
-		this.roar.alert(title, message);
+		//this.roar.alert(title, message);
 	},
 	
 	update: function() {