function display_signup_window(username, password)
{
	var signup_window = Ext.getCmp('signup-window');
	if(!signup_window) {
		var area_cb = new Ext.form.ComboBox({
			typeAhead: true, 
			name: 'area',
			triggerAction: 'all',
			width: 140,
			mode: 'local',
			fieldLabel: 'Association',
			store: new Ext.data.ArrayStore({
				id: '',
				fields: [ 'area' ],
				data: [ ['Academic'], ['Industrial'] ]
			}),
			valueField: 'area',
			displayField: 'area',
			allowBlank:false
		});

		var interest_cb = new Ext.form.ComboBox({
			typeAhead: true, 
			name: 'interest',
			triggerAction: 'all',
			width: 140,
			mode: 'local',
			fieldLabel: 'Area of interest',
			store: new Ext.data.ArrayStore({
				id: '',
				fields: [ 'interest' ],
				data: [ ['Proteomics'], ['Genomics'], ['Other'] ]
			}),
			valueField: 'interest',
			displayField: 'interest',
			allowBlank:false

		});

		
		var signup_form  = new Ext.FormPanel({
			id: 'signup_form',
			region:'center',
			width: 600,
			height: 415,
			labelWidth:110,
			bodyStyle: 'padding:5px;',
			defaults: {
				anchor: '100%',
				allowBlank: false,
				msgTarget: 'side'
			},
			items: 
			[
				{
					xtype: 'fieldset',
					title: '<span style="color:#fc2d01;">Contact Information</span>',
					items: [ {
						layout: 'column',
						border: false,

						items: [
						{
							columnWidth:.5,
							layout:'form',
							border: false,
							items: [
								{
									xtype:'textfield',
									fieldLabel: 'First name',
									name: 'firstname',
									allowBlank:false
								},
								{
									xtype:'textfield',
									fieldLabel: 'Phone',
									name: 'phone',
									allowBlank:false
								}
							]
						},
						{
							columnWidth:.5,
							border: false,
							layout:'form',
							items: [
								{
									xtype:'textfield',
									fieldLabel: 'Last name',
									name: 'lastname',
									allowBlank:false
								},
								{
									xtype:'displayfield',
									fieldLabel: 'Email',
									name: 'email',
									value: username,
									allowBlank:false
								}
							]
						}

						]
					},
					{
						xtype:'textarea',
						fieldLabel: 'Address',
						name: 'address',
						width: '408',
						allowBlank:false
					}
					]
				},
				{
					xtype: 'fieldset',
					title: '<span style="color:#fc2d01;">Affiliation</span>',
					items: [ 
					{
						layout: 'column',
						border: false,
						items: [
						{
							columnWidth:.5,
							layout:'form',
							border: false,
							items: [ area_cb ]
						},
						{
							columnWidth:.5,
							border: false,
							layout:'form',
							items: [ interest_cb ]
						}
						]
					},

					{
						xtype:'textfield',
						fieldLabel: 'Institution',
						name: 'institution',
						width: '408',
						allowBlank:false
					},
					{
						xtype:'textfield',
						fieldLabel: 'Department',
						name: 'department',
						width: '408',
						allowBlank:false
					},
					{
						xtype:'textfield',
						fieldLabel: 'Position',
						name: 'position',
						width: '408',
						allowBlank:false
					},
					{
						layout: 'column',
						border: false,
						items: [
						{
							columnWidth:.5,
							layout:'form',
							border: false,
							items: [
							]
						},
						{
							columnWidth:.5,
							border: false,
							layout:'form',
							items: [
								{
								xtype:'textfield',
								fieldLabel: 'AES#',
								name: 'aes_number'
								}
							]
						}
						]
					}
					]
				}
			],
			buttons: 
			[
				{
					text: '<span style="font-weight:bold;">Submit</span>',
					handler: function() {
						var signup_form = Ext.getCmp('signup_form');
						
						if(!signup_form.getForm().isValid())
						{
							Ext.MessageBox.show({
								title: 'Incomplete Information',
								msg: 'Please complete the required fields, marked in red, before submitting',
								buttons: Ext.MessageBox.OK
							});
							return;
						}
					
						Ext.getCmp('signup_form').getForm().submit({
							url: 'backend/create_account.php',
							params: {
								username: username,
								password: password
							},
							waitMsg: 'Sending your request...',
							success: function(fp, o) {
								Ext.getCmp('signup-window').close();
								var thank_you = new Ext.Window({ 
									title: '<span style="color:#062f9f;">Thank you</span>',
									id: 'thank-you',
									layout: 'fit',
									height: 150,
									width: 350,
									modal: false,
									closable: false,
									html: '<div style="padding: 5px; font-size:12px;">Thank you for requesting an account on the AES forums. Your account information will be reviewed and an AES representative will contact you via email within the next business day.</div><div style="float:right;padding-top:10px; padding-right:10px;font-size:12px;">Click <a href="/aesforums/index.php">here</a> to return to the website</div>'
									
								});	
								
								thank_you.show();
								
							},
							failure: function(fp, o) {
							
							}
						});
					}
				}
			]

		});
	
	
		signup_window = new Ext.Window({
			title: '<span style="color:#062f9f;">New User Information</span>',
			id: 'signup-window',
			layout: 'border',
			height: 415,
			width: 600,
			closeAction:'hide',
			modal: false,
			closable: false,
			items: [ signup_form ]
		});
	}
	signup_window.show();

}

