/* Flickr carousel */

var carousel_flickr_pos_next;
var carousel_flickr_pos_prev;
var carousel_flickr_current_item = 0;
var carousel_flickr_animating = false;
var carousel_flickr_item_display = 2;


$(document).ready(function(){

	/* programme slider */
	
	var carousel_flickr = $('#carousel-flickr');
	
	$('#carousel-flickr').css({background : 'url(/radio4/worldonthemove/assets/ui/ajax-loader-flickr.gif) no-repeat center center'} );
	
	// add navigation
	$(carousel_flickr).after('<div id="carousel-controls-flickr" class="clearfix"><ul><li><p class="link-prev"><a href="#">Previous</a></p></li><li class="last-child"><p class="link-next"><a href="#">Next</a></p></li></ul></div>');

	
	$('ul', carousel_flickr).hide();
	
	var to = setTimeout(function(){
	
		$('ul', carousel_flickr).after('<ul id="images" class="list-flickr"><li class="list-item-flickr"><ul></ul></li></ul>');
		var ul = $('ul#images ul')
		$('ul li', carousel_flickr).each(function(i) {
		
			if(i%12 == 0) {
				$('ul#images').append('<li class="list-item-flickr"><ul id='+i+'></ul></li>');
				ul = $('ul#' + i);
				//$(this).parent().before('<ul>');
				
			}
			$(ul).append($(this).clone());
		
		});
		
		$('ul.list-flickr:first').remove();
		$('ul#images li:first, ul#images li:last').remove();
		
		$('ul li a', carousel_flickr).empty().text("");
	
		// add markup
		//$(carousel_flickr).html('<ul class="list-flickr"><li class="list-item-flickr"><ul><li><a href="#">flickr image 1</a></li><li><a href="#">flickr image 2</a></li><li><a href="#">flickr image 3</a></li><li><a href="#">flickr image 4</a></li><li><a href="#">flickr image 5</a></li><li><a href="#">flickr image 6</a></li><li><a href="#">flickr image 7</a></li><li><a href="#">flickr image 8</a></li><li><a href="#">flickr image 9</a></li><li><a href="#">flickr image 10</a></li><li><a href="#">flickr image 11</a></li><li><a href="#">flickr image 12</a></li></ul></li><li class="list-item-flickr"><ul><li><a href="#">flickr image 1</a></li><li><a href="#">flickr image 2</a></li><li><a href="#">flickr image 3</a></li><li><a href="#">flickr image 4</a></li><li><a href="#">flickr image 5</a></li><li><a href="#">flickr image 6</a></li><li><a href="#">flickr image 7</a></li><li><a href="#">flickr image 8</a></li><li><a href="#">flickr image 9</a></li><li><a href="#">flickr image 10</a></li><li><a href="#">flickr image 11</a></li><li><a href="#">flickr image 12</a></li></ul></li><li class="list-item-flickr"><ul><li><a href="#">flickr image 1</a></li><li><a href="#">flickr image 2</a></li><li><a href="#">flickr image 3</a></li><li><a href="#">flickr image 4</a></li><li><a href="#">flickr image 5</a></li><li><a href="#">flickr image 6</a></li><li><a href="#">flickr image 7</a></li><li><a href="#">flickr image 8</a></li><li><a href="#">flickr image 9</a></li><li><a href="#">flickr image 10</a></li><li><a href="#">flickr image 11</a></li><li><a href="#">flickr image 12</a></li></ul></li></ul>');	
		
		var carousel_flickr_unit = $('ul.list-flickr li:first-child', carousel_flickr);
		var carousel_flickr_margin = parseInt($('ul.list-flickr li', carousel_flickr).css('margin-right'));
		var carousel_flickr_total = $('li.list-item-flickr', carousel_flickr).length;
		
		
		//var carousel_flickr_next_button = '<p class="link-next"><a href="#">Next programme</a></p>';
		//var carousel_flickr_prev_button = '<p class="link-prev"><a href="#">Previous programme</a></p>';
		
		carousel_flickr_width = (isIE) ? $(carousel_flickr_unit).width() + carousel_flickr_margin : ( parseInt($(carousel_flickr_unit).width()) + parseInt($(carousel_flickr_unit).css('padding-left')) + parseInt($(carousel_flickr_unit).css('padding-right')) + carousel_flickr_margin );
		carousel_flickr_pos = parseInt($('ul.list-flickr', carousel_flickr).css('left'));
		carousel_flickr_pos_next = (carousel_flickr_pos - carousel_flickr_width);
		carousel_flickr_pos_prev = (carousel_flickr_pos + carousel_flickr_width);
		
		// empty the link text
		//$('ul li a', carousel_flickr).empty();
		
		$('ul li a', carousel_flickr).each(function() {
		
			var s = $(this).attr('href');
		
			$(this).css({background : 'url('+s+') center center', display : 'block'});
			
			$(this).attr('href', $(this).attr('rel'));
		
		});
		
		$('ul', carousel_flickr).show();
		
		
		// set width of episode holder
		$('ul.list-item-flickr', carousel_flickr).width(($('ul li', carousel_flickr).length * carousel_flickr_width) + 'px');
		
		$('#carousel-flickr').css('background', 'none');
		
		
		// next prev clicks
		$('#carousel-controls-flickr p.link-next a').click(function() {
			
			if(carousel_flickr_animating) {
					
				return false;
	
			}
			
			if(carousel_flickr_current_item == (carousel_flickr_total - carousel_flickr_item_display)) {
						
				return false;
				
			}
									
			carousel_flickr_pos_next = (parseInt($('ul', carousel_flickr).css('left')) - carousel_flickr_width);
			carousel_flickr_pos_prev = (parseInt($('ul', carousel_flickr).css('left')) + carousel_flickr_width);
			
			carousel_flickr_animating = true;
			
			$('ul', carousel_flickr).animate({left: carousel_flickr_pos_next }, 1500, function() {
			
				carousel_flickr_animating = false;
			
			});

		
			carousel_flickr_current_item ++;
			
			return false;
			
		});
		
		$('#carousel-controls-flickr p.link-prev a').click(function() {
		
			if(carousel_flickr_animating) {
					
				return false;
	
			}
		
			if(carousel_flickr_current_item == 0) {
					
				return false;
				
			}
				
			carousel_flickr_pos_next = (parseInt($('ul', carousel_flickr).css('left')) - carousel_flickr_width);
			carousel_flickr_pos_prev = (parseInt($('ul', carousel_flickr).css('left')) + carousel_flickr_width);
			
			carousel_flickr_animating = true;
			
			$('ul', carousel_flickr).animate({left: carousel_flickr_pos_prev }, 1500, function() {
				
				carousel_flickr_animating = false;
				
			});
			
			carousel_flickr_current_item --;
	
	
			return false;
			
		});
		
	}, 3000); 

	$('ul li a', carousel_flickr).empty().text("");

});