/* UI scripts that appear on all or almost every page */

// Uses http://jQuery.com

/* ignore console.log if unsupported */
if(!console){var console = {log : function(){},dir : function(){}}}


// Cookie functions from http://www.quirksmode.org/js/cookies.html
function createCookie(name,value,days)
{
	if (days)
	{
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name)
{
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++)
	{
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

function eraseCookie(name)
{
	createCookie(name,"",-1);
}

// on document load
// check if timeline needs to auto demo
$(window).load(function(){
	if(readCookie('timelinedemoed'))
	{
		$('.timeline-head').data('minimised',true);
	}
	else
	{	
		$('.foot-shadow b').hide();
		$('.timeline-head').data('minimised',false);
		$('div.con-timeline').animate({height:'170px'},500,function(){
			$('form').css('height',$(window).height() - 204);
			if($('#currentmonth').length){
				$('.crawl').scrollTo($('#currentmonth').get(0),1000,
				{
					axis:'x',
					offset: -447,
					onAfter: function(){
						$('.timeline-head').triggerHandler('toggletimeline');
					}
				});
			}
		
		});

		createCookie('timelinedemoed',true);
	}

});

$(function(){

	// requires jquery.overlabel.2.js
	$.fn.overlabel();
	
	// timeline
	
	var $crawl = $('.crawl');
	var scrollwidth = $('ol.years').width() - $crawl.width();
	var $currentmonth = $('#currentmonth');
	
	$('li.back a').hover(
		function(){
			$crawl.animate({scrollLeft: 0}, $crawl.get(0).scrollLeft * 3, 'easeInSine');
		},
		function(){
			$crawl.stop();
		}
	);
	
	$('li.forward a').hover(
		function(){
			$crawl.animate({scrollLeft: scrollwidth}, (scrollwidth - $crawl.get(0).scrollLeft) * 3, 'easeInSine');
		},
		function(){
			$crawl.stop();
		}
	);
	
	
	var $timelinepop = $('<div id="timeline-pop"><div class="top"></div><div class="body"></div><div class="bottom"></div></div>').appendTo('.frame-footer').hide();
	$timelinepop.data('open',false).hover(
	  function(){
		$(this).data('overpop',true);
	},
	  function(){
		$(this).hide();
		$(this).data('$opener').removeClass('hover');
		$(this).data('overpop',false);
	});
	
	$('li.quarter div.timeinfo').hoverIntent({
	  over: function(){
		$(this).addClass('hover');
		$timelinepop
			.css('left',$(this).offset().left - (106 - ($(this).outerWidth()/2)))
		//	.css('bottom',($(this).parent().position().top * -1) + 135)
			.data('$opener',$(this))
			.find('.body').empty().append($(this).contents().clone()).end().show();
	  },
	  out: function(){
		if(!$timelinepop.data('overpop'))
		{
			$(this).removeClass('hover');
			if($timelinepop.data('$opener').get(0) == this)
			{
				$timelinepop.hide();
			}
		}
	  },
	  interval: 50,
	  timeout: 300 // increased from 200 for greater distance to pop-up
	});
	
	// need to reverse logic in relation to existance of data - maximised?
	
	$('.timeline-head').bind('toggletimeline',function(){
		
		if(!$(this).data('minimised'))
		{
			$(this).parent().animate({height:'33px'},400,function(){
				$('.foot-shadow b').show();
				$('form').css('height',$(window).height() - 67);
			});
			$('.timeline-head a').removeClass('open');
			$(this).data('minimised',true);
	    }
		else
		{
			$('.foot-shadow b').hide();
			$(this).parent().animate({height:'170px'},400,function(){
				$('form').css('height',$(window).height() - 204);
				if($('#currentmonth').length){
					$('.crawl').scrollTo($('#currentmonth').get(0),1000,
					{
						axis:'x',
						offset: -447
					});
				}
			});

			$('.timeline-head a').addClass('open');
			$(this).data('minimised',false);
		}
	});


	$('.timeline-head a').click(function(){
		$('.timeline-head').triggerHandler('toggletimeline');
		return false;
	});
	
	
	
	// set height of form to match viewport - footer height
	$(window).resize(function(){
		$('form').height(($(window).height() - $('div.frame-footer:first').height())+'px');
	});
	$(window).trigger('resize');
	
	
});