$(document).ready(function(){		
	var id = null;	
    timeOut = null; 
	var opend = false;
	
	
	
	/*var toolbar_ul_li = document.getElementById('toolbar').getElementsByTagName('ul')[0].getElementsByTagName('li');
	for(i = 0, l = toolbar_ul_li.length; i < l; i++){
			toolbar_ul_li[i].getElementsByTagName('a')[0].href = 'javascript: void(0);';
	}*/
	
	 
	 //close function
	 function Close(){
		 id = null;
		   $("#toolbar div ul li a").removeClass("active");
            $("#popup").animate({"height" : 0}, 500);
			$("#popup").removeClass("bb");
			$("#overlay").hide();
			opend = false;
			
	 }
	 
	 //sets overlay mouseover close function
	 $("#overlay").mouseover(function() {
			Close();
        });
	 
	 //sets content mouseover close function
	    $("#content").mouseover(function() {
			if(opend == true){							 
			Close();
			}
        });
	 
	 //refreshes timer when key is pressed inside the input fields on the popup
	 //so window doesnt close when data is being entered
	 $('#popup input').keypress(function(){
			//refreshes timer									 
			clearInterval(timeOut);
			//sets timeout interval
			timeOut = setInterval(function(){
				Close();			   
			}, 12000);					 
	  });
		 
		
		//button click
		$("#toolbar div ul li a").click(function(e){
			e.preventDefault();									 
			opend = true;									 
			//refreshes timer									 
			clearInterval(timeOut);
			//sets timeout interval
			timeOut = setInterval(function(){
				Close();			   
			}, 12000);
			
			//if you clicked the button thats already open, it will close window
			if(id == this.rel){
				Close();
				id = null;
				
			} else {
				//change content to corrisponding button
				id = this.rel;
				$("#toolbar div ul li a").removeClass("active");
				$("#toolbar div ul li a[rel="+id+"]").addClass("active");
				$("#popup div").fadeOut(200)
				$("#"+id).fadeIn(700);
				
				//if window isn't already open, then open it								 
				if($("#popup").height() == 0){
					 $("#popup").addClass("bb");
					 $("#overlay").show();
				}
			
			//set popup window height to height of the content
			id = this.rel;
			height = ($("#popup #" + id).height() + 40) + "px";
			$("#popup").animate({"height" : height}, 500);
			
			}
				
			
	    });
});