$(document).ready(function () {

    var loginError = $('#hfCheckIfLoggedIn').attr("value");
    if (loginError == 1) {
        showPopup("#Login");
    }
    //select all the a tag with name equal to modal
    $('a.modal').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = $(this).attr('href');

        showPopup(id);
    });

    //if close button is clicked
    $('.popupWindow .close').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        hidePopup();
    });

});

function hidePopup() {
	$('.mask, .popupWindow').hide();
}
function showPopup(id) {

	
	//Get the screen height and width
	var maskHeight = $(document).height();
	var maskWidth = $(window).width();

	var mask = $(id).find('.mask');
	var popupWindow = $(id).find('.popupWindow');

	//Set height and width to mask to fill up the whole screen
	mask.css({ 'width': maskWidth, 'height': maskHeight, 'top': 0, 'left': 0 });

	//transition effect		
	mask.fadeIn(500);
	//mask.fadeTo("slow", 0.8);

	//	//Set the popup window to center
	popupWindow.css("position", "absolute");
	popupWindow.css("top", ($(window).height() - popupWindow.outerHeight()) / 2 + $(window).scrollTop() + "px");
	popupWindow.css("left", ($(window).width() - popupWindow.outerWidth()) / 2 + $(window).scrollLeft() + "px");

	//transition effect
	//popupWindow.fadeIn(1000);
	popupWindow.show();
}