$(function()
{
   
	$('.mainnav ul li').bind('mouseenter mouseleave', function(){
			$(this).toggleClass('active');
	});
	
	$('.upperleft-lowcontent ul').innerfade({ 
		speed: 'slow', 
		timeout: 4000, 
		type: 'sequence'
	}); 

	jQuery.easing.def = "easeOutQuint";

	$('ul.gallery-downloads').galleria({
				history   : false, // activates the history object for bookmarking, back-button etc.
				clickNext : false, // helper for making the image
				insert    : '#main_download_image', // the containing selector for our main image
				onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes

					image.css('display','none').fadeIn(1000);
					caption.css('display','none').fadeIn(1000);

					var _li = thumb.parents('li');

					var image = _li.siblings().children('img.selected').fadeTo(500,0.5);


					thumb.fadeTo('fast',1).addClass('selected');

					$('.download-button a').attr('href',thumb.attr('longdesc'));

				},
				onThumb : function(thumb) { // thumbnail effects goes here

					// fetch the thumbnail container
					var _li = thumb.parents('li');

					// if thumbnail is active, fade all the way.
					var _fadeTo = _li.is('.active') ? '1' : '0.5';

					// fade in the thumbnail when finnished loading
					thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);

					// hover effects
					thumb.hover(
						function() { thumb.fadeTo('fast',1); },
						function() { _li.not('.active').children('img').fadeTo('fast',0.5); } // don't fade out if the parent is active
					)

				}

			});


	
	$('.gallery_unstyled').addClass('gallery'); // adds new class name to maintain degradability
			
			$('ul.gallery').galleria({
				history   : false, // activates the history object for bookmarking, back-button etc.
				clickNext : false, // helper for making the image
				insert    : '#main_image', // the containing selector for our main image
				onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
					
					// fade in the image & caption
					image.css('display','none').fadeIn(1000);
					//caption.css('display','none').fadeIn(1000);
					
					// fetch the thumbnail container
					var _li = thumb.parents('li');
					
					// fade out inactive thumbnail
					_li.siblings().children('img.selected').fadeTo(500,0.5);
					
					// fade in active thumbnail
					thumb.fadeTo('fast',1).addClass('selected');
					
					
					// add a title for the image
					//image.attr('title','Next image >>');
					
					$('.download-button a').attr('href',thumb.attr('longdesc'));

					var position = $('.gallery li.active').prevAll().length * 111 - 382;
					$('#imagemarker').animate({backgroundPosition: position+'px 0px'}, {
						duration: 'slow',
                    	easing: 'easeOutQuint'
                	});

					
				},
				onThumb : function(thumb) { // thumbnail effects goes here
					
					// fetch the thumbnail container
					var _li = thumb.parents('li');
					
					// if thumbnail is active, fade all the way.
					var _fadeTo = _li.is('.active') ? '1' : '0.5';
					
					// fade in the thumbnail when finnished loading
					thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
					
					// hover effects
					thumb.hover(
						function() { thumb.fadeTo('fast',1); },
						function() { _li.not('.active').children('img').fadeTo('fast',0.5); } // don't fade out if the parent is active
					)

				}

			});

			
			
			 $('gallery li.nothumb').click(function(){
				return false;
			 });

			
			$('.gallery-leftnav a').click(function(){
				$.galleria.prev();
				return false;
			});
			
			$('.gallery-rightnav a').click(function(){
				$.galleria.next();
				return false;
			});

			
			setTimeout(function(){ $('ul.gallery-downloads li:first img').addClass('thumb selected').click(); }, 400);
			
		// history slider code	
			var scale = $('div#scale'),
			prev  = $('.history-leftnav .prev', scale),
			next  = $('.history-rightnav .next', scale),
			years = $('.years ul', scale),
			li    = $('li', years),
			step  = 76,
			yearsshown = 8,
			widthshown = step * yearsshown, 
			width  = step * li.length,
			timeline = $('div#timeline'),
			timecolumns = $('.timecolumns ul', timeline),
			timestep = 219,
			animating = false;
		
		
		/**
		 * Set and Get the background position
		 */
		function backgroundPosition(pos)
		{
			// Getting not setting
			if (typeof pos === 'undefined'){
				return parseInt(years.css('backgroundPosition'));
			}
						
			animating = true;
								
			years.animate({backgroundPosition: parseInt(pos)+'px 6px'}, {
						duration:300,
                    	easing: 'easeOutQuint'
            });
		}
		
		function timelinePosition(timepos)
		{
			if (typeof timepos === 'undefined'){
				return parseInt(timecolumns.css('margin-left'));
			}
					
			// Set the timeline
			timecolumns.animate({marginLeft: parseInt(timepos)+'px'}, {
						duration: 400,
                    	easing: 'easeOutQuint',
                    	complete:function(){
                    		animating=false;
                    	}
            });
		}
		
		function move(time, background, scale){
			if (animating === true){
				return false;
			}
			
			animating = true;
			
			if (typeof scale === 'function'){
				scale();
			}
			
			timelinePosition(time);
			backgroundPosition(background);			
		}
				
		function moveForward()
		{
			var pos = backgroundPosition();
			var timepos = timelinePosition();

			if (pos + step < widthshown - parseInt(years.css('margin-left'))){
				// Move only background
				move(timepos - timestep, pos + step);
			
			}
			else if(pos + step >= widthshown && parseInt(years.css('margin-left')) != (widthshown - width + (3 * step))){
				move(timepos - timestep, pos + step, function(){
					// Move both background and scale
					years.css('margin-left', parseInt(parseInt(years.css('margin-left')) - step)+'px');
				});
			}
			else{
				// going to fall off the edge
			}
			
			return false;			
		}
		
		function moveBackward()
		{
			var pos = backgroundPosition();
			var timepos = timelinePosition();
						
			if (pos - step > - step && parseInt(years.css('margin-left')) >= -(pos - step)){
				// Only if we wont fall off & move only background
				move(timepos + timestep, pos - step);				
			}
			else if(pos - step <= width - step && parseInt(years.css('margin-left')) != 0){
				// Move the scale back but not background
				move(timepos + timestep, pos - step, function(){
					years.css('margin-left', parseInt(parseInt(years.css('margin-left')) + step)+'px');	
				});
			}
			else{
				// going to fall off the edge
			}
			
			return false;
		}
		
			next.click(moveForward);
			prev.click(moveBackward);
});