/*--JavaScript Document---------------------------*/

$(document).ready(function() {
						   
	$('#sliderWrap').css('background-image', 'none');	// For JS version
	$('#introBox div.sliderVerticalWrap, #commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
	$('#introBox div.viewContent').css({overflow: 'hidden', width: '540px'});	// For JS version
	$('#commentaryBox div.viewContent, #commentaryBox div.viewImage').css({overflow: 'hidden', width: '410px'});	// For JS version
	$('#timeline div.decade-8, #timeline div.decade-9, #timeline div.decade-10').addClass('rightPosition');
	$.introBoxVerticalScroll();
	
	$('#introBox a.startButton').click(function() {
		if ($.browser.msie) {
			$('#introBox').hide();
			$('#timeline>div>div').show();

		} else {
			$('#introBox').fadeOut(300);
			$('#timeline>div>div').fadeIn(200);
		}
		$('#overlay').hide();
		return false;
	});
	
	$('#controls form input:submit').hide(); //hide submit button if non-js version is used with JS support (query string in url)
	$('#introBox div.content p').css('width','100%');
		
	
	// timline slider //////////////////////////////////////////////////////////////////////
	var content = $('#content');
	var timeline = $('#timeline');
//	var itemsWidth = timeline.innerWidth() - content.outerWidth();
//	//console.log(itemsWidth);
	
	$('div#slider').slider({
		min: 0,
		max: 5460,
		handle: '.handle',
		stop: function (event, ui) {
			var timelineValue = Math.round(ui.value / 78) * -78;
			var handleValue = Math.round(ui.value / 78) * 1.42857 + '%';
			//ui.value = timelineValue;
			//console.log(ui.value);
			timeline.animate({'left' : timelineValue}, 300, function() {$.eventsPosition();});
			var handle = $('a.ui-slider-handle');
			handle.animate({'left' : handleValue}, 300);
		},
		slide: function (event, ui) {
			timeline.css('left', ui.value * -1);
		}
	});

	$('a.controlForward').click(function() {
		var timelineValue = Math.round($('div#slider').slider('value') / 780) * 780;
		var timelinePosition =  (timelineValue + 780) * -1;
		if (timelinePosition > -6240) {		//end of timeline
			$('div#slider').slider('value', timelinePosition * -1);
			timeline.animate({'left' : timelinePosition}, 200, function() {$.eventsPosition()});
		}
		return false;
	});
	
	$('a.controlBack').click(function() {
		var timelineValue = Math.round($('div#slider').slider('value') / 780) * 780;
		var timelinePosition = (timelineValue - 780) * -1;
		if (timelinePosition < 1) {		//begining of timeline
			$('div#slider').slider('value', timelinePosition * -1);
			timeline.animate({'left' : timelinePosition}, 200, function() {$.eventsPosition();});
		}
		return false;
	});
	/////////////////////////////////////////////////////////////////////////////////////////////
	
	
	// Events functionalities ///////////////////////////////////////////////////////////////////
	//	$('div.event a:hover span.infoBox').css('display', 'none');
	//	$('div.event a').hover(
	//		function() { $(this).children('span.infoBox').fadeIn(); },
	//		function() { $(this).children('span.infoBox').fadeOut(); }
	//	);
	if($.browser.msie) {
		$('div.event a').hover(
			function() {
				$('#timeline div.period').css('z-index',100);
				$(this).parent().parent().css('z-index',1000);
				$(this).children('span.infoBox').show(); 
				if($(this).children('span.infoBox').children('img').width()>183) { 
					$(this).children('span.infoBox').children('img').attr('width',183); 
				} 
			},
			function() { $(this).children('span.infoBox').hide(); }
		);
	} else {
		$('div.event span.infoBox').css({opacity: 0});
		$('div.event a').hover(
			function() { 
				$(this).children('span.infoBox').animate({opacity: 1},300); 
				if($(this).children('span.infoBox').children('img').width()>183) { 
					$(this).children('span.infoBox').children('img').attr('width',183);
				} 
			},
			function() { $(this).children('span.infoBox').stop().animate({opacity: 0},300); }
		);
	}
	
	$('div.event a.scientificEvent').click(function() { 
		$('#overlay').show();
		if ($.browser.msie) {
			$('#commentaryBox').show();
		} else {
			$('#commentaryBox').fadeIn(300);
		}
		$('#commentaryBox').html('<img src="images/ajax-loader.gif" alt="loading" class="ajaxLoading"');
		var id = $(this).attr('id');
		var url = 'commentary.aspx?eventId='+id+'&action=box'
		$.ajax({
			type: "GET",
			url: url,
			success: function(data){$('#commentaryBox img.ajaxLoading').fadeOut(200, function() {$(this).remove()}); $('#commentaryBox').html(data);},
			complete: function() {
				$('#commentaryBox div.viewContent, #commentaryBox div.viewImage').css({overflow: 'hidden', width: '410px'});	// For JS version
				
				//set the font size
				if ($('#font-small').hasClass('active')) {
					
					$('#popupFontSize a.popup-font-small').addClass('active');
					
					$('#commentaryBox h4').css('font-size','11px');
					$('#commentaryBox h3').css('font-size','14px');
					$('#commentaryBox div.informationTab ul a').css('font-size','10px');
					$('#commentaryBox ul.tabs a').css('font-size','11px');
					$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','10px');
					$('#commentaryBox div.imagesTab a').css('font-size','11px');					
					$('#commentaryBox div.content').css('font-size','11px');
					
				} else if ($('#font-medium').hasClass('active')) {
					
					$('#popupFontSize a.popup-font-medium').addClass('active');
					
					$('#commentaryBox h4').css('font-size','12px');
					$('#commentaryBox h3').css('font-size','15px');
					$('#commentaryBox div.informationTab ul a').css('font-size','11px');
					$('#commentaryBox ul.tabs a').css('font-size','12px');
					$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','11px');
					$('#commentaryBox div.imagesTab a').css('font-size','12px');		
					$('#commentaryBox div.content').css('font-size','12px');
					
				} else if ($('#font-large').hasClass('active')) {
					
					$('#popupFontSize a.popup-font-large').addClass('active');
					
					$('#commentaryBox h4').css('font-size','14px');
					$('#commentaryBox h3').css('font-size','17px');
					$('#commentaryBox div.informationTab ul a').css('font-size','12px');
					$('#commentaryBox ul.tabs a').css('font-size','13px');
					$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','12px');
					$('#commentaryBox div.imagesTab a').css('font-size','13px');		
					$('#commentaryBox div.content').css('font-size','14px');
					
				}
				
				$.commentaryInformationVerticalScroll(); 
				$('#commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
			}
		});
		$('#commentaryList ul').slideUp(250);
		$('#allCategories').removeClass('active');
		return false;
	});
	
	$('div.event a.historicEvent').click(function() { 
//		//console.log($('span.warning').length);
//		if ($('span.warning').length==0) {
//			$(this).children('span').append('<span class="warning">No additional info for this type of event!</span>');
//			setTimeout("$('span.warning').fadeOut(300, function() { $('span.warning').remove() })",2000)
//		}
		return false; 
	});
	/////////////////////////////////////////////////////////////////////////////////////////////
	
	
	// Commentary box functionalities ///////////////////////////////////////////////////////////
	$('#commentaryBox a.closeTab').live("click", function(){
		if($.browser.msie) {
			$('#commentaryBox').hide();
		} else {
			$('#commentaryBox').fadeOut(300);
		}
		$('#overlay').hide();
		$('#commentaryBox .imagesTab').removeClass('active');
		$('#commentaryBox .informationTab').addClass('active');
		return false;
	});
	$('#commentaryBox a.informationTab').live("click", function(){
		if (!$('#commentaryBox div.informationTab').hasClass('active')) {
			$('#commentaryBox .imagesTab').removeClass('active');
			$('#commentaryBox .informationTab').addClass('active');
		}
		return false;
	});
	$('#commentaryBox a.imagesTab').live("click", function(){
		if (!$('#commentaryBox div.imagesTab').hasClass('active')) {
			$('#commentaryBox .informationTab').removeClass('active');
			$('#commentaryBox .imagesTab').addClass('active');
		}
		if ($('#commentaryBox div.imagesTab img').width()>410) { $('#commentaryBox div.imagesTab img').attr('width',410); }
		$.commentaryImagesVerticalScroll();
		return false;
	});	
	
	$('#commentaryBox a.furtherInformation').live("click", function(){
		if ($('#commentaryBox div.content:first').hasClass('active')) {
			//console.log('a');
			$('#commentaryBox div.content:first').fadeOut().removeClass('active');
			$('#commentaryBox div.content:last').fadeIn().addClass('active');
			$(this).text('Back to commentary');
		} else {
			//console.log('b');
			$('#commentaryBox div.content:last').fadeOut().removeClass('active');
			$('#commentaryBox div.content:first').fadeIn().addClass('active');
			$(this).text('Further information');
		}
		$('#commentaryBox div.content.active').css('top',0);
		$.commentaryInformationVerticalScroll();
		return false;
	});
	$('div.imagesTab a.image').live("click", function(){
		var url = $(this).attr('href');
		$('#commentaryBox div.imagesTab').html('<img src="images/ajax-loader.gif" alt="loading" class="ajaxLoading"');
		$.ajax({
			type: "GET",
			url: url,
			success: function(data) {
				$('#commentaryBox img.ajaxLoading').fadeOut(200, function() {$(this).remove()}); 
				$('#commentaryBox div.imagesTab' ).html(data); 																	
			},
			complete: function(data) {				
				$('#commentaryBox div.viewContent, #commentaryBox div.viewImage').css({overflow: 'hidden', width: '410px'});	// For JS version
				$('#commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
				$('#commentaryBox div.imagesTab img').load(function() { 
					if ($('#commentaryBox div.imagesTab img').width()>410) { $('#commentaryBox div.imagesTab img').attr('width',410); }
					$.commentaryImagesVerticalScroll();
				});
			}
		});
		return false;
	});
	/////////////////////////////////////////////////////////////////////////////////////////////
	
	// Commentary list functionality ////////////////////////////////////////////////////////////
	$('#panel form select').hide();
	$('#panel form').append('<div id="commentaryList"><ul></ul><a href="" id="allCategories" rel="pdf/All.pdf">All categories</a></div>');
	$('#panel form option').each(function(){
		var name = $(this).text();
		var value = $(this).val();
		$('#panel form ul').append('<li><a href="" rel="'+value+'">'+name+'</a></li>');
	});
	$('#allCategories').click(function() {
		if ($(this).hasClass('active')) {
			$('#commentaryList ul').slideUp(250);
			$(this).removeClass('active');
		} else {			
			$('#commentaryList ul').slideDown(250);
			$(this).addClass('active');
		}
		return false;
	});
	$('#commentaryList ul a').click(function() {
		$('#allCategories').text($(this).text()).attr('rel',$(this).attr('rel'));
		$('#allCategories').removeClass('active');
		$('#commentaryList ul').slideUp(250);
		var topic = $(this).text();
		//console.log(topic);		
		$('a.scientificEvent').each(function() {
			if ($.browser.msie) {
				$(this).removeClass('highlight');
				if ($(this).attr('rel')==topic) { 
					$(this).addClass('highlight');
				}
			} else {
				$(this).removeClass('highlight').stop({gotoEnd: true}).css('opacity','1');
				if ($(this).attr('rel')==topic) {
					$(this).addClass('highlight').effect("pulsate", { times: 7 }, 900).mouseenter(function() { $(this).stop({gotoEnd: true}).css('opacity','1'); });
				} 
			}
		});
		if (topic!="All categories") {
			$.scrollToHighlighted();
		} else {
			$('div#slider').slider('value', 0);
			$('#timeline').animate({'left' : 0}, 200);
		}
		
		return false;
	});
	$('#panel a.downloadCommentaries').click(function() {
		var url = $('#allCategories').attr('rel');
		window.open(url);
		return false;
	});
	/////////////////////////////////////////////////////////////////////////////////////////////
	
	// Intro box functionality //////////////////////////////////////////////////////////////////
	$('#introBox a.helpButton').live("click", function(){
		if ($('#introBox div.content:first').hasClass('active')) {
			//console.log('a');
			$('#introBox h4').text('Make the most of Trailblazing');
			$('#introBox h3').text('Help');
			$('#introBox div.content:first').fadeOut().removeClass('active');
			$('#introBox div.content:last').fadeIn().addClass('active');
			$(this).addClass('intro').text('Introduction');
		} else {
			//console.log('b');
			$('#introBox h4').text('Click Explore to browse the timeline');
			$('#introBox h3').text('Welcome to Trailblazing');
			$('#introBox div.content:last').fadeOut().removeClass('active');
			$('#introBox div.content:first').fadeIn().addClass('active');
			$(this).removeClass('intro').text('Help');
		}
		$('#introBox div.content.active').css('top',0);
		$.introBoxVerticalScroll();
		return false;
	});
	
	// Overlay functionality ////////////////////////////////////////////////////////////////////
	
	$('#messageBox a.continueButton').live("click", function(){
		if ($.browser.msie) {
			$('#messageBox').hide();
		} else {
			$('#messageBox').fadeOut(300);
		}
		$('#overlay').hide();
		return false;
	});
	
	// Overlay functionality ////////////////////////////////////////////////////////////////////
	$('#overlay').click(function(event) {
		if ($(event.target).is('#overlay')) {
			if ($.browser.msie) {
				$('#messageBox').hide();
				$('#commentaryBox').hide();
				$('#introBox').hide();
				$('#timeline>div>div').show();
			} else {
				$('#messageBox').fadeOut(300);
				$('#commentaryBox').fadeOut(300);
				$('#introBox').fadeOut(300);
				$('#timeline>div>div').fadeIn(200);
			}
			$('#overlay').hide();
			$('#commentaryBox .imagesTab').removeClass('active');
			$('#commentaryBox .informationTab').addClass('active');
		}
	});
	
	//Help button
	$('#help-box').click(function() {
								  
		$('#overlay').show();
		
		if ($.browser.msie) {
			$('#introBox').show();

		} else {
			$('#introBox').fadeIn(300);
		}
		
		$('#introBox h4').text('Make the most of Trailblazing');
		$('#introBox h3').text('Help');
		$('#introBox div.content:first').hide().removeClass('active');
		$('#introBox div.content:last').show().addClass('active');
		$('#introBox a.helpButton').addClass('intro').text('Introduction');
		
		$('#introBox div.content.active').css('top',0);
		//set the font size
		if ($('#font-small').hasClass('active')) {		
			$('#popupFontSize a').removeClass('active');
			$('#popupFontSize a.popup-font-small').addClass('active');
			$('#introBox h3').css('font-size','18px');
			$('#introBox h4').css('font-size','11px');
			$('#introBox div.content').css('font-size','11px');
			$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','14px');			
		} else if ($('#font-medium').hasClass('active')) {
			$('#popupFontSize a').removeClass('active');
			$('#popupFontSize a.popup-font-medium').addClass('active');
			$('#introBox h3').css('font-size','20px');
			$('#introBox h4').css('font-size','12px');
			$('#introBox div.content').css('font-size','12px');
			$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','16px');
		} else if ($('#font-large').hasClass('active')) {
			$('#popupFontSize a').removeClass('active');
			$('#popupFontSize a.popup-font-large').addClass('active');
			$('#introBox h3').css('font-size','22px');
			$('#introBox h4').css('font-size','13px');
			$('#introBox div.content').css('font-size','13px');
			$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','17px');
		}
		$.introBoxVerticalScroll();
		
		return false;
	});
	
	//Font size buttons
	$('#font-medium').addClass('active');
	
	$('#font-small').click(function() {
		$('#timeline span.bg-description').css('font-size','11px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','9px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','8px');
		$('#panel dl.legend').css('font-size','9px');
		$('#panel form label').css('font-size','9px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','9px');
		$('#panel a.downloadCommentaries').css('font-size','8px');
		$('#buttons').css('font-size','11px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','8px');
		$('#timeline span.infoBox strong.title').css('font-size','11px');
		
		$('#footer').css('font-size','9px');
		
		$('#buttons div.font a').removeClass('active');
		$(this).addClass('active');
		
		return false;
	});
	$('#font-medium').click(function() {
		$('#timeline span.bg-description').css('font-size','12px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','10px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','9px');
		$('#panel dl.legend').css('font-size','10px');
		$('#panel form label').css('font-size','10px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','10px');
		$('#panel a.downloadCommentaries').css('font-size','9px');
		$('#buttons').css('font-size','12px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','9px');
		$('#timeline span.infoBox strong.title').css('font-size','12px');
		
		$('#footer').css('font-size','10px');
		
		$('#buttons div.font a').removeClass('active');
		$(this).addClass('active');
		
		return false;
	});
	$('#font-large').click(function() {			
		$('#timeline span.bg-description').css('font-size','13px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','11px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','10px');
		$('#panel dl.legend').css('font-size','11px');
		$('#panel form label').css('font-size','11px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','11px');
		$('#panel a.downloadCommentaries').css('font-size','10px');
		$('#buttons').css('font-size','13px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','10px');
		$('#timeline span.infoBox strong.title').css('font-size','13px');
		
		$('#footer').css('font-size','11px');
		
		$('#buttons div.font a').removeClass('active');
		$(this).addClass('active');
		
		return false;
	});
	
	//at modal window
	$('#popupFontSize a.popup-font-small').live("click", function() {
		$('#introBox h3').css('font-size','18px');
		$('#introBox h4').css('font-size','11px');
		$('#introBox div.content').css('font-size','11px');
		$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','14px');	
		
		$.introBoxVerticalScroll();
			
		$('#timeline span.bg-description').css('font-size','11px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','9px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','8px');
		$('#panel dl.legend').css('font-size','9px');
		$('#panel form label').css('font-size','9px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','9px');
		$('#panel a.downloadCommentaries').css('font-size','8px');
		$('#buttons').css('font-size','11px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','8px');
		$('#timeline span.infoBox strong.title').css('font-size','11px');
		
		$('#footer').css('font-size','9px');
		
		$('#commentaryBox h4').css('font-size','11px');
		$('#commentaryBox h3').css('font-size','14px');
		$('#commentaryBox div.informationTab ul a').css('font-size','10px');
		$('#commentaryBox ul.tabs a').css('font-size','11px');
		$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','10px');
		$('#commentaryBox div.imagesTab a').css('font-size','11px');					
		$('#commentaryBox div.content').css('font-size','11px');
		
		
		$.commentaryInformationVerticalScroll(); 
		$('#commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
		
		$('#popupFontSize a, #buttons div.font a').removeClass('active');
		$(this).addClass('active');
		$('#font-small').addClass('active');
		
		return false;
	});
	$('#popupFontSize a.popup-font-medium').live("click", function() {
		$('#introBox h3').css('font-size','20px');
		$('#introBox h4').css('font-size','12px');
		$('#introBox div.content').css('font-size','12px');
		$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','16px');
		
		$.introBoxVerticalScroll();
		
		$('#timeline span.bg-description').css('font-size','12px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','10px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','9px');
		$('#panel dl.legend').css('font-size','10px');
		$('#panel form label').css('font-size','10px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','10px');
		$('#panel a.downloadCommentaries').css('font-size','9px');
		$('#buttons').css('font-size','12px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','9px');
		$('#timeline span.infoBox strong.title').css('font-size','12px');
		
		$('#footer').css('font-size','10px');
		
		$('#commentaryBox h4').css('font-size','12px');
		$('#commentaryBox h3').css('font-size','15px');
		$('#commentaryBox div.informationTab ul a').css('font-size','11px');
		$('#commentaryBox ul.tabs a').css('font-size','12px');
		$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','11px');
		$('#commentaryBox div.imagesTab a').css('font-size','12px');		
		$('#commentaryBox div.content').css('font-size','12px');
				
		$.commentaryInformationVerticalScroll(); 
		$('#commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
		
		$('#popupFontSize a, #buttons div.font a').removeClass('active');
		$(this).addClass('active');
		$('#font-medium').addClass('active');
		
		return false;
	});
	$('#popupFontSize a.popup-font-large').live("click", function() {
		$('#introBox h3').css('font-size','22px');
		$('#introBox h4').css('font-size','13px');
		$('#introBox div.content').css('font-size','13px');
		$('#introBox a.startButton, #introBox a.helpButton.intro').css('font-size','17px');
		
		$.introBoxVerticalScroll();
			
		$('#timeline span.bg-description').css('font-size','13px');
		$('#panel a.controlBack, #panel a.controlForward').css('font-size','11px');
		$('#panel a.controlBack span, #panel a.controlForward span').css('font-size','10px');
		$('#panel dl.legend').css('font-size','11px');
		$('#panel form label').css('font-size','11px');
		$('#panel #allCategories, #panel #commentaryList ul a').css('font-size','11px');
		$('#panel a.downloadCommentaries').css('font-size','10px');
		$('#buttons').css('font-size','13px');
		
		$('#timeline span.infoBox span.credit, #timeline span.infoBox span.description, #timeline span.infoBox span.date').css('font-size','10px');
		$('#timeline span.infoBox strong.title').css('font-size','13px');
		
		$('#footer').css('font-size','11px');
		
		$('#commentaryBox h4').css('font-size','14px');
		$('#commentaryBox h3').css('font-size','17px');
		$('#commentaryBox div.informationTab ul a').css('font-size','12px');
		$('#commentaryBox ul.tabs a').css('font-size','13px');
		$('#commentaryBox div.imagesTab p.caption, #commentaryBox div.imagesTab p.credit').css('font-size','12px');
		$('#commentaryBox div.imagesTab a').css('font-size','13px');		
		$('#commentaryBox div.content').css('font-size','14px');
		
		
		$.commentaryInformationVerticalScroll(); 
		$('#commentaryBox div.sliderVerticalWrap').css({display: 'inline'});	// For JS version
		
		$('#popupFontSize a, #buttons div.font a').removeClass('active');
		$(this).addClass('active');
		$('#font-large').addClass('active');
		
		return false;
	});

						   
});

$(window).load(function () {
									
	//Introduction box vertical scroll///////////////////////////////////////////////////////////
	var introVerticalContent = $('#introBox div.content');
	var introVerticalContentView = $('#introBox div.viewContent');
	//console.log(introVerticalContent.height()+' '+introVerticalContentView.height());
	var itemsHeight = introVerticalContent.height() - introVerticalContentView.height();
	
	$("#introBox  div.sliderVertical").slider({
		orientation: "vertical",
		value: itemsHeight,
		min: 0,
		max: itemsHeight,
		slide: function (event, ui) {
			introVerticalContent.css('top', ui.value-itemsHeight);
		}	
	});
	/////////////////////////////////////////////////////////////////////////////////////////////
	
	$('#overlay').height($('#container').height()-68);
	
	$.preloadImages('images/infobox-h-bottom-bg.png', 'images/infobox-h-top-bg.png', 'images/infobox-s-bottom-bg.png', 'images/infobox-s-top-bg.png', 'images/commentary-box-bg.png', 'images/message-box-bg.png', 'images/ajax-loader.gif');
	
});


$.scrollToHighlighted = function() {
	var periodClass = 'div.' + $.activePeriod();
	if (($(periodClass).children('div.event').children('a.scientificEvent.highlight').length==0)&&($('a.scientificEvent.highlight').length>0)) {
		var periods = new Array();
		
		$('#timeline>div').each(function() {
			
			//get all periods where we got our event
			if ($(this).children('div.event').children('a.scientificEvent.highlight').length>0) {
				//console.log($(this).attr('class'));
				var i = periods.length;
				periods[i] = parseInt($(this).attr('class').slice(-1));				
			}
		});
		
		//now find closest period
		var active = parseInt($.activePeriod().slice(-1));
		var closest = periods[0];
		for (i in periods) {
			diff1 = Math.abs(periods[i] - active);
			diff2 = Math.abs(closest - active);
			//console.log(diff1+' '+diff2);
			if (diff1<diff2) {
				closest = periods[i];
			}
		}
		
		if (closest!=0) {
			var position = (1 - closest) * 780;
			//console.log(position);
			$('div#slider').slider('value', position * -1);
			$('#timeline').animate({'left' : position}, 200, function() {$.eventsPosition();});
		}
		
	} else if ($('a.scientificEvent.highlight').length==0) {
		$('#messageBox').html('<h3>Information</h3><p>There is no events for selected category.</p><p>Please choose another category or select <em>All categories</em>.</p><a class="continueButton" href="#">Continue</a>');
		$('#overlay').show();
		if ($.browser.msie) {
			$('#messageBox').show();
		} else {
			$('#messageBox').fadeIn(300);
		}
	}
}

$.activePeriod = function() {
	var left = $('#timeline').css('left');
	left = parseInt(left.slice(0,-2))*(-1);
	//console.log(left);
	var periodClass = 'period-1';
	switch(left)
	{
	case 0:
		periodClass = 'period-1';
	break;
	case 780:
		periodClass = 'period-2';
	break;
	case 1560:
		periodClass = 'period-3';
	break;
	case 2340:
		periodClass = 'period-4';
	break;
	case 3120:
		periodClass = 'period-5';
	break;	
	case 3900:
		periodClass = 'period-6';
	break;
	case 4680:
		periodClass = 'period-7';
	break;
	case 5460:
		periodClass = 'period-8';
	break;
	default:
		periodClass = 'period-1';
	}
	return periodClass;
}

$.commentaryInformationVerticalScroll = function() {
	//console.log('info');
	//Commentary box vertical scroll - sholud go into function and called after AJAX load
	var commentaryInformationVerticalContent = $('#commentaryBox div.content.active');
	var commentaryInformationVerticalContentView = $('#commentaryBox div.viewContent');
	//console.log(commentaryVerticalContent.height()+' '+commentaryVerticalContentView.height());
	var itemsHeight = commentaryInformationVerticalContent.height() - commentaryInformationVerticalContentView.height();
	//console.log(itemsHeight);
	$('#commentaryBox div.informationTab div.sliderVertical').slider( 'destroy' );
	if (itemsHeight>0) {
		//console.log('slider');
		$('#commentaryBox div.informationTab div.sliderVertical').slider({
			orientation: "vertical",
			value: itemsHeight,
			min: 0,
			max: itemsHeight,
			slide: function (event, ui) {
				commentaryInformationVerticalContent.css({top: ui.value-itemsHeight});
			}	
		}).css('display','block');
		$("#commentaryBox div.informationTab div.sliderVertical a.ui-slider-handle").css('left','0');
	} else {
		$('#commentaryBox div.informationTab div.sliderVertical').hide();
	}
}

$.commentaryImagesVerticalScroll = function() {
	//console.log('image');
	//Commentary box vertical scroll - sholud go into function and called after AJAX load
	var commentaryImagesVerticalContent = $('#commentaryBox div.viewImage img');
	var commentaryImagesVerticalContentView = $('#commentaryBox div.viewImage');
	//console.log(commentaryVerticalContent.height()+' '+commentaryVerticalContentView.height());
	var itemsHeight = commentaryImagesVerticalContent.height() - commentaryImagesVerticalContentView.height();
	//console.log(itemsHeight);
	$('#commentaryBox div.imagesTab div.sliderVertical').slider( 'destroy' );
	if (itemsHeight>0) {
		$('#commentaryBox div.imagesTab div.sliderVertical').slider({
			orientation: "vertical",
			value: itemsHeight,
			min: 0,
			max: itemsHeight,
			slide: function (event, ui) {
				commentaryImagesVerticalContent.css({top: ui.value-itemsHeight});
			}	
		}).css('display','block');
		$("#commentaryBox div.imagesTab div.sliderVertical a.ui-slider-handle").css('left','0');
	} else {
		$('#commentaryBox div.imagesTab div.sliderVertical').hide();
	}
}

$.introBoxVerticalScroll = function() {
	//console.log('info');
	//Commentary box vertical scroll - sholud go into function and called after AJAX load
	var introBoxVerticalContent = $('#introBox div.content.active');
	var introBoxVerticalContentView = $('#introBox div.viewContent');
	//console.log(commentaryVerticalContent.height()+' '+commentaryVerticalContentView.height());
	var itemsHeight = introBoxVerticalContent.height() - introBoxVerticalContentView.height();
	//console.log(itemsHeight);
	$('#introBox div.sliderVertical').slider( 'destroy' );
	if (itemsHeight>0) {
		//console.log('slider');
		$('#introBox div.sliderVertical').slider({
			orientation: "vertical",
			value: itemsHeight,
			min: 0,
			max: itemsHeight,
			slide: function (event, ui) {
				introBoxVerticalContent.css({top: ui.value-itemsHeight});
			}	
		}).css('display','block');		
		$('#introBox div.sliderVerticalWrap').show();
		$("#introBox div.sliderVertical a.ui-slider-handle").css('left','0');
	} else {
		$('#introBox div.sliderVerticalWrap').hide();
	}
}

$.eventsPosition = function() {
	
	var timelinePosition = $('#timeline').css('left');
	timelinePosition = Math.abs(parseInt(timelinePosition));
//	console.log(timelinePosition);
//	timelinePosition = timelinePosition%780;
//	console.log(timelinePosition);	
//
//	
//	if (timelinePosition=0) {
//	} else if (timelinePosition>0 && timelinePosition<=234) {
//	} else if (timelinePosition>234 && timelinePosition<=702) {
//		alert('aha');
//		var decadeRightPosition1 = timelinePosition-54;
//		var decadeRightPosition2 = timelinePosition-132;
//		var decadeRightPosition3 = timelinePosition-210;
//		$('#timeline div.event').each(function() {
//			var thisPosition = parseInt($(this).css('left'));
//			console.log(thisPosition);
//			if (thisPosition==decadeRightPosition1 || thisPosition==decadeRightPosition2 || thisPosition==decadeRightPosition3) {
//				$(this).addClass('rightPosition');
//				console.log('evo ga!');
//			} else {
//				$(this).removeClass('rightPosition');
//			}
//		});
//	}

	var periodNumber = parseInt(timelinePosition/780)+1;
	var decadeNumber = parseInt(timelinePosition%780/78);
	
	//console.log('period',periodNumber);
	//console.log('decade',decadeNumber);
	
	var periodClass = "div.period-" + periodNumber;
	var periodClassPrev = "div.period-" + (periodNumber-1);
	var periodClassNext = "div.period-" + (periodNumber+1);
	
	$('#timeline div.event').removeClass('rightPosition');
	
	if (decadeNumber==0) {
		$(periodClass).children('div.decade-8').addClass('rightPosition');
		$(periodClass).children('div.decade-9').addClass('rightPosition');
		$(periodClass).children('div.decade-10').addClass('rightPosition');
	} else if (decadeNumber==1) {
		$(periodClass).children('div.decade-9').addClass('rightPosition');
		$(periodClass).children('div.decade-10').addClass('rightPosition');
		$(periodClassNext).children('div.decade-1').addClass('rightPosition');
	} else if (decadeNumber==2) {
		$(periodClass).children('div.decade-10').addClass('rightPosition');
		$(periodClassNext).children('div.decade-1').addClass('rightPosition');
		$(periodClassNext).children('div.decade-2').addClass('rightPosition');
	} else if (decadeNumber>=3) {
		var decade1 = "div.decade-" + (decadeNumber-2);
		var decade2 = "div.decade-" + (decadeNumber-1);
		var decade3 = "div.decade-" + decadeNumber;
		
		$(decade1).addClass('rightPosition');
		$(decade2).addClass('rightPosition');
		$(decade3).addClass('rightPosition');
	}
}



$.preloadImages = function()
{
  for(var i = 0; i<arguments.length; i++)
  {
    $('<img>').attr('src', arguments[i]);
  }
}


function getWindowHeight() {
	var windowHeight = 0;
	if (typeof(window.innerHeight) == 'number') {
		windowHeight = window.innerHeight;
	}
	else {
		if (document.documentElement && document.documentElement.clientHeight) {
			windowHeight = document.documentElement.clientHeight;
		}
		else {
			if (document.body && document.body.clientHeight) {
				windowHeight = document.body.clientHeight;
			}
		}
	}
	return windowHeight;
}
function getContainerHeight() {
	var containerHeight = 0;
	containerHeight = document.getElementById('container').offsetHeight;
	return containerHeight;
}
function setContainerHeight() {
	if (document.getElementById) {
		var windowHeight = getWindowHeight();
		//console.log(windowHeight);
		var containerHeight = getContainerHeight();
		//console.log(containerHeight);
		var fix = 25;
		if (windowHeight-fix > containerHeight) {
			document.getElementById('footer').style.top = (windowHeight-fix)+'px';
		}
	}
}
window.onload = function() {	
	if (document.getElementById('container')) { setContainerHeight(); }
}
window.onresize = function() {
	if (document.getElementById('container')) { setContainerHeight(); }
}


/*---DMN @ ED-----------------------------------------------------------------------------------------*/