$('document').ready(function(){
	// temporarily hide descriptions
	$('.scrollDescr').hide();
	
	// set thumbs background-image & active image
	var count = 1;
	$('#scroller_thumbs a').each(function(){
		$(this).css('background-image','url(assets/images/scroller/'+count+'_thumb.jpg)')
			.html('<img src="assets/images/scroller/active.png" class="display_none" />');
		
		count++;
	});
	
	
	// set info texts
	var credits = new Array(	['',''],
								['http://www.flickr.com/photos/k4rp/581605595/','k4rp'],
								['http://www.flickr.com/photos/minimegaramp/3322206278/','scoffman'],
								['http://www.flickr.com/photos/mattsefton/673606076/','matt_sefton'],
								['http://www.flickr.com/photos/28468639@N05/3059431511/','a.gonzales'],
								['http://www.flickr.com/photos/xshayx/3131569740/in/photostream/','shaymurphy'],
								['http://www.flickr.com/photos/patrickmccuephoto/4606682993/','patmccuephotography']);
	
	texts = new Array();
	count = 1;
	$('.scrollDescr').each(function(){
		texts[count] = '<p class="scrollerCredits">Pic by <a href="'+credits[count][0]+'" target="_blank">'+credits[count][1]+'</a></p>';
		texts[count] += $(this).html();
		count++;
	});
	
	// preload images
	pic1= new Image(1,1);
	pic1.src='assets/images/scroller/1.jpg';
	
	pic2= new Image(1,1); 
	pic2.src='assets/images/scroller/2.jpg';
	
	pic3= new Image(1,1); 
	pic3.src='assets/images/scroller/3.jpg';
	
	pic4= new Image(1,1); 
	pic4.src='assets/images/scroller/4.jpg';
	
	pic5= new Image(1,1); 
	pic5.src='assets/images/scroller/5.jpg';
	
	// start vars
	currentImage = '#scroller_image1';
	pointer = 1;
	loopAnim = true;
	
	// activate first thumb
	$('#thumb'+pointer).css('opacity','1');
	$('#thumb'+pointer).children('img').removeClass('display_none');
	
	// set first text
	$('#scroller_text').html(texts[1]);
	height = (247-$('#scroller_text').height())+'px';
	$('#scroller_text').css('margin-top',height);
	
	
	// animate
	window.setInterval("nextImage(false)",5000);
	
	// add event handlers to the thumbs
	$('#scroller_thumbs a').mouseover(function(){
		mouseoverThumb($(this));
	});
	$('#scroller_thumbs a').children('img').mouseout(function(){
		mouseoutThumb($(this));
	});
});


function nextImage(tempPointer){
	play = true;
	if (!loopAnim) {
		if (tempPointer==false) {
			play = false;
		}
	}
	
	if (play){
		// hide previous
		$(currentImage).stop(true,true).fadeOut(500);
		
		// deactivate previous thumb
		$('#thumb' + pointer).css('opacity', '0.6');
		$('#thumb'+pointer).children('img').addClass('display_none');
		
		// hide previous text
		$('#scroller_text').stop(true,true).animate(	
										{
											marginTop: '270px'
										},
										300,
										'swing',
										function(){
											$('#scroller_text').html(texts[pointer]);
											// show current text	
											height = (247-$('#scroller_text').height())+'px';
			
											$('#scroller_text').animate(	
																			{
																				marginTop: height
																			},
																			300,
																			'swing'
																		);
										}
									);

		
		// update current image
		if (currentImage == '#scroller_image1') {
			currentImage = '#scroller_image2';
		}
		else {
			currentImage = '#scroller_image1';
		}
		
		// update pointer (if no tempPointer is set!)
		if (tempPointer == false) {
			pointer++;
		} else {
			pointer = tempPointer;
		}
		
		if (pointer == 7) {
			pointer = 1;
		}
		
		// show new image
		$(currentImage).attr('src', 'assets/images/scroller/' + pointer + '.jpg');
		$(currentImage).stop(true,true).fadeIn(500);
		
		// activate current thumb
		$('#thumb' + pointer).css('opacity', '1');
		$('#thumb'+pointer).children('img').removeClass('display_none');
	}
}


function mouseoverThumb(thumb){
	// pause looping
	loopAnim = false;
	
	// set temp pointer
	tempPointer = thumb.attr('id').replace('thumb','');
	
	// go to image
	nextImage(tempPointer);
}


function mouseoutThumb(thumb){
	// unpause looping
	loopAnim = true;
}