// JavaScript Document

/* author:argb
 ** email:argb@live.cn
 */
var topFocusContainer = $('#topFocusContainer'), topFocus = $('#topFocus'),items = topFocus.children(), itemsArray = $.makeArray(items), top_leftbtn = $('#top_leftbtn'), top_rightbtn = $('#top_rightbtn'), maskL = $('#maskL'), maskR = $('#maskR'), getClientW = function(){
    return topFocusContainer.outerWidth();
}, itemW = items.width() | 640, clientW = topFocusContainer.outerWidth(), sideW = (clientW - itemW) / 2, count = items.length, getSideW = function(){
    return (getClientW() - itemW) / 2;
};
var posArray = [];

function DoTopFocus(){

    var playTimes = 0, auto = true;
    
    initPos();
    
    function initPos(){
    
        for (var i = 0; i < count; i++) {
            if (i == 0) {
                posArray[i] = -(itemW - sideW);
            }
            else {
                posArray[i] = posArray[i - 1] + itemW;
            }
            
        }
        
        maskL.css('width', getSideW());
        maskR.css('width', getSideW());
        
        for (var i = 0; i < count; i++) {
        
            $(itemsArray[i]).css({
                'left': posArray[i],
                'top': 0
            });
        }
        
        
    }
    $(window).bind('resize', function(e){
        clientW = topFocusContainer.outerWidth();
        sideW = (clientW - itemW) / 2;
        initPos();
    });
    
    function setPos(){
    
        for (var i = 0; i < count; i++) {
            
            $(itemsArray[i]).animate({
                'left': posArray[i]
            });
			
        }
    }
       
    
    top_rightbtn.bind('click', function(e){
    
        auto = false;
        clearTimeout(timer);
        playTimes=playTimes+1
		if(playTimes>=count - 1){playTimes=0}
        var removedElem = itemsArray.shift();
        itemsArray.push(removedElem);
        
        $(removedElem).css({
            'left': posArray[count - 1],
            'top': 0
        });        
        setPos();
        timer = setTimeout(autoPlay, 6000);
    });
    
    
    top_leftbtn.bind('click', function(e){
    
        auto = false;
        clearTimeout(timer);
        playTimes=playTimes-1
		if(playTimes<0){playTimes=count - 1}
        var removedElem = itemsArray.pop();
        itemsArray.unshift(removedElem);
        $(removedElem).css({
            'left': posArray[0] - sideW,
            'top': 0
        });
        
         setPos();
		 timer = setTimeout(autoPlay, 6000);
        
    });
    var timer = null;
    function autoPlay(){
        var removedElem = itemsArray.shift();
        itemsArray.push(removedElem);
        
        $(removedElem).css({
            'left': posArray[count - 1],
            'top': 0
        });
        
        setPos();
        if (auto == true && playTimes < count - 1) {
            timer = setTimeout(autoPlay, 6000);
            playTimes++;
			if(playTimes>=count - 1){playTimes=0} //Ñ­»·
        }
    }
	 timer = setTimeout(autoPlay, 6000);  
};


DoTopFocus();