Ext.onReady (function () {	
function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name) {
	createCookie(name,"",-1);
}


var login_headPanel = new Ext.Panel ({
	id:'login_headPanel',												 
	baseCls : 'x-plain',
	html    : '',
	cls     : 'ux-albeva-auth-header',
	height  : 50,
	region  : 'north'
});

var login_form = new Ext.FormPanel({
	region      : 'center',
	bodyStyle   : "padding:10px;background-color: #FFF;",
	labelWidth  : 75,
	defaults    : { width:170 },

	items : [
	{
		xtype       : 'textfield',
		id          : "username",
		name        : "username",
		fieldLabel  : "UserName",
		value: readCookie('login'),
		vtype       : "email",
		allowBlank  : false
	},
	{
		xtype       : 'textfield',
		inputType   : 'password',
		id          : "password",
		name        : "password",
		fieldLabel  : "Password",
		vtype       : "alphanum",
		allowBlank  : false
	}]										 									 
});

function onSuccess(form,action) { 
   if(action.result && action.result.success == "false") {  
         onFailure();
   } else {  
	window.location = "member.php";
   }
}
function onFailure() {
	login_headPanel.body.update('<span class="error">Unable to login</span>');
}

function SubmitForm()
{
  var form = login_form.getForm();
  if (form.isValid()) {
	  createCookie("login",login_form.findById('username').getValue(),30);
	 form.submit ({
		  url     : "login.inc.php",
		  method  : "POST",
		  waitMsg : "Logging in...",
		  success : onSuccess,
		  failure : onFailure
	 });	
  }
}

var login_window = new Ext.Panel({ 
	renderTo:"loginbox",
	width       : 290,
	height      : 200,
	iconCls     : 'ux-albeva-auth-lock-icon',
	title       : "Authenticate",
	layout      : 'border',
	bodyStyle   : 'padding:5px;',
	buttons     : [{text: "Submit", handler: SubmitForm }],
	keys        : [{key:[10,13], handler: SubmitForm}],
	items       : [login_headPanel, login_form]
});
	

});