/****************************************************
* @author Thomas Pimentel : Vzion Designs                           *
****************************************************/

jQuery.fn.login = function(classToAdd, heading, whereTo){
	var element = this;

	element.append('<div id="loginGrayScaleJquery"></div>');
	$("#loginGrayScaleJquery").css("width", "100%");
	$("#loginGrayScaleJquery").css("height", "100%");
	$("#loginGrayScaleJquery").css("position", "fixed");
	$("#loginGrayScaleJquery").css("top", "0");
	$("#loginGrayScaleJquery").css("left", "0");
	$("#loginGrayScaleJquery").css("background-color", "#000");
	$("#loginGrayScaleJquery").css("z-index", "10000");
	$("#loginGrayScaleJquery").css({opacity: .75});
	

	if (!($.browser.msie)){
	var insideLoginBox = '<h2 style="width:215px; float: left; margin-left: 9px;">' + heading +
		'</h2><h2 style="width: 27px;padding-left: 21px; margin-right: 9px; float: right; background-color: #C9252B; cursor:pointer; margin-bottom:25px;font-weight:bold;" id="loginExitJquery">X</h2>' +
		' <br /> <form style="clear: both; margin-left: 18px" name="form1" method="post" action="/secure/chk_login.php">' +
	'<table id="tableLoginBox"><tr><td>USERNAME:</td></tr><tr><td><input name="myusername" type="text" id="myusername" class="login" /></td></tr>' +
		'<tr><td>PASSWORD:</td></tr><tr><td><input name="mypassword" style="font-size: 28px;" type="password" id="mypassword" class="login" /></td></tr>' +
		'<tr><td colspan="2"><input type="submit" name="Submit" value="Login" /></td></tr>' +
	'</table>' +
	'<input type="hidden" name="whereTo" value="' + whereTo + '" />'
	'</form>';
	element.append('<div id="loginBoxJquery" class="' + classToAdd + '">' + insideLoginBox + '</div>');
	}
	else{

		$("#loginGrayScaleJquery").append('<div id="loginBoxJquery"></div>');
		$("#loginBoxJquery").addClass(classToAdd);
		$("#loginBoxJquery").append('<h2 id="addForIe" style="width:215px; float: left; margin-left: 9px;"></h2>');
		$("#loginBoxJquery").append('<h2 style="width: 27px;padding-left: 21px; margin-right: 9px; float: right; background-color: #C9252B; cursor:pointer; margin-bottom:25px;font-weight:bold;" id="loginExitJquery">X</h2>');
		$("#loginBoxJquery").append(' <form style="clear: both; margin-left: 18px" name="form1" method="post" action="secure/chk_login.php"><table id="tableLoginBox"></table><input type="hidden" name="whereTo" /></form>');
		$("#tableLoginBox").append('<tr><td>USERNAME:</td></tr><tr><td><input name="myusername" type="text" id="myusername" class="login" /></td></tr><tr><td>PASSWORD:</td></tr><tr><td><input name="mypassword" style="font-size: 28px;" type="password" id="mypassword" class="login" /></td></tr><tr><td colspan="2"><input type="submit" name="Submit" value="Login" /></td></tr>');
		$("#addForIe").append(heading);
		$('input[name~="whereTo"]').attr("value", whereTo);
	}
	$("#loginBoxJquery").css("position", "fixed");
	$("#loginBoxJquery").css("z-index", "10001");
	$("#loginBoxJquery").css("width", "315px");
	$("#loginBoxJquery").css("height", "300px");

	changeCss();
	
	$(window).bind("resize", function(){
		changeCss();
	});
	
	$("#loginBoxJquery").find('h2[id~="loginExitJquery"]').click(function(){
		$("#loginBoxJquery").remove();
		$("#loginGrayScaleJquery").remove();
	})
	function changeCss(){
	
	var loginHeight = $("#loginBoxJquery").height();
	var loginWidth = $("#loginBoxJquery").width();
	var windowWidth = $(window).width();
	var windowHeight = $(window).height();
	
	$("#loginBoxJquery").css({"left": windowWidth / 2 - loginWidth / 2,
	"top": windowHeight / 2 - loginHeight / 2});
	}
};