var popupStatus = 0;
var popupvis = "";

function loadPopup(popname) {
	//loads popup only if it is disabled
	if(popupStatus==0){
		$("#backgroundPopup").css({
			"opacity": "0.7"
		});
		$("#backgroundPopup").fadeIn("slow");
		$(popname).fadeIn("slow");
		popupStatus = 1;
		popupvis = popname;
	}
}

//disabling popup with jQuery magic!
function disablePopup(){
	//disables popup only if it is enabled
	if(popupStatus==1){
		$("#backgroundPopup").fadeOut("slow");
		if (popupvis != "")
			$(popupvis).fadeOut("slow");
		popupStatus = 0;
	}
}

//centering popup
function centerPopup(popname){
	//request data for centering
	var windowWidth = document.documentElement.clientWidth;
	var windowHeight = document.documentElement.clientHeight;
	var popupWidth = $(popname).width();
    var popTop = $(window).scrollTop(); 
	//centering
	$(popname).css({
	    "position": "absolute",
	    "top": popTop + 20,
		"left": windowWidth/2-popupWidth/2
	});
	//only need force for IE6
	
	$("#backgroundPopup").css({
		"height": windowHeight
	});
	
}

//CONTROLLING EVENTS IN jQuery
$(document).ready(function () {

    //LOADING POPUP
    //Click the button event!
    $("#button").click(function () {
        //centering with css
        centerPopup("#popupmain");

        //load popup
        loadPopup("#popupmain");
    });

    $("#shot1").click(function (event) {
        //centering with css
        centerPopup("#screenPopup1");

        //load popup
        loadPopup("#screenPopup1");
        event.preventDefault();
    });

    $("#shot2").click(function (event) {
        //centering with css
        centerPopup("#screenPopup2");

        //load popup
        loadPopup("#screenPopup2");
        event.preventDefault();
    });

    $("#shot3").click(function (event) {
        //centering with css
        centerPopup("#screenPopup3");

        //load popup
        loadPopup("#screenPopup3");
        event.preventDefault();
    });

    $("#shot4").click(function (event) {
        //centering with css
        centerPopup("#screenPopup4");

        //load popup
        loadPopup("#screenPopup4");
        event.preventDefault();
    });

    //Click out event!
    $("#backgroundPopup").click(function () {
        disablePopup();
    });

    //Click out event!
    $("#screenPopup_close_button").click(function (event) {
        disablePopup();
        event.preventDefault();
    });

    //Click out event!
    $("#screenPopup_close_button1").click(function (event) {
        disablePopup();
        event.preventDefault();
    });

    //Click out event!
    $("#screenPopup_close_button2").click(function (event) {
        disablePopup();
        event.preventDefault();
    });

    //Click out event!
    $("#screenPopup_close_button3").click(function (event) {
        disablePopup();
        event.preventDefault();
    });

    //Click out event!
    $("#screenPopup_close_button4").click(function (event) {
        disablePopup();
        event.preventDefault();
    });

    //Click out event!
    $("#screenPopup").click(function () {
        disablePopup();
    });

    //Press Escape event!
    $(document).keypress(function (e) {
        if (e.keyCode == 27 && popupStatus == 1) {
            disablePopup();
        }
    });

});
