//Animated Collapsible DIV- Author: Dynamic Drive (http://www.dynamicdrive.com)
//Last updated Aug 1st, 07'. Fixed bug with "block" parameter not working when persist is enabled
//Updated June 27th, 07'. Added ability for a DIV to be initially expanded.

var uniquepageid=window.location.href.replace("http://"+window.location.hostname, "").replace(/^\//, "") //get current page path and name, used to uniquely identify this page for persistence feature
var uni_flag=0; //0: E, 1: V
var current_date = new Date;
var cookie_year = current_date.getFullYear ( ) + 1;
var cookie_month = current_date.getMonth ( );
var cookie_day = current_date.getDate ( );

function uni_animatedcollapse(divId, animatetime, persistexpand, initstate){
	this.divId=divId
	this.divObj=document.getElementById(divId)
	this.divObj.style.display="block";
	this.divObj.style.overflow="hidden"
	this.timelength=animatetime
	this.initstate=(typeof initstate!="undefined" && initstate=="block")? "block" : "contract"
	this.isExpanded=uni_animatedcollapse.getCookie(uniquepageid+"-"+divId) //"yes" or "no", based on cookie value
	this.contentwidth=parseInt(this.divObj.style.width)
	var thisobj=this
	if (isNaN(this.contentwidth)){ //if no CSS "height" attribute explicitly defined, get DIV's height on window.load
		uni_animatedcollapse.dotask(window, function(){thisobj._getwidth(persistexpand)}, "load")
		if (!persistexpand && this.initstate=="contract" || persistexpand && this.isExpanded!="yes" && this.isExpanded!="") //Hide DIV (unless div should be expanded by default, OR persistence is enabled and this DIV should be expanded)
			this.divObj.style.visibility="hidden" //hide content (versus collapse) until we can get its height
	}
	else if (!persistexpand && this.initstate=="contract" || persistexpand && this.isExpanded!="yes" && this.isExpanded!="") //Hide DIV (unless div should be expanded by default, OR persistence is enabled and this DIV should be expanded)
		this.divObj.style.width=0 //just collapse content if CSS "height" attribute available
	if (persistexpand)
		uni_animatedcollapse.dotask(window, function(){uni_animatedcollapse.setCookie(uniquepageid+"-"+thisobj.divId, thisobj.isExpanded)}, "unload")
}

uni_animatedcollapse.prototype._getwidth=function(persistexpand){
	this.contentwidth=this.divObj.offsetWidth
	if (!persistexpand && this.initstate=="contract" || persistexpand && this.isExpanded!="yes"){ //Hide DIV (unless div should be expanded by default, OR persistence is enabled and this DIV should be expanded)
		this.divObj.style.width=0 //collapse content
		this.divObj.style.visibility="visible"
	}
	else //else if persistence is enabled AND this content should be expanded, define its CSS height value so slideup() has something to work with
		this.divObj.style.width=this.contentwidth+"px"
}


uni_animatedcollapse.prototype._slideengine=function(direction){
	var elapsed=new Date().getTime()-this.startTime //get time animation has run
	var thisobj=this
	if (elapsed<this.timelength){ //if time run is less than specified length
		var distancepercent=(direction=="down")? uni_animatedcollapse.curveincrement(elapsed/this.timelength) : 1-uni_animatedcollapse.curveincrement(elapsed/this.timelength)
	this.divObj.style.width=distancepercent * this.contentwidth +"px"
	this.runtimer=setTimeout(function(){thisobj._slideengine(direction)}, 10)
	}
	else{ //if animation finished
		this.divObj.style.width=(direction=="down")? this.contentwidth+"px" : 0
		this.isExpanded=(direction=="down")? "yes" : "no" //remember whether content is expanded or not
		this.runtimer=null
	}
}


uni_animatedcollapse.prototype.slidedown=function(){
	if (typeof this.runtimer=="undefined" || this.runtimer==null){ //if animation isn't already running or has stopped running
		if (isNaN(this.contentwidth)) //if content height not available yet (until window.onload)
			alert("Please wait until document has fully loaded then click again")
		else if (parseInt(this.divObj.style.width)==0){ //if content is collapsed
			this.startTime=new Date().getTime() //Set animation start time
			this._slideengine("down")
			document.getElementById("uni_overlay").style.display="block";		}
	}
}

uni_animatedcollapse.prototype.slideup=function(){
	if (typeof this.runtimer=="undefined" || this.runtimer==null){ //if animation isn't already running or has stopped running
		if (isNaN(this.contentwidth)) //if content height not available yet (until window.onload)
			alert("Please wait until document has fully loaded then click again")
		else if (parseInt(this.divObj.style.width)==this.contentwidth){ //if content is expanded
			this.startTime=new Date().getTime()
			this._slideengine("up")
			document.getElementById("uni_overlay").style.display="none";
		}
	}
}

uni_animatedcollapse.prototype.slideit=function(){
	if (isNaN(this.contentwidth)) //if content height not available yet (until window.onload)
		alert("Please wait until document has fully loaded then click again")
	else if (parseInt(this.divObj.style.width)==0)
		this.slidedown()
	else if (parseInt(this.divObj.style.width)==this.contentwidth)
		this.slideup()
}

uni_animatedcollapse.prototype.slideit=function(btn1, btn2, class1, class2){
	btn1= document.getElementById(btn1)
	btn2= document.getElementById(btn2)	
	var border_left_btn = document.getElementById("uni_type");
	
	if (isNaN(this.contentwidth)) //if content height not available yet (until window.onload)
		alert("Please wait until document has fully loaded then click again")
	else if (parseInt(this.divObj.style.width)==0){
		this.slidedown()		
		btn2.className=class2;
		uni_reset_state();
		uni_set_cur_state();
		
		if(uni_flag){			
			border_left_btn.className ="uni_center_type border_v";
			uni_flag =1}
		else{			
			border_left_btn.className ="uni_center_type border_e";
			uni_flag =0}
		}
	else if (parseInt(this.divObj.style.width)==this.contentwidth){		
		btn1.className=class1
		border_left_btn.className ="uni_center_type"
		this.slideup()
		}
		
}


uni_animatedcollapse.curveincrement=function(percent){
	return (1-Math.cos(percent*Math.PI)) / 2 //return cos curve based value from a percentage input
}


uni_animatedcollapse.dotask=function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)
	var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
	if (target.addEventListener)
		target.addEventListener(tasktype, functionref, false)
	else if (target.attachEvent)
		target.attachEvent(tasktype, functionref)
}

