var startPage = 1;

var PAGE_WIDTH = 1024;
var PAGE_HEIGHT = 690;

var currentPage = 0;
var currentPageDown = 0;

var lastPage = 0;
var lastPageDown = 0;

var maxPages;
var maxPagesDown;
var speed = 500;

var PAGE_DOWN;

var VERT = false;
var HOR = false;

var holder;

var timer;

var autoScroll = false;

/*
var swipeOptionsHor=
{
	triggerOnTouchEnd : true,	
	swipeStatus : swipeStatus,
	threshold:50
}

var swipeOptionsVert=
{
	triggerOnTouchEnd : true,	
	swipeStatus : swipeStatusVert,
	threshold:50
}
*/

/*
function gup( val )
{
  var value = val.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+value+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}
*/

/*
function postEmailWithMessage(message)
{
  $.post("email.php", { mailTo: "gerbrand@cpp.nl", message: message },
     function(data) {
    if(data == "succes"){
       navigateToPage(7);
     $(".interesse").val("");
    }
    else{
     alert("Uw mail is niet verzonden probeer het later nog eens");
    }
     });
}
*/

/*
function swipeStatusVert(event, phase, direction, distance)
{
	if(!HOR)
	{	

		if(phase=="move" && (direction=="up" || direction=="down") )
		{
			//console.log("vertical is true");
			VERT = true;
			var duration = 0;

			if(direction == "down")
				scrollVertical((PAGE_HEIGHT * currentPageDown) - distance, duration);
			else if(direction == "up")
				scrollVertical((PAGE_HEIGHT * currentPageDown) + distance, duration);

		}
	}
		
	if ( phase == "cancel"){
		
		if(HOR)
		{
			scrollHorizontal(PAGE_WIDTH * currentPage, speed);
		}
		if(VERT)
		{
			scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		}
			
		HOR = false;
		VERT = false;
	}
		
	if ( phase =="end" && (direction=="up" || direction=="down") )
	{
		
		if(HOR)
		{
			//WHEN VERTICAL SCROLL ENDS AND WE STILL HAVE HOR ACTIVE WE CANCEL HORIZONTAL//
			scrollHorizontal(PAGE_WIDTH * currentPage, speed);	
		}
		if(VERT)
		{
			if (direction == "up")
				imageUp();
			else if (direction == "down")
				imageDown();
		}
		
		VERT = false;
		HOR = false;

	}

}
*/

/*
function swipeStatus(event, phase, direction, distance)
{
	
	if(!VERT)
	{

		if( phase=="move" && (direction=="left" || direction=="right") )
		{	
			//console.log("horizontal is true");
			
			HOR = true;
			var duration=0;

			if (direction == "left")
				scrollHorizontal((PAGE_WIDTH * currentPage) + distance, duration);
			else if (direction == "right")
				scrollHorizontal((PAGE_WIDTH * currentPage) - distance, duration);

		}
	}

	if ( phase == "cancel")
	{
		if(HOR)
		{
			scrollHorizontal(PAGE_WIDTH * currentPage, speed);
		}
		if(VERT)
		{
			scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		}
		
		HOR = false;
		VERT = false;
	}

	if ( phase =="end" && (direction=="left" || direction=="right"))
	{	
		if(VERT)
		{
			//WHEN HORIZONTAL SCROLL ENDS AND WE STILL HAVE VERT ACTIVE WE CANCEL VERTICAL//
			scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		}
		
		if(HOR)
		{
			if (direction == "right")
				previousImage();
			else if (direction == "left")
				nextImage();
		}
		
		VERT = false;
		HOR = false;
	}
	
}
*/

function scrollHorizontal(distance, duration){
	
	var value = (distance<0 ? "" : "-") + Math.abs(distance).toString();
	
	if(BrowserDetect.browser != "Explorer" && BrowserDetect.browser != "Firefox"){

		$("#holder").css("-webkit-transition-duration", (duration/1000).toFixed(1) + "s");
		$("#holder").css("-webkit-transform", "translate3d("+ value +"px,0px,0px)");
		
		$("#holder").bind('webkitTransitionEnd', function() {
		  	if(PAGE_DOWN != 0){
		  		navigateToPage(PAGE_DOWN);
			}
			
		  $("#holder").unbind('webkitTransitionEnd');
		});	
	}
	else{
		
		$("#holder").animate({marginLeft: value}, 500, function() {
		    if(PAGE_DOWN != 0)
		  		navigateToPage(PAGE_DOWN);
		  });
	}
}

function scrollVertical(distance, duration)
{
	var value = (distance < 0 ? "" : "-") + Math.abs(distance).toString();
	
	var targetColumn = getCurrentColumn();

	if(BrowserDetect.browser != "Explorer" && BrowserDetect.browser != "Firefox"){
		
		targetColumn.css("-webkit-transition-duration", (duration/1000).toFixed(1) + "s");
		targetColumn.css("-webkit-transform", "translate3d(0px," + value + "px,0px)");
		
	}else{
		
		targetColumn.animate({marginTop: value}, 500, function() {
		    //transition complete
		});
	}
}

function setAllColumns()
{
	$("#holder").find("div").each(function(){
		
		if($(this).attr("class") == "column")
		{
			//$(this).swipe( swipeOptionsVert);
		}
	});
	
}

function getCurrentColumn()
{
	var currentColumn;
	
	$("#holder").find("div").each(function(){
		if($(this).attr("class") == "column")
		{
			if(currentPage == $(this).index())
			{	
				currentColumn = $(this);
			}
		}
	});
	
	return currentColumn;
}

function previousImage(){
	currentPage = Math.max(currentPage-1, 0);
	scrollHorizontal( PAGE_WIDTH * currentPage, speed);
	
	setMaxPagesForColumn();
	
	currentPageDown = 0;
	resetAllColumns();
	handleNavForCurrentPage();
}

function nextImage(){
	currentPage = Math.min(currentPage+1, maxPages-1);
	scrollHorizontal( PAGE_WIDTH * currentPage, speed);
	
	setMaxPagesForColumn();
	
	currentPageDown = 0;
	resetAllColumns();
	handleNavForCurrentPage();
}

function imageDown(){
	
	setMaxPagesForColumn();
	
	if(currentPageDown > 0){
		currentPageDown--;
		scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		handleNavForCurrentPage();
	}
	else{
		scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		VERT = false;
	}
}

function imageUp(){
	
	setMaxPagesForColumn();
	
	if(currentPageDown < maxPagesDown-1){
		currentPageDown++;
		scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		handleNavForCurrentPage();	
	}
	else{
		scrollVertical(PAGE_HEIGHT * currentPageDown, speed);
		VERT = false;
	}
}

function navigateToColumn(value, showBack){	
	
	value -= 1;
	
	lastPage = currentPage + 1;
	lastPageDown = currentPageDown;
	
	if(currentPage != value)
	{	
		if(value < getColumnCount())
		{
			currentPage = value;
			scrollHorizontal( PAGE_WIDTH * value, speed);
			
			if(showBack)
				showBackButton();
		}
		
	}else
	{
		console.log("we are on the right page");
		if(PAGE_DOWN != 0){
	  		navigateToPage(PAGE_DOWN);
		}
	}
	
	handleNavForCurrentPage();
}

function setStartColumn(value)
{
	value -= 1;
	
	var distance = PAGE_WIDTH * value;
	
	var targetValue = (distance<0 ? "" : "-") + Math.abs(distance).toString();
	
	currentPage = value;
	
	if(BrowserDetect.browser != "Explorer" && BrowserDetect.browser != "Firefox"){
		
		$("#holder").css("-webkit-transition-duration", "0.01s");
		$("#holder").css("-webkit-transform", "translate3d("+ targetValue +"px,0px,0px)");
		
	}else
	{
		$("#holder").animate({marginLeft: value}, 1, function() {
			//do nothing
		  });
	}
	
	handleNavForCurrentPage();
}

function showBackButton()
{
	if(BrowserDetect.browser != "Explorer")
	{
		$("#back_column").animateWithCss({opacity: "1"}, 500);
	}
	else
	{
		$("#back_column").fadeIn(500);
	}
}

function hideBackButton()
{
	if(BrowserDetect.browser != "Explorer")
	{
		$("#back_column").animateWithCss({opacity: "0"}, 500);
	}
	else
	{
		$("#back_column").fadeOut(500);
	}
}

function navigateToPage(value){
	
	if(value < getPageDownCountForColumn() || value == getPageDownCountForColumn())
	{	
		value -=1;
		currentPageDown = value;
		scrollVertical( PAGE_HEIGHT * value, speed);
		
		PAGE_DOWN = 0;
		
		handleNavForCurrentPage();
	}
}

function setPageDown(value){
	
	PAGE_DOWN = value;
}

function handleNavForCurrentPage()
{
	//console.log('handle nav for currentpage');
	
/*
	if(BrowserDetect.OS != "iPad")
	{
*/
		
		if(BrowserDetect.browser != "Explorer")
		{
			//alert(currentPageDown);
			
   			if(currentPageDown == 0)
				$("#pageUp").animateWithCss({opacity: "0"}, 500);
   			else
   				$("#pageUp").animateWithCss({opacity: "1"}, 500);
   			
   			if(currentPageDown + 1 == getPageDownCountForColumn())
   				$("#pageDown").animateWithCss({opacity: "0"}, 500);
   			else
   				$("#pageDown").animateWithCss({opacity: "1"}, 500);
			
   			if(currentPage == 0)
   				$("#prevPage").animateWithCss({opacity: "0"}, 500);
   			else
   				$("#prevPage").animateWithCss({opacity: "1"}, 500);
   			
   			if(currentPage + 1 == getColumnCount())
   				$("#nextPage").animateWithCss({opacity: "0"}, 500);
   			else
   				$("#nextPage").animateWithCss({opacity: "1"}, 500);
		}
		else
		{
			if(currentPageDown == 0)
				$("#pageUp").fadeOut(500);
   			else
   				$("#pageUp").fadeIn(500);
   			
   			if(currentPageDown + 1 == getPageDownCountForColumn())
   				$("#pageDown").fadeOut(500);
   			else
   				$("#pageDown").fadeIn(500);
   				
   			if(currentPage == 0)
   				$("#prevPage").fadeOut(500);
   			else
   				$("#prevPage").fadeIn(500);
   			
   			if(currentPage + 1 == getColumnCount())
   				$("#nextPage").fadeOut(500);
   			else
   				$("#nextPage").fadeIn(500);
		}
/* 	} */

	setActiveHorizontalNav();
	setVerticalNav();
}

function setHorizontalNav()
{
	$(".simple-nav-h").empty();
	
	for(var i=0; i< getColumnCount(); i++)
	{
		$(".simple-nav-h").append("<li><a id='hor' href='#'>" + (i+1) + "</a></li>");
	}
	
	$('a').click(function(){
		
		if($(this).attr('id') == "hor")
			navigateToColumn($(this).html(), false);
		
	});
	
	setActiveHorizontalNav();
	
}

function setActiveHorizontalNav()
{
	$(".simple-nav-h").find("li").each(function(){
		
		if(currentPage == $(this).index())
		{	
			$(this).find('a').addClass('active');
		}
		else
		{
			$(this).find('a').removeClass('active');
		}
	});
}

function setVerticalNav()
{
	$(".simple-nav-v").empty();
	
	if(getPageDownCountForColumn() == 1)
	 	$(".simple-nav-v").hide();
	else
		$(".simple-nav-v").show();
	
	
	for(var i=0; i<getPageDownCountForColumn(); i++)
	{
		$(".simple-nav-v").append("<li><a id='vert' href='#'>" + (i+1) + "</a></li>");
	}
	
	$('a').click(function(){
		
		if($(this).attr('id') == "vert")
			navigateToPage($(this).html());
		
	});
	
	setActiveVerticalNav();
}

function setActiveVerticalNav()
{
	$(".simple-nav-v").find("li").each(function(){
		
		if(currentPageDown == $(this).index())
		{	
			$(this).find('a').addClass('active');
		}
	});
}

function getYPosForPage(value)
{
	var yPos;
	
	if(value > 0)
	{
		yPos = "-" + (PAGE_HEIGHT * currentPageDown);	
	}
	else
	{
		yPos = (PAGE_HEIGHT * currentPageDown);

	}
	
	return yPos;
}

function getXPosForPage(value)
{
	
	var xPos;
	
	if(value > 0){
		xPos = "-" + (PAGE_WIDTH * currentPage);	
	}else
	{
		xPos = (PAGE_WIDTH * currentPage);
	}
	
	return xPos;
	
}


function resetAllColumns()
{
	$("#holder").find("div").each(function(){
		
		if($(this).attr("class") == "column")
		{
			if(currentPage != $(this).index())
			{	
				if(BrowserDetect.browser != "Explorer" && BrowserDetect.browser != "Firefox")
				{
					$(this).css("-webkit-transform", "translate3d(0px,0px,0px)");
				}
				else
				{
					$(this).animate({marginTop: 0}, 500 );
				}
			}
		}
	});
}

function setMaxPagesForColumn()
{
	$("#holder").find("div").each(function(){
		if($(this).attr("class") == "column")
		{
			if(currentPage == $(this).index())
			{	
				maxPagesDown = $(this).children().length;
			}
		}
	});
}

function getPageDownCountForColumn()
{
	var count;
	
	$("#holder").find("div").each(function(){
		if($(this).attr("class") == "column")
		{
			if(currentPage == $(this).index())
			{	
				count = $(this).children().length;
			}
		}
	});
	
	return count;
}

function getColumnCount()
{
	return $("#holder").children().length;
}

function showNavigation()
{
/*
	if(BrowserDetect.OS != "iPad")
	{
*/
		
		if(BrowserDetect.browser != "Explorer")
		{
			$(".nav").fadeIn();
		}
		else
		{
			handleNavForCurrentPage();
		}
//	}
}

function hideNavigation()
{
/*
	if(BrowserDetect.OS != "iPad")
	{
*/
		if(BrowserDetect.browser != "Explorer")
		{
			
			$(".nav").fadeOut();
		}
		else
		{
			$(".nav").hide();
		}
/* 	} */
}

function timerFired()
{
	console.log("timer fired");
	
	console.log("curent: " + currentPage + " columns" + getColumnCount());
	
	if(currentPage < getColumnCount() - 1)
		nextImage();
	else
		navigateToColumn(1);
	
	setTimer();
}

function setTimer()
{
	timer = setTimeout("timerFired();", 15000);
}


$("document").ready(function(){
	
	if(autoScroll)
		setTimer();
	
	$("#holder").width(PAGE_WIDTH * getColumnCount());
	
	setHorizontalNav();
	handleNavForCurrentPage();
	maxPages = $("#holder").children().length;
	
	var contentLeft;
	var contentRight;
	var contentTop;
	var contentBottom;
	
	// if(BrowserDetect.OS != "iPad")
	// {
	// 	$(window).resize(function(){
	// 
	// 		console.log("window resizing!");
	// 
	// 		contentLeft = $("#content").offset().left;
	// 		contentRight = $("#content").offset().left + $("#content").width();
	// 		contentTop = $("#content").offset().top;
	// 		contentBottom = $("#content").offset().top + $("#content").height();
	// 
	// 	});
	// 	
	// 	contentLeft = $("#content").offset().left;
	// 	contentRight = $("#content").offset().left + $("#content").width();
	// 	contentTop = $("#content").offset().top;
	// 	contentBottom = $("#content").offset().top + $("#content").height();
	// 	
	// 	$("html").mousemove( function(e) {
	// 		
	//    		mouseX = e.pageX; 
	//    		mouseY = e.pageY;
	// 		
	//    		if(mouseX < contentLeft || mouseX > contentRight || mouseY < contentTop || mouseY > contentBottom)
	// 		{
	// 			hideNavigation();
	// 		}
	// 		else
	// 		{
	// 			showNavigation();
	// 		}
	//  	});
	// 
	// }

	$(document).keydown(function(e){
		
		if(e.keyCode == 37)
		{
			previousImage();
		}
		if(e.keyCode == 38)
		{
			imageDown();
		}
		if(e.keyCode == 39)
		{
			nextImage();
		}
		if(e.keyCode == 40)
		{
			imageUp();
		}
	});
	
/*
	if (window.navigator.userAgent.indexOf('iPad') != -1) {
		if (window.navigator.standalone == true) {
			
			$("#content").height(748);
			$(".page").height(748);
			
			PAGE_HEIGHT = 748;
		}
	}
*/
	
/*
	if(BrowserDetect.OS == "iPad")
	{
		$("#content").css("top", 0);
		$("#content").css("margin-top", 0);
		$(".nav").hide();
	}
*/

	if(BrowserDetect.browser != "Explorer")
	{
		$(function()
		{				
/*
			holder = $("#holder");
			holder.swipe( swipeOptionsHor );
*/
			
			
			setAllColumns();
		});
	}
	
	$("#prevPage").click(function(){
		previousImage();	
	});
	
	$("#nextPage").click(function(){
		nextImage();
	});
	
	$("#pageUp").click(function(){
		imageDown();
	});
	
	$("#pageDown").click(function(){
		imageUp();
	});
	
	$(".btn").click(function(){
		
		lastPage = currentPage + 1;
		lastPageDown = currentPageDown;
		
		var value = $(this).html();	
		navigateToColumn(value, false);
	});
	
	$(".cust_btn").click(function(){
		
		var allValues = $(this).attr("href").split("_");
		
		if(allValues.length > 1)
			var columnValue = allValues[1];
		if(allValues.length > 2)
			PAGE_DOWN = allValues[2];
	
		if(columnValue < getColumnCount() + 1)
			navigateToColumn(columnValue, true);
	});
	
/*
	var col_param = gup( 'col' );
	var page_param = gup( 'page' );
	
	if(col_param && page_param)
	{
		PAGE_DOWN = page_param;
		navigateToColumn(col_param, false);
	}
	
	if(col_param && !page_param)
	{
		navigateToColumn(col_param, false);
	}
*/
	
	$("#back_column").click(function(){
		
		currentPageDown = lastPageDown;		
		navigateToColumn(lastPage, false);
		hideBackButton();
		
	});
	
/*
  $(".interesse-send").click(function(){
    
    var message = "Ik ben geinteresseerd in deze menu kaart en ben bereikbaar via dit e-mail adres: \n\n";
    message += $(".interesse").val();
    message += "\n\nVerstuurd vanaf de ipad menukaart webapp";
    
    postEmailWithMessage(message);
  
    //alert("intresse clicked with values: " + $(".interesse").val());
  });
*/
	
	if(startPage != 0)
	{
		setStartColumn(startPage);
	}
	
});