// JavaScript Document
var isLoginOpened = false;
var isRegisterOpened = false;
var isToolsOpened = false;

$(document).ready(function() {	
	// for close button of popup
	$("div.popup .popupClose").click(function() { 
		var popup = $(this).closest("div.popup");
		var pip = popup.get(0).id;
		var bid = pip.substring(0, pip.indexOf("Popup"));
		var button = $("#" + bid + "Button");
		button.trigger('click');
	});
	
	$("#toolsButton").click(function() {
		if(!isToolsOpened){
			$("#toolsPopup").animate(
				{ width: "60px" }, 
				{ duration: 300 }
			);
			
			$("#loginButton").animate(
				{ opacity: 0, display: "none" }, 
				{ duration: 300 }
			);
			
			$("#registerButton").animate(
				{ opacity: 0, display: "none" }, 
				{ duration: 300 }
			);
			
			isToolsOpened = true;	
		} else {
			$("#toolsPopup").animate(
				{ width: "0px" }, 
				{ 
					duration: 300, 
					complete: function() {
						//parent.css("display", "none");
					},
				}
			);
			
			$("#loginButton").animate(
				{ opacity: 1, display: "block" }, 
				{ duration: 300 }
			);
			
			$("#registerButton").animate(
				{ opacity: 1, display: "block" }, 
				{ duration: 300 }
			);
			
			isToolsOpened = false;
		}
	});

	$("#loginButton").click(function() { 
		$("#loginPopup").css("display", "block");
		var content = $("#loginPopup > div.popupWrap");					
		var height = content.outerHeight();
		
		if(!isLoginOpened){
			$("#loginPopup").animate(
				{ opacity: 1, height: height + "px" }, 
				{ duration: 300 }
			);
			
			isLoginOpened = true;	
		}else{
			$("#loginPopup").animate(
				{ opacity: 0, height: '0px' }, 
				{ 
					duration: 300,
					complete: function() {
						$("#loginPopup").css("display", "none");
					}
				}
			);
			
			isLoginOpened = false;
		}
		
		if(isRegisterOpened){
			$("#registerPopup").animate(
				{ opacity: 0, height: '0px' }, 
				{ 
					duration: 300, 
					complete: function() {
						$("#registerPopup").css("display", "none");
					}
				}
			);
			
			isRegisterOpened = false;
		}
	});
	
	$("#registerButton").click(function() { 
		$("#registerPopup").css("display", "block");
		var content = $("#registerPopup > div.popupWrap");					
		var height = content.outerHeight();
		
		if(!isRegisterOpened){
			$("#registerPopup").animate(
				{ opacity: 1, height: height + "px" }, 
				{ duration: 300 }
			);
			
			isRegisterOpened = true;	
		}else{
			$("#registerPopup").animate(
				{ opacity: 0, height: '0px' }, 
				{ 
					duration: 300,
					complete: function() {
						$("#registerPopup").css("display", "none");
					}
				}
			);
			
			isRegisterOpened = false;
		}
		
		if(isLoginOpened){
			$("#loginPopup").animate(
				{ opacity: 0, height: '0px' }, 
				{ 
					duration: 300,
					complete: function() {
						$("#loginPopup").css("display", "none");
					}
				}					
			);
			
			isLoginOpened = false;
		}
	});				
});