/* Gets the cursor position for the mouse click */
function getPosition(e) {
	e = e || window.event;
	var cursor = {x:0, y:0};
	if (e.pageX || e.pageY) {
		cursor.x = e.pageX;
		cursor.y = e.pageY;
	} 
	else {
		var de = document.documentElement;
		var b = document.body;
		cursor.x = e.clientX + 
			(de.scrollLeft || b.scrollLeft) - (de.clientLeft || 0);
		cursor.y = e.clientY + 
			(de.scrollTop || b.scrollTop) - (de.clientTop || 0);
	}
	return cursor;
}

/* popup the dialog */
$(document).ready(function() {	

	//select all the a tag with name equal to modal
	$('a[name=modal]').click(function(e) {
		//Cancel the link behavior
		e.preventDefault();
		
		//Get the A tag
		var id = $(this).attr('href');
	
		//Get the screen height and width
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	
		//Set heigth and width to mask to fill up the whole screen
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		
		//transition effect		
		$('#mask').fadeIn(200);	
		$('#mask').fadeTo("slow",0.4);
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
              
		//Set the popup window to center
		cursor = getPosition(e);
		$(id).css('position', 'absolute');
		// $(id).css('top',  (winH/2)-($(id).height()/2));
		// $(id).css('left', (winW/2)-($(id).width()/2));
		$(id).css('left', cursor.x-($(id).width()*0.6));
		$(id).css('top',  cursor.y-($(id).height()));
	
		//transition effect
		$(id).fadeIn(1000); 
		if ($(id) == "contact_form")
			$('input#email').select().focus();
		else
			$('input#chatHandle').select().focus();
	
	});
	
	//if close button is clicked
	$('.window .close').click(function (e) {
		//Cancel the link behavior
		e.preventDefault();
		
		$('#mask').hide();
		$('.window').hide();
	});		
	
	//if mask is clicked
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});			
	
});