uni_animatedcollapse.getCookie=function(Name){ 
	var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
	if (document.cookie.match(re)) //if cookie found
		return document.cookie.match(re)[0].split("=")[1] //return its value
	return ""
}

uni_animatedcollapse.setCookie=function(name, value){
		document.cookie = name+"="+value
}

function uni_reset_state(){
	var states=document.getElementById("uni_type").getElementsByTagName("a") 
	var len = states.length;	
	for(i= 0; i< len; i++){
		states[i].className="";
		}
	}
function uni_set_cur_state(){
	var states=document.getElementById("uni_type").getElementsByTagName("a") 
	var len = states.length;	
	for(i= 0; i< len; i++){		
		if(states[i].rel==get_cookie("current_type") && uni_flag) states[i].className="current";
		else if(!uni_flag) states[0].className="current";	
		}		
	}	

function uni_change_type(obj){
	uni_reset_state();
	var type = obj.rel;

	obj.className="current";
	
	if(type=="Kiểu gõ: Tắt"){
		uni_flag=0;
		document.getElementById("uni_current_lang").className="en";
	}
	else{
		uni_flag=1;
		document.getElementById("uni_current_lang").className="";
	}	
	
	document.getElementById("uni_state").innerHTML=type;	
	collapse_type.slideit('uni_btn', 'uni_btn', '' , 'close');		
    set_cookie ( "current_type", type, cookie_year, cookie_month, cookie_day );
}

function uni_change(obj, cur){	
	var current_type = get_cookie("current_type");
	if(current_type == "Kiểu gõ: Tắt") current_type="Tự động";
	var uni_current_lang =document.getElementById("uni_current_lang");
	var obj =document.getElementById(obj);

	if(current_type == null)
		collapse_type.slideit('uni_btn', 'uni_btn', '' , 'close');	
	else{						
		if(uni_flag){
			obj.innerHTML="Kiểu gõ: Tắt";
			uni_current_lang.className="en";			
			cur.title="Nhấn vào để chọn kiểu gõ tiếng Việt";			
			uni_flag =0}
		else{						
			obj.innerHTML=current_type;	
			uni_current_lang.className="";
			cur.title="Nhấn vào để tắt kiểu gõ";			
			uni_flag =1}
		collapse_type.slideup();
		document.getElementById("uni_btn").className="";
		document.getElementById("uni_type").className="uni_center_type";
	}
}

function uni_close_type(){
		collapse_type.slideit('uni_btn', 'uni_btn', '' , 'close');	
		document.getElementById("uni_overlay").style.display="none";
	}

function get_cookie ( cookie_name ){
  var results = document.cookie.match ( cookie_name + '=(.*?)(;|$)' );

  if ( results ) return ( unescape ( results[1] ) );
  else return null;
}

function set_cookie ( name, value, exp_y, exp_m, exp_d, path, domain, secure ){
  var cookie_string = name + "=" + escape ( value );
  
  if ( exp_y ) {
    var expires = new Date ( exp_y, exp_m, exp_d );
    cookie_string += "; expires=" + expires.toGMTString();
  }
  if ( path ) cookie_string += "; path=" + escape ( path );
  if ( domain ) cookie_string += "; domain=" + escape ( domain );
  if ( secure ) cookie_string += "; secure";  
  document.cookie = cookie_string;
}


