/**
 * 
 * Plugin Slide Cycle Image Gallery
 * @author trihq<trihq.gentleman@gmail.com>  
 * @date 23/7/2010
 * @options: properties need to slide(width, height, timeOut, startItem)
 * @images: list images gallery directory
 */

(function($){  

    $.fn.c3Slider = function(options) {       
        
        var element     = this;
        var objs 		= {
        	timeOut     : options.timeOut != undefined ? options.timeOut : 5000,
        	current     : options.startItem != undefined ? options.startItem : 0,
        	width		: options.width != undefined ? options.width : 320,
        	height		: options.height != undefined ? options.height : 240,
			total		: options.total != undefined ? options.total : 0
        }        
        //var arrImg		= images;//mang hinh anh
        var timeOutFn   = null;
        var mOver		= false;//kiem tra tinh trang chuot. true : dang over, false : khong over
        var faderStat	= false;//kiem tra tac dong chuot, true : co tac dong, false : khong tac dong
        var slideOK		= true;//kiem tra slide chay xong chua. true : da chay xong, false : chua xong
        var currNo		= null;//hinh anh muon slide toi
        var slide		= 1;//trang thai slide. 1: next, -1: previous
        var item 		= null;//$('#' + element[0].id).find('img'); doi tuong hinh anh
        var itemNumber	= $('.list_slide img');
        
        var slideElement = function(isMouseOut) {        	
            var thisTimeOut = objs.timeOut; 
            thisTimeOut = faderStat ? 10 : thisTimeOut;
            if(objs.total > 0 && slideOK == true) {
                timeOutFn = setTimeout(makeSlider, thisTimeOut);
            }
        }
        
        var createGallery = function(){        	
        	if(objs.total > 0){       		       		
        		item = $('#' + element[0].id).find('span');
        		//$('#' + element[0].id).each(function(i){
    			$('#s5').mouseover(function() {
    	            mOver = true;
    	            faderStat = false;
    	        });
    	            
    			$('#s5').mouseout(function() {
    	             mOver   = false;
    	             faderStat = false; 
    	             clearTimeout(timeOutFn);
    	             slideElement();
    	        });        		
        		$('.list_slide img').click(function(){       				
            			var listItems = $(this).parent().children();
            	        currNo = $(listItems).index(this);
            	        if(currNo != objs.current){            	        	
            	        	mOver = false;
                			clearTimeout(timeOutFn);
	            			slide = currNo > objs.current ? 1 : -1;            			
	            			faderStat = true;        			
	       	             	slideElement();
            	        }
        		});
        		slideElement();
        	}
        }        
        var makeSlider = function() {        	
        	if(objs.total > 1 && !mOver){
        		slideOK = false;
	            currNo      = currNo != null ? currNo : (objs.current + 1 == objs.total ? 0 : objs.current + 1);	            
	            $(itemNumber[objs.current]).removeClass('act');
	            $(itemNumber[currNo]).addClass('act');
	            $(item[currNo]).css({'z-index' : objs.total});
	            $(item[objs.current]).animate({'opacity': 0},1000,function(){$(this).css({'z-index' : 0});});
	            $(item[currNo]).animate({'opacity': 1},1000,function(){$('#img_' + currNo + '.reflect').reflect(); objs.current = currNo;currNo = null; slide = 1; slideOK = true; faderStat = false; slideElement();});
        	}
        }        
        createGallery();

    };  

})(jQuery);