/*
 * version : 1
 * var slider = new sliderWidth("slider", "bannerViewDiv", 600, 38, 1);
 * slider.itemList[slider.itemList.length] = '<img src="" width="113" height="38">';
 * slider.itemList[slider.itemList.length] = "<label>º£³Ê¸µÅ©</label>";
 * slider.init();
 *
 * var [ÀÎ½ºÅÏ½º¸í] = new SliderWidth("[ÀÎ½ºÅÏ½º¸í]","[Ãâ·ÂµÇ¾îÁú ·¹ÀÌ¾î]", [°¡·Î ±æÀÌ], [¼¼·Î ±æÀÌ], [¼Óµµ]);
 * 
 * ¸ðµçÇ×¸ñ ÇÊ¼ö
 * instanceName         : ¼±¾ðµÈ instanceÀÇ ÀÌ¸§ : timer ÁöÁ¤½Ã ´ë»ó object ¼±º°¿¡ »ç¿ë
 * outLayer		: Ãâ·ÂµÇ¾îÁú ·¹ÀÌ¾î ÀÌ¸§
 * sliderWidth		: º¸¿©Áú slider °¡·Î ±æÀÌ
 * sliderHeight		: º¸¿©Áú slider ¼¼·Î ±æÀÌ
 * slideSpeed		: sliding ¼Óµµ
 *
 */
 
function SliderWidth(instanceName, outLayer, sliderWidth, sliderHeight, slideSpeed){
    this.instanceName = instanceName;
    this.outLayer = outLayer;
    this.sliderWidth = sliderWidth;
    this.sliderHeight = sliderHeight;
    this.slideSpeed = slideSpeed;
    this.itemList = new Array();

    this.inited = false;
    this.cross_slide = null;
    this.cross_slide2 = null;
    this.copySpeed = 1;
    this.actualWidth = 0;

    this.init = function (){
        if(!this.inited){
            this.copySpeed = this.slideSpeed;
            this.itemList='<nobr>'+this.itemList.join(" ")+'</nobr>';

            var str = '<div style="position:relative;width:'+this.sliderWidth+';height:'+this.sliderHeight+';overflow:hidden;">';
                str+= '<div style="position:absolute;width:'+this.sliderWidth+';height:'+this.sliderHeight+';" onMouseover="'+this.instanceName+'.copySpeed=0" onMouseout="'+this.instanceName+'.copySpeed='+this.slideSpeed+'">';
                str+= '<div id="FIRST_SLIDE_LAYER" style="position:absolute;left:0px;top:0px;"></div>';
                str+= '<div id="LAST_SLIDE_LAYER" style="position:absolute;left:0px;top:0px;"></div>';
                str+= '</div></div>';
            document.getElementById(outLayer).innerHTML += str;
            
            this.cross_slide = document.getElementById("FIRST_SLIDE_LAYER");
            this.cross_slide2 = document.getElementById("LAST_SLIDE_LAYER");
            this.cross_slide.innerHTML = this.itemList;
            this.cross_slide2.innerHTML = this.itemList;
            this.inited = true;
        }
        if(document.getElementById('FIRST_SLIDE_LAYER').offsetWidth < 1){
            setTimeout(this.instanceName + ".init()", 30);
        }else{
            this.startSliding();
        }
    }
    
    this.startSliding = function (){
        this.actualWidth = this.cross_slide.offsetWidth;
        this.cross_slide2.style.left = this.actualWidth + 4;
        setInterval(this.instanceName + ".slideLeft()", 30);
    }

    this.slideLeft = function (){
        if(parseInt(this.cross_slide.style.left) > (this.actualWidth * (-1) + 8)){
            this.cross_slide.style.left = parseInt(this.cross_slide.style.left) - this.copySpeed;
        }else{
            this.cross_slide.style.left = parseInt(this.cross_slide2.style.left) + this.actualWidth+30;
        }

        if(parseInt(this.cross_slide2.style.left) > (this.actualWidth * (-1) + 8)){
            this.cross_slide2.style.left = parseInt(this.cross_slide2.style.left) - this.copySpeed;
        }else{
            this.cross_slide2.style.left = parseInt(this.cross_slide.style.left) + this.actualWidth + 30;
        }
    }
}