function display_login_window()
{
	var login_window = Ext.getCmp('login-window');
	
	var login_button = new Ext.Button({
		text: '<span style="font-weight:bold;">Login</span>',
		handler: function() {
			login_window.getEl().mask('Logging in...');
			var form = existing_user_form.getForm();

			Ext.Ajax.request({
				url: '/aesforums/backend/login.php',
				method: 'POST',
				params: {
					username: form.findField('username').getValue(),
					password: form.findField('password').getValue()
				},
				success: function(result, request) {
					var successful = Ext.util.JSON.decode(result.responseText).totalCount;
					
					if(successful == 1) {
						window.location = "/aesforums/index.php";
					}
					else {
						Ext.getCmp('login_message').update('<div style="color:red;margin-bottom:25px;font-size:12px;text-align:center;width:100%;">Login failed - please try again.</div>									<div style="border:none;font-size:12px;">If you\'ve forgotten your password, click <a href="javascript:passwordWindow.show()">here</a> to have it emailed to you.</div>');
					}
					login_window.getEl().unmask();
				}
			});
		
		}
	});
	
	if(!login_window) {

		var existing_user_form = new Ext.FormPanel({
			id: 'existing_user_form',
			region:'west',
			width: 250,
			height: 400,
			labelWidth:90,
			bodyStyle: 'padding:5px;',
			defaults: {
				anchor: '100%',
				allowBlank: false,
				msgTarget: 'side'
			},
			items: 
			[
				{
					xtype: 'fieldset',
					title: '<span style="color:#fc2d01;">Existing users</span>',
					defaults: { width: 120 },
					items: [
						{
							xtype:'textfield',
							fieldLabel: 'Username',
							name: 'username'
						},
						{
							xtype:'textfield',
							fieldLabel: 'Password',
							name: 'password',
							inputType: 'password',
							enableKeyEvents: true,
							listeners: {
								specialkey: function(field, e) {
									if(e.getKey() == e.RETURN || e.getKey() == e.ENTER) {
										login_button.handler.call(login_button.scope);
									}
								}
							}
						},
						{
							id: 'login_message',
							html: '<div style="border:none;font-size:12px;">If you\'ve forgotten your password, click <a href="javascript:passwordWindow.show()">here</a> to have it emailed to you.</div>',
							border:false,
							style:"margin-top:20px; margin-bottom:45px;",
							width: 200
						}
					]
				}
			],
			buttons: [ login_button ]
		});
	
		var new_user_form = new Ext.FormPanel({
			id: 'new_user_form',
			region:'center',
	
			width: 350,
			height: 400,
			labelWidth:110,
			bodyStyle: 'padding:5px;',
			defaults: {
				anchor: '100%',
				allowBlank: false,
				msgTarget: 'side'
			},
			items: 
			[
				{
					xtype: 'fieldset',
					title: '<span style="color:#fc2d01;">New users</span>',
					defaults: { width: 180, allowBlank:false },
					items: [
						{
							html: '<div style="border:none;font-size:12px;">If you are new to the AES forums, please provide your email address and the password that you would like to use to access the forums. </div>',
							border:false,
							style:"margin-bottom:20px;",
							width: 300
						},
						{
							xtype:'textfield',
							fieldLabel: 'Email Address',
							name: 'username'
						},
						{
							xtype:'textfield',
							fieldLabel: 'Password',
							name: 'password1',
							inputType: 'password'
						},
						{
							xtype:'textfield',
							fieldLabel: 'Password (again)',
							name: 'password2',
							inputType: 'password'
						}
					]
				}
			],
			buttons: 
			[
				{
					text: '<span style="font-weight:bold;">Next</span>',
					handler: function() {
						var form = new_user_form.getForm();
						var email = form.findField('username');
						var password1 = form.findField('password1');
						var password2 = form.findField('password2');
						
						if(email.getValue().length < 1) {
							Ext.Msg.show( {title: "Error", msg: "Please provide an email address for your account.", buttons: Ext.Msg.OK});
							return;
						}
						
						if(password1.getValue() != password2.getValue()) {
							Ext.Msg.show({ title: "Error", msg: "The passwords you provided do not match.", buttons: Ext.Msg.OK});
							return;
						}
						
						login_window.hide();
						display_signup_window(email.getValue(), password1.getValue());
					}
				}
			]
		});
	
		login_window = new Ext.Window({
			title: '<span style="color:#062f9f;">Welcome to the AES Forums</span>',
			id: 'login-window',
			layout: 'border',
			y: 300,
			height: 263	,
			width: 600,
			closeAction:'hide',
			modal: false,
			closable: false,
			items: [existing_user_form, new_user_form ]
		});
	}
	login_window.show();
}



Ext.onReady(function() {
	Ext.QuickTips.init();
		
	display_login_window();
});