var jtk = new JoookToolkit();
var extralogin = null;

function ExtranetLoginForm(formWrapper, bgEmt){
	this._wrapper = formWrapper;
	this._bgEmt = bgEmt;
	this._visible = false;
	this._form = null;
	this._formHeight = null;
	this._bgOpacity = 48;
	this._interval = null;
	this._currentFrame = {height: null};
	
	this.togglerClasses = {on: "togglerOn", off: "togglerOff"};
	
	this.getFormHeight = function(){
		var origDisplay = this._form.style.display;
		this._form.style.position = "absolute";
		this._form.style.left = "-9999px";
		this._form.style.display = "block";
		this._formHeight = jtk.getDimensions(this._form).height;
		this._form.style.display = origDisplay;
		this._form.style.position = "static";
		this._form.style.left = "0";
	}
	
	this.init = function(){
		this._form = jtk.select("form", this._wrapper)[0];
		jtk.setOpacity(this._bgEmt, this._bgOpacity);
		var formPos = jtk.getPosition(this._form);
		this._bgEmt.style.position = "absolute";
		this._bgEmt.style.left = formPos.left + "px";
		this._bgEmt.style.top = formPos.top + "px";
		this.getFormHeight();
		this._currentFrame.height = this._formHeight;
	}
	
	
	this.animateOpen = function(){
		this._form.style.display = "block";
		
		if(this._currentFrame.height < this._formHeight){
			var newHeight = Math.ceil((this._formHeight - this._currentFrame.height) / 2);
			if(newHeight > this._formHeight)
				newHeight = this._formHeight;
			
			this._formHeight = newHeight;
			this._currentFrame.height = newHeight;
			this._form.style.height = newHeight + "px";
			this._bgEmt.style.height = newHeight + "px";
		}
		else{
			clearInterval(this._interval);
		}
	}
	
	this.animateClose = function(){
		if(this._currentFrame.height > 0){
			var newHeight = Math.floor(this._currentFrame.height / 2);
			if(newHeight < 0)
				newHeight = 0;
			
			this._formHeight = newHeight;
			this._currentFrame.height = newHeight;
			this._form.style.height = newHeight + "px";
			this._bgEmt.style.height = newHeight + "px";
		}
		else{
			clearInterval(this._interval);
			this._form.style.display = "none";
		}
	}
	
	
	this.startAnim = function(){
		if(this._visible){
			this._currentFrame["height"] = 0;
			this._interval = setInterval(JTKDelegate.create(this, this.animateOpen), 1000/30);
		}
		else{
			this._currentFrame["height"] = this._formHeight;
			this._interval = setInterval(JTKDelegate.create(this, this.animateClose), 1000/30);
		}
	}
	
	
	
	
	this.showForm = function(){
		/*
		this._bgEmt.style.display = "block";
		this._bgEmt.style.height = this._formHeight + "px";
		this._bgEmt.style.top = jtk.getPosition(this._form).top + "px";
		this._bgEmt.style.left = jtk.getPosition(this._form).left + "px";
		*/
		
		this._form.style.display = "block";
		this._form.style.height = this._formHeight + "px";
	}
	
	this.hideForm = function(){
		this._bgEmt.style.display = "none";
		this._form.style.display = "none";
	}
	
	
	
	
	this.toggle = function(toggler, callback){
		this._form.style.position = "absolute";
		this._form.style.top = (jtk.getPosition(toggler).top + 50) + "px";
		this._form.style.left = (jtk.getPosition(toggler).left - 50) + "px";
		
		if(!this._visible){
			toggler.className = this.togglerClasses.on;
			this._visible = true;
			this.showForm();
		}
		else{
			toggler.className = this.togglerClasses.off;
			this._visible = false;
			this.hideForm();
		}
		
		//this.startAnim();
	}
	
	
	this.init();
}


jtk.addEvent(window, "load", function(){
	extralogin = new ExtranetLoginForm(jtk.select("#extranet_login")[0], jtk.select("#formBg")[0]);
});


(function($){
	$(document).ready(function(){
		$('form.emailForm td input, form.emailForm td textarea').each(function(){
			$(this).attr('placeholder', $(this).val());
			$(this).focus(function(){
				if($(this).val() === $(this).attr('placeholder')){
					$(this).val('');
				}
			});
			
			$(this).blur(function(){
				if($(this).val().replace(/\s/g, '') === ''){
					$(this).val($(this).attr('placeholder'));
				}
			});
		});
	});
})(jQuery);
