/* ------------------------------------------------------------------------
	s3Slider
	
	Developped By: Boban Karišik -> http://www.serie3.info/
        CSS Help: Mészáros Róbert -> http://www.perspectived.com/
	Version: 1.0
	
	Copyright: Feel free to redistribute the script/modify it, as
			   long as you leave my infos at the top.
------------------------------------------------------------------------- */


(function($){  

    $.fn.s3Slider = function(vars, btnArray) {
        
        var element     = this;
        var timeOut     = (vars.timeOut != undefined) ? vars.timeOut : 10000;
        var current     = null;
        var timeOutFn   = null;
        var faderStat   = true;
        var mOver       = false;
		
		var FADE_TIME = 100;
        
		//array of  containers
		var items       = $("#" + element[0].id + "Content ." + element[0].id + "Image");
        
		//array of text elements
		var itemsSpan   = $("#" + element[0].id + "Content ." + element[0].id + "Image span");
		
		var currentOverRide = null;

		$("#btn1").click(function() 
		{
			clearTimeout(timeOutFn);
			currentOverRide = 1;
			faderStat = false;

			makeSlider();

			return false;
        });

		$("#btn2").click(function() 
		{
			clearTimeout(timeOutFn);
			currentOverRide = 2;
			faderStat = false;
			
			makeSlider();
			
			return false;
        });
		
		$("#btn3").click(function() 
		{
			clearTimeout(timeOutFn);
			currentOverRide = 3;
			faderStat = false;
			
			makeSlider();
			
			return false;
        });
		
        items.each(function(i) {
    
            $(items[i]).mouseover(function() {
               mOver = true;
            });
            
            $(items[i]).mouseout(function() {
                mOver   = false;
                fadeElement(true);
            });
            
        });
        
        var fadeElement = function(isMouseOut) 
		{
            var thisTimeOut = (isMouseOut) ? (timeOut/2) : timeOut;
            thisTimeOut = (faderStat) ? 10 : thisTimeOut;
            
			if(items.length > 0) 
			{
                clearTimeout(timeOutFn);
				timeOutFn = setTimeout(makeSlider, thisTimeOut);
            } 
			else 
			{
                console.log("Poof..");
            }
        }

        var makeSlider = function() 
		{
			//if the current element is null, set it to the first one
			current = (current != null) ? current : 0;

            //override the current number
			var currNo = currentOverRide;

			//if there is no current number, use the current position in the array
			if(currNo == null)
			{
				currNo = current+1;
			}
			
            //if the currNo is at the end of the list
			currNo = (currNo == items.length) ? 0 : (currNo - 1);
	
			if(currentOverRide == 2 && current == 0)
			{
				//override stuff (HACK!)
				currNo = 1;
				$(items[0]).fadeOut(1);
			}

			//clear the override
			currentOverRide = null;
			
			//what is this???
            var newMargin   = $(element).width() * currNo;
            
			//if it's fading in (stage 2)
			if(faderStat == true) 
			{
                //if the mouse isn't over
				if(!mOver) 
				{
					//fade in the current item
					$(items[currNo]).fadeIn((FADE_TIME), function() 
					{
						//when it's done, if the text is at the bottom
						if($(itemsSpan[currNo]).css('bottom') == 0) 
						{
							//slide up the text
							$(itemsSpan[currNo]).slideUp((FADE_TIME), function() 
							{
                                faderStat = false;
                                
								//set the current to be this item
								current = currNo;
								
                                if(!mOver) 
								{
                                    fadeElement(false);
                                }
                            });
                        } 
						else 
						{
                            $(itemsSpan[currNo]).slideDown((FADE_TIME), function() 
							{
                                faderStat = false;
                                current = currNo;
								
                                if(!mOver) 
								{
                                    fadeElement(false);
                                }
                            });
                        }
                    });
                }
				
				//when it's done, change the highlight
				switch(currNo)
				{
					case 0:
						$("#btn1").css({"background-color": "#000"});
						$("#btn2").css({"background-color": "#000"});
						$("#btn3").css({"background-color": "#333"});
					break;
					
					case 1:
						$("#btn1").css({"background-color": "#333"});
						$("#btn2").css({"background-color": "#000"});
						$("#btn3").css({"background-color": "#000"});
					break;
					
					case 2:
						$("#btn1").css({"background-color": "#000"});
						$("#btn2").css({"background-color": "#333"});
						$("#btn3").css({"background-color": "#000"});
					break;

					default:
						$("#btn1").css({"background-color": "#000"});
						$("#btn2").css({"background-color": "#000"});
						$("#btn3").css({"background-color": "#000"});
					break;
				}
				
            } 
			else 
			{
				//if mouse off
                if(!mOver) 
				{
                    //if text at the bottom (IT NEVER IS?!)
					if($(itemsSpan[currNo]).css('bottom') == 0) 
					{
                        //slide the text down
						$(itemsSpan[currNo]).slideDown((FADE_TIME), function() 
						{
                            //fade out the whole thing
							$(items[currNo]).fadeOut((FADE_TIME), function() 
							{
                                //set the fade status to true, so it goes through phase 2 next
								faderStat = true;
                                
								//the current item is now the next one up
								current = currNo+1;
                                
								if(!mOver) 
								{
                                    fadeElement(false);
                                }
                            });
                        });
                    } 
					else 
					{
                        //always goes through here...
						
						$(itemsSpan[currNo]).slideUp((FADE_TIME), function() 
						{
							$(items[currNo]).fadeOut((FADE_TIME), function() 
							{
                                faderStat = true;
                                current = currNo+1;
                                if(!mOver) 
								{
                                    fadeElement(false);
                                }
                            });
                        });
                    }
                }
            }
        }

        makeSlider();
    };  

})(jQuery);