

(function($){
    $(function() {

    var isAnime = false;
    var _len = 0;
    var _currentConte = 0;
    var _minX = 0;
    var _maxX = 0;
    var _xmlPath = "/common/xml/bp.xml";
    var $slideWrp = $("#bpSlideWrp");
    var $conteWrp = $(".bpContentWrp");
    var _contentWrpArr = [];
    var $conteTEMP = $("#bpConteTemp");
    var $btnTEMP = $("#bpBtnTemp");
    var $btnArea = $("#bpUIArea");
    var $btnWrp = $("#bpBtns");
    var $nextBtn = $("#bpNext");
    var $backBtn = $("#bpBack");

    var changeInterval = 3000;
    var autoTimer;
    

    $.get(_xmlPath, null, xmlComplete);
	function xmlComplete(data){
		_len = $(data).find("item").length;

        changeInterval = Number($(data).find("autoInterval").text()) * 1000;
        $(data).find("item").each(function(i){
            var item = $(this);
            
            var $btn = $btnTEMP.clone();
            $btn.attr("id", "bpBtn" + String(i));
            $btn.bind("click", btnClick);
            $btnWrp.append($btn);

            var $conte = $conteTEMP.clone();
            $conte.attr("id", "bpConte" + String(i));
            $conte.find("a").attr("href",item.find("href").text());
            $conte.find("a").append($("<img src='"+ item.find("src").text() + "' alt='"+item.find("alt").text()+"'/'>"));
            $conteWrp.append($conte);
        });
        _contentWrpArr.push($conteWrp);

        for(i=-2; i<3; i++){
            if(i==0)continue;
            var $conte = $conteWrp.clone();
            $slideWrp.append($conte);
            var num = (_len * 883) * i - 20;
            if(i==-2)_minX = num;
            else if(i==2) _maxX = num;
            $conte.css("left", num);
            $conte.addClass("c" + String(i));
//            $conte.css("width", _len * 883);
            _contentWrpArr.push($conte);
        }

        $btnTEMP.remove();
        $conteTEMP.remove();
		
		$conteWrp = $(".bpContentWrp");
		
        $btnArea.css("margin-left", (_len * 20 + 120) * -0.5);
        $conteWrp.css("width", _len * 883 + 100);
        $conteWrp.css("height", 1);
        $slideWrp.css("width", _len * 883 * 5);
        
        $(".brandPanel").css("overflow", "hidden");
        $(".bpWrp").css("overflow", "hidden");

        $nextBtn.bind("click", goNext);
        $backBtn.bind("click", goBack);

        $("#bpBtn0").attr("src", "/imgs/bpBtn_ov.jpg");
        $("#bpBtn0").removeClass("ahover");
				
				$(".brandPanel").css({
						overflow:"hidden",
						zoom: 1,
						position: "relative"
				});
				
		if(navigator.userAgent.indexOf("Android")>=0){
			$(".bpWrp").css("width", 956);
			$(".brandPanel").css("width", 956);
		}


        autoTimer = setInterval(goNext, changeInterval);
    }

    function btnClick(){
        var $this = $(this);
        var num = Number($this.attr("id").split("Btn")[1]);
        
        switchConte(num);
    }

    function goNext(){
        var num = _currentConte + 1;
        if(num==_len)num = 0;
        switchConte(num, 1);
    }

    function goBack(){
        var num = _currentConte - 1;
        if(num == -1)num = _len - 1;
        switchConte(num, -1);
    }
        
    function switchConte(num, dir){
        clearInterval(autoTimer);
        autoTimer = setInterval(goNext, changeInterval);
        if(_currentConte == num)return;
        if(isAnime)return;
        isAnime = true;

        var moveNum = Math.abs(num - _currentConte);
        if(!dir) dir = (num - _currentConte > 0)? 1 : -1;
        else moveNum = 1;

        if(moveNum > _len*0.5) {
            dir *= -1;
            moveNum = _len - moveNum;
        }
        
        var $thisBtn = $("#bpBtn" + String(num));
        var $prevBtn = $("#bpBtn" + String(_currentConte));
        _currentConte = Number(num);

        for(var i=0; i<5; i++){
            var $conte = _contentWrpArr[i];
            var num = Number($conte.css("left").split("px")[0])
            num += (883*moveNum) * -dir;
            
            $conte.animate({left:num}, 500, "linear", function(){
                var $this = $(this);
                var thisX = Number($this.css("left").split("px")[0]);
                
                if(thisX < _minX ) {
                    $this.css("left", thisX + (-_minX + _maxX));
                }
                else if(thisX >= _maxX){
                    $this.css("left", thisX - (-_minX + _maxX));
                }
                isAnime = false;
            });
        }
        

        $prevBtn.attr("src", "/imgs/bpBtn.jpg");
        $prevBtn.addClass("ahover");

        $thisBtn.removeClass("ahover");
        $thisBtn.attr("src", "/imgs/bpBtn_ov.jpg");
        
    }

        
    });
})(jQuery);
