var currentIndex;
var maxIndex;
var getContentOf = " div#container_page";
var bodyScrollPos = 0;
$(document).ready(function () {
    setClasses();
	$('#scrollBox').scroll(function () {
        //Loads the next page when user reaches the top of the page
        //Condition for scrolling up (Reached Top)
        if ($('#scrollBox').scrollTop() == 0) {
            //alert('Reached top');
            scrollUpPage();
			//$('#scrollBox').scrollTop(1);
			//$('#scrollBox').prop('scrollTop', 1);
        }

        //Loads the next page when user reaches the bottom of the page
        if (Math.round($('#scrollBox').prop('scrollTop') / ($('#scrollBox').prop('scrollHeight') - $('#scrollBox').prop('clientHeight')) * $('#scrollBox').height()) >=
            $('#scrollBox').height()) {
            scrollDownPage();
            //alert('Reached maximum');
        }
    });

    //Open the selected page in popup window when user clicks the anchor tag
    $('a.modal').click(function () {
        var aElem = $(this);
        showScrollPage(aElem);
		return false;
    });

    $('a.modalNoScroll').click(function () {
        var aElem = $(this);
        showPage(aElem);
        return false;
    });
	
	//Open the current page in popup window when user clicks on the workteaser overlay div
	$('.workteaser .big, .workteaser .small').click(function() {
		var aElem = $(this).prev('a.modal');
		showScrollPage(aElem);
	});

	$('.works_close, #scrollBox, #modalBox').click(function (event) {
        closePopUp(event);
    });
	$("#scrollBox, #modalBox").keyup(function(e) {
		//ESC key is ASCII 27
		if (e.keyCode == 27) { 
			closePopUp(e) ;
		} 
	});		
	$("#scrollBox, #modalBox").children().click(function(e) {
		e.stopPropagation();
	});		
});

function showScrollPage(aElem) {
    currentIndex = $("a.modal").index(aElem);
    var url = aElem.attr('href');
    loadPage(url, '#scrollBox');
    showPopUp('#scrollBox');
	$("#scrollBox").focus();
}

function showPage(aElem) {
    var url = aElem.attr('href');
    loadPage(url, '#modalBox', true);
    showPopUp('#modalBox');
}

function goToByScroll(id){
      $('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}

//Loads the previous page to the first 'item' of 'content' if available
function scrollUpPage() {
    if (currentIndex > 0) {
		var aElem = $("a.modal").get(currentIndex-1);
        var url = $(aElem).attr("href");
        if (url != null && url != '') {
            $.get(
                url,
                function (data) {
                    //alert($("#container_page", $(data)).html()); 
                    if (data != "") {
						$("<div class='item'>" + $(getContentOf, $(data)).html() + "</div>").insertBefore('#scrollBox .content .item:first');
						var imagesCount = $('#scrollBox .content .item:first').find('img, iframe').length;
                        var imagesLoaded = 0;
						$('#scrollBox .content .item:first').find('img, iframe').load( function() {
							++imagesLoaded;
                            if (imagesLoaded >= imagesCount) {
								$("#scrollBox .content .item:eq(1)")[0].scrollIntoView();
							}
                         });
                    }
                },
                "html"
                );
            currentIndex--;
        }
    }
}

//Loads the next page to the last 'item' of 'content' if available
function scrollDownPage() {
	if (currentIndex < maxIndex) {
        var aElem = $("a.modal").get(currentIndex+1);
		var url = $(aElem).attr("href");
        if (url != null && url != '') {
            $.get(
                url,
                function (data) {
                    //alert($("#container_page", $(data)).html()); 
                    if (data != "") {
                        $('#scrollBox .content').append("<div class='item'>" + $(getContentOf, $(data)).html() + "</div>");
                    }
                },
                "html"
                );
            currentIndex++;
        }
    }
}

//Displays the Popup window and scroll to original position
//Document works but html/body won't work for scrollTop in chrome  
function showPopUp(modalBox) {
    if ($.browser.webkit)
        bodyScrollPos = $(document).scrollTop();
    else
        bodyScrollPos = $('html').scrollTop();

    $('html').css('overflow', 'hidden');
    $('html,body').scrollTo(bodyScrollPos, 2);
    $(document).scrollTo(bodyScrollPos, 2);
    $(modalBox).css('display', '');
}

function closePopUp1(event) {
    $('html').css('overflow', 'auto');
    $("#scrollBox").css('display', 'none');
    $('html,body').scrollTo(bodyScrollPos, 2);
    $(document).scrollTo(bodyScrollPos, 2);
}

function closePopUp(event) {
	var modalBox = $($(event.currentTarget).closest("[id='scrollBox'],[id='modalBox']"))[0];
    //var modalBox = $($(event.currentTarget).parent()[0]).parent()[0];
    $('html').css('overflow', 'auto');
    $(modalBox).css('display', 'none');
    $('html,body').scrollTo(bodyScrollPos, 2);
    $(document).scrollTo(bodyScrollPos, 2);
}

//Initialize the URL List
function setClasses() {
    $("ul.arbeit_overview li").addClass('column_234');
    $("ul.arbeit_overview li:nth-child(4n+1)").removeClass("column_234");
    $("ul.arbeit_overview li:nth-child(4n+1)").addClass("column_1");
    
    //Newely updated one - Client has to follow this styling
    $(".projekt_overview div a, .projekt_overview p a, ul.arbeit_overview li div a").addClass("modal");
	maxIndex = $("a.modal").length-1;
}

//Loads the page initially
function loadPage(url,modalBox,blnFlag) {
    if (url != null) {
        $( modalBox + ' .content').html('');
        $.get(
                url,
                function (data) {
                    if (data != "") {
                        var content = $(getContentOf, $(data)).html();
                        $(modalBox + ' .content').append("<div class='item'>" + content + "</div>");
                        $(modalBox).prop('scrollTop', 1);
						if(blnFlag) {
							doTheMap();
						}
                    }
                },
                "html"
                );
    }
}

//Next button implementation if user needs
function showNextPage() {
	if (currentIndex < maxIndex) {
		var aElem = $("a.modal").get(currentIndex+1);
		var url = $(aElem).attr("href");
		loadPage(url, '#scrollBox');	
	}
}

//Previous button implementation if user needs
function showPreviousPage() {
	if (currentIndex > 0) {
		var aElem = $("a.modal").get(currentIndex-1);
		var url = $(aElem).attr("href");
		loadPage(url, '#scrollBox');
	}
}