// ROTATING HEADLINES SLIDESHOW
// @author Joseph Karns 
// Last updated on 09/02/2011

(function($) {
		  
	$.fn.simpleHeadlines = function(settings){
		//SETTINGS
		var config = {
			'delay'			: 8,
			'fadeSpeed' 		: 2,
			'useTitles'		: "yes",
			'useDescriptions'	: "yes",
			'useLinks'		: "yes",
			'useLiOverlays'		: "no",
			'controls'		: "no",
			'removeStyles'		: "no"
		};
		if (settings){$.extend(config, settings);}
		
		// loop thru each matched element
		return this.each(function(index, list) {
			
			var element = this;
			$(element).hide();
			var totalFiles = $("ul.ui-articles li", element).size();
			var myID = $(element).parent().parent().attr("id").replace("module-content-", "");
			var myContainer = "#headline-container-" + myID;
			
			//IF IMAGES EXIST
			if(totalFiles>0){
				buildStructure();
			}
			
			function buildStructure(){
				//BUILD CONTAINER FOR ROTATOR
				var structureCSS = {
					'position'		: 'relative',
					'list-style'	: 'none',
					'margin'		: '0px',
					'padding'		: '0px'	
				}
				var structure = "<div id='" + myContainer.replace("#", "") + "' class='joey-headline-container'>"+
								"	<ul class='pictures'></ul>"+
								"	<div class='overlay'></div>"+
								"</div>";	
				$(element).parent().parent().append(structure);
				//ADD STYLES
				if(config.removeStyles == "no"){
					$("ul.pictures", myContainer).css(structureCSS);	
				}
				//ADD CONTROLS
				if(config.controls == "yes"){
					$(myContainer).append("<div class='controls-container'><div class='button back'></div><div class='button toggle pause'></div><div class='button next'></div></div>");
					addControls();
				}
				//INITIAL FUNCTION RUN
				var images = buildArray();
				loadImage(0, images);
			}

			function buildArray(){
				//BUILD THE DATA ARRAY
				var imagesArray = new Array();
				$("div.ui-article", element).each(function(index){
					imagesArray[index] = new Array();
					//IMAGE PATH
					imagesArray[index][0] = $("a.ui-article-thumb img:eq(0)", this).attr("src");
					//TITLE
					imagesArray[index][1] = $.trim($("h1.ui-article-title a:eq(0)", this).text());
					//TEASER
					imagesArray[index][2] = $.trim($("p.ui-article-description", this).html());
					//URL
					imagesArray[index][3] = $.trim($("h1.ui-article-title a:eq(0)", this).attr("href"));
				});
				return imagesArray;
			}
			
			//LOAD ALL DATA/IMAGES
			function loadImage(currentFile, images){
				if(currentFile<totalFiles){
					
					//ADD STYLES
					if(config.removeStyles == "no"){
						var liCSS = {
							"margin" 	: "0px",
							"padding"	: "0px",
							"display"	: "none",
							"position"	: "absolute",
							"top"		: "0px",
							"left"		: "0px"
						}
					} else {
						var liCSS = {}	
					}
					//ADD LI FOR EACH ITEM
					var myCont = myContainer + " ul.pictures";
					switch (currentFile){
						case 0 : $("<li class='imgHolder loading " + myID + " active' style='z-index:2' />").css(liCSS).appendTo(myCont);
						break;
						case 1 : $("<li class='imgHolder loading " + myID + " next' style='z-index:1' />").css(liCSS).appendTo(myCont);
						break;
						default : $("<li class='imgHolder loading " + myID + "' style='z-index:0' />").css(liCSS).appendTo(myCont);
					}
					
					//CURRENT LI TO LOAD TO
					var currentLI = $("li.imgHolder:last", myContainer);
												
					//ADD IMAGE
					$("<img />").load(function(){
						$(this).appendTo(currentLI);
						$(currentLI).removeClass("loading").show();
						//ADD LI OVERLAY
						if(config.useLiOverlays == "yes"){
							$(currentLI).append("<a href='" + images[currentFile][3] + "' class='li-overlay'></a>");	
						}
						//CHECKS FOR LINKS
						if(config.useLinks == "yes"){
							$(currentLI).append("<div class='readmore'><a class='readmore-link' href='" + images[currentFile][3] + "'><span>Read More</span></a></div>");
						}
						//CHECKS FOR TITLE
						if(config.useTitles == "yes"){
							$(currentLI).append("<div class='title'><h1>" + images[currentFile][1] + "</h1></div>");	
						}
						//CHECKS FOR DESCRIPTION
						if(config.useDescriptions == "yes"){
							$(currentLI).append("<div class='description'><span>" + images[currentFile][2] + "</span></div>");	
						}		
						loadImage(currentFile+1, images);
						
						//RUN TIMER ON SECOND IMAGE COMPLETE
						if(currentFile == 1){
							var timeOut = setTimeout(function(){
								rotateImages(0);
								rotateTimer();
							}, config.delay*1000);
						}
					}).attr('src',images[currentFile][0]);		
				}
			}
			
			function setZindexes(){
				$(".imgHolder", myContainer).css("z-index","0");
				$(".imgHolder.active", myContainer).css("z-index","2");
				$(".imgHolder.next", myContainer).css("z-index","1");
			}
			
			//CONTROLS FUNCTION
			function addControls(){
				$("div.button.toggle", myContainer).click(function(){
					if($(this).hasClass("play")){
						rotateImages();
						rotateTimer();
						$(this).removeClass("play").addClass("pause");
					} else {
						killTimer();
						$(this).removeClass("pause").addClass("play");
					}
				});
				$("div.button.next", myContainer).hover(function(){
					//DO NOTHING
				});
				$("div.button.next", myContainer).click(function(){
					if(!$(this).hasClass("animating")){
						var moveNumber = $(".imgHolder.active", myContainer).index()+1
						if($(".imgHolder.active", myContainer).index()+1 > (totalFiles - 1)) {
							moveNumber = 0;
						}
						moveToItem(moveNumber);
					}
				});
				$("div.button.back", myContainer).click(function(){
					if(!$(this).hasClass("animating")){
						var moveNumber = $(".imgHolder.active", myContainer).index()-1;
						if($(".imgHolder.active", myContainer).index()-1 < 0) {
							moveNumber = totalFiles -1;
						}
						moveToItem(moveNumber);
					}
				});
			}

			//ROTATE FUNCTION
			function rotateTimer(){
				rotateHeadlinesTimerVar = setInterval(function(){
					rotateImages();
				}, config.delay*1000);	
			}
			function killTimer(){
				clearInterval(rotateHeadlinesTimerVar);
			}
			function rotateImages(currentFile){
				if(!$("imgHolder.next", myContainer).prev().hasClass("loading")){
					$(".button",myContainer).addClass("animating");
					$(".imgHolder.active", myContainer).fadeOut(config.fadeSpeed*1000, function(){
						$(this).removeClass("active");
						$(this).siblings(".next").addClass("active").removeClass("next");
						if($(".imgHolder.active", myContainer).next().size()){
							$(".imgHolder.active", myContainer).next().addClass("next");
						} else {
							$(".imgHolder:first", myContainer).addClass("next");	
						}
						setZindexes();
						$(".button",myContainer).removeClass("animating");
						$(this).show();
					});
				}
			}
			function moveToItem(moveToBullet){
				if(!$("div.animating", myContainer).size()){
					$(".imgHolder.active", myContainer).removeClass("active");
					$(".imgHolder.next", myContainer).removeClass("next");
					$(".imgHolder", myContainer).eq(moveToBullet).addClass("active");
					if($(".imgHolder.active", myContainer).next().size()){
						$(".imgHolder.active", myContainer).next().addClass("next");
					} else {
						$(".imgHolder:first", myContainer).addClass("next");	
					}
					setZindexes();
				}
			}			
		});
	};

})(jQuery);