'use strict';

// Put email link in document, stop most spam bots (at least we try)
$(function () {
	var user_name_reservation 	= 'reserveren',
		user_name_dinner		= 'diner',
		at 						= '@',
		domain_name 			= 'nichtencircus',
		tld 					= '.nl';
		
	$('#insert_email_reservation').html('<a href="mailto:' + user_name_reservation + at + domain_name + tld + '">' + user_name_reservation + at + domain_name + tld + '</a>');
	$('#insert_email_dinner').html('<a href="mailto:' + user_name_dinner + at + domain_name + tld + '">' + user_name_dinner + at + domain_name + tld + '</a>');
});

// Add moving clouds on the wrapper
$(function () {
	var clouds = {
			cloud1: {
				url		: 'images/cloud1.png',
				width	: 322,
				height	: 206,
				opacity	: 1,
				startX	: 600,
				startY	: 350,
				startDir: 'left',
				speed	: 78000
			},
			cloud2: {
				url		: 'images/cloud2.png',
				width	: 218,
				height	: 139,
				opacity	: 0.9,
				startX	: 100,
				startY	: 440,
				startDir: 'right',
				speed	: 80000
			},
			cloud3: {
				url	: 'images/cloud2.png',
				width	: 218,
				height	: 139,
				opacity	: 0.35,
				startX	: 350,
				startY	: 800,
				startDir: 'left',
				speed	: 78000
			}
		},
		wrapperWidth = 960;
	
	$.each(clouds, function (i, cloud) {
		var cloudHolder = $('<div />');
		
		cloudHolder
			.attr('id', i)
			.attr('class', 'cloud')
			.css({
				'position' 			: 'absolute',
				'height' 			: cloud.height,
				'width' 			: cloud.width,
				'left'				: cloud.startX + 'px',
				'top'				: cloud.startY + 'px',
				'backgroundImage'	: 'url(' + cloud.url + ')',
				'zIndex'			: 0
			});
			
		if (!$.browser.msie) {
			// Guess which browser screws up opacity on pngs with alpha transparency (up to version 8 at least)?
			// Yeah I know: every time you use browser sniffing a kitten dies. I don't care. I hate kittens (not really)
			cloudHolder.css({
				'opacity' : cloud.opacity
			});
		}
		
		$('#wrapper').append(cloudHolder);
		
		if (cloud.startDir === 'left') {
			animateLeft(cloudHolder, cloud.speed);
			
		} else {
			animateRight(cloudHolder, cloud.speed);
			
		}
	});
	
	function animateLeft(cloudHolder, speed) {
		$(cloudHolder).animate({
				'left' : (0 - cloudHolder.width())
		}, 
		speed, 
		'linear',
		function () {
			animateRight(cloudHolder, speed);
		});
	}
	
	function animateRight(cloudHolder, speed) {
		$(cloudHolder).animate({
				'left' : (wrapperWidth)
		}, 
		speed, 
		'linear',
		function () {
			animateLeft(cloudHolder, speed);
		});
	}
});

// jkScrollTo plugin
(function ($) {
	$.fn.jkScrollTo = function(settings) {
		var config = {
			speed	: 800
		};

		if (settings) $.extend(config, settings);
		
		this.each(function() {
			$(this).click(function (event) {
				event.preventDefault();
				var target, targetOffset;
				if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
				&& location.hostname == this.hostname) {
					target = $(this.hash);
					target = target.length && target || $('[name=' + this.hash.slice(1) +']');		
					if (target.length) {
						targetOffset = target.offset().top;
						$('html,body')
						.animate({scrollTop: targetOffset}, config.speed, function () {
							location.hash = $(target).attr('id');
						});
					}
				}
			});
		});
		return this;
 };
})(jQuery);

$(function () {
	$('#nav a').jkScrollTo();
});

// Make nav transparent when mouse out
$(function () {
	$('#nav').css({
		'opacity' : 0.6
	});
	
	$('#nav').hover(
		function () {
			$(this).animate({
				opacity: 1
			}, 200);
		},
		function () {
			$(this).animate({
				opacity: 0.6
			}, 200);
		}
	);
});

// Scroll gallery
$(function () {
	var gallerySize 	= $('#gallery li').size(),
		imageWidth 		= 122,
		imageMargin 	= 30,
		slideWidth 		= imageWidth + imageMargin,
		galleryWidth 	= (gallerySize * slideWidth) - imageMargin;
		
	$('#gallery li:last-child').addClass('last');
	$('#gallery').css({width: galleryWidth + 'px'});
	
	function addInactive(offset) {
		var galleryCssPosition = $('#gallery').css('left'),
			galleryPosition = parseInt(galleryCssPosition.substr(0, galleryCssPosition.length - 2)) + parseInt(offset);

		if (galleryPosition === 0) {
			$('#prev').addClass('inactive').attr('title', '');
		} else {
			$('#prev').removeClass('inactive').attr('title', 'Terug');
		}
		
		if (galleryPosition === parseInt('-' + ((gallerySize - 3) * slideWidth))) {
			$('#next').addClass('inactive').attr('title', '');
		} else {
			$('#next').removeClass('inactive').attr('title', 'Volgende');
		}
	}
	
	$('#next').click(function (event) {
		event.preventDefault();
		if (!$(this).hasClass('inactive')) {
			$('#gallery').animate({
				'left': '-=' + slideWidth
			}, 'slow', addInactive('-' + slideWidth));
		}
	});
	
	$('#prev').click(function (event) {
		event.preventDefault();
		if (!$(this).hasClass('inactive')) {
			$('#gallery').animate({
				'left': '+=' + slideWidth
			}, 'slow', addInactive('+' + slideWidth));
		}
	});

});

//Modal window
$(function() {
	$('a[rel="expose"]').click(function(evt) {
		
		var maskHeight 	= $(document).height(),
			maskWidth 	= $(window).width(),
			title 		= $(this).find('img').attr('title'),
			content 	= '<img src="' + $(this).attr('href') + '" alt="' + title.slice(0, -23) + '">',
			modal 		= '<div id="modal"><a href="#" title="Sluiten" id="modal_close">close</a><h3>' + title.slice(0, -23)  + '</h3>';
		
		$('#modal').remove();
		$('#wrapper').after('<div id="mask" />');
	
		$('#mask').drawMask().fadeIn(500, insertModal);
		
		function insertModal() {
			modal += content;
			$('#mask').after(modal).children('#modal');
			$('#modal')
				.css({
					'display':'block'
				}).center(0);
		}
		
		$('a#modal_close').live('click', function(evt) {
			evt.preventDefault();
			removeModal ();
		});

		$('#mask').click(function(evt) {
			evt.preventDefault();
			removeModal ();
		});
		
		return false;
	});
	// Resize mask
	$(window).bind('scroll resize', function() {
		if($('#mask').length) {
			$('#mask').drawMask();
		}
	});
	// Reposition modal
	$(window).bind('resize', function()	{
		if($('#modal').length) {
			$('#modal').css("left", ( $(window).width() - $('#modal').width() ) / 2 + $(window).scrollLeft() - 32 + "px");
		}
	});
});

// Center on page
$.fn.center = function (offset) {
    this.css({
		"position" 	:	"absolute",
		"top"	  	: $(window).scrollTop() + 100 + "px",
		"left"		: ($(window).width() - this.width() ) / 2+$(window).scrollLeft() - 32 + "px"
	});
    return this;
}

//	Draw mask
$.fn.drawMask = function () {
	var maskHeight 	= $(document).height(),
		maskWidth 	= $(window).width();
	this.css({
		'opacity' 	: 0.8,
		'width'		: maskWidth,
		'height'	: maskHeight
	});  
	return this;
}

//Remove modal window
function removeModal () {
	$('#modal').fadeOut(200, function() { $('#modal').remove(); });
	$('#mask').fadeOut(200, function() { $('#mask').remove(); });
}