var Demos = [];
var DivObj = [];
var ContainerDivObj = [];
var ImageObj = [];
var MainContainerMain = null;
var SliderFlag = false;
var SlideLength = 0;
var TempLength = 0;
var timer = 0;
var timer
var thisWidth = 0;
var IntTimer = true;

function MM_findObjSlider(n, d) { //v4.01
    var p, i, x; if (!d) d = document; if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
        d = parent.frames[n.substring(p + 1)].document; n = n.substring(0, p);
    }
    if (!(x = d[n]) && d.all) x = d.all[n]; for (i = 0; !x && i < d.forms.length; i++) x = d.forms[i][n];
    for (i = 0; !x && d.layers && i < d.layers.length; i++) x = MM_findObjSlider(n, d.layers[i].document);
    if (!x && d.getElementById) x = d.getElementById(n); return x;
}

window.onresize = function() {
    var slideCount = 0
    var thisObj = getPositionSlider(MainContainerMain);
    var slideLeftPosition = thisObj.x;
    for (slideCount = 0; slideCount < Demos.length; slideCount++) {
        Demos[slideCount].style.left = slideLeftPosition;
        slideLeftPosition = parseFloat(slideLeftPosition) + parseFloat(Demos[slideCount].offsetWidth) + 1;
    }
}
window.onload = function() {
    
    MainContainerMain = MM_findObjSlider('MainSlider');
    var ObjPosition = getPositionSlider(MainContainerMain);
    var ObjWidth = 0;
    var NodeLength = 0;
    var DivIndex = 0
    for (NodeLength = 0; NodeLength < MainContainerMain.childNodes.length; NodeLength++) {
        if (MainContainerMain.childNodes.item(NodeLength).nodeName == "DIV") {
            var cObj = MainContainerMain.childNodes.item(NodeLength);
            var ConDivObj = null;
            cObj.style.position = 'absolute';
            cObj.style.left = ObjPosition.x + ObjWidth;
            cObj.style.height = "273px";
            cObj.style.width = "87px"
            cObj.setAttribute("OldWidth", cObj.offsetWidth);
            cObj.setAttribute("Index", DivIndex);
            cObj.setAttribute("Max", false);
            if (cObj.addEventListener) {
                ImageObj.push(FindImageObjSlider(cObj, 1));
                DivObj.push(FindImageObjSlider(cObj, 2));
                ConDivObj = FindImageObjSlider(cObj, 3);
                ContainerDivObj.push(ConDivObj);
                cObj.addEventListener('click', eventHandler, true);
            } else {
                ImageObj.push(FindImageObjSlider(cObj, 1));
                DivObj.push(FindImageObjSlider(cObj, 2));
                ConDivObj = FindImageObjSlider(cObj, 3);
                ContainerDivObj.push(ConDivObj);
                cObj.attachEvent('onclick', eventHandler);
            }
            DivIndex += 1;
            Demos.push(cObj);
            ObjWidth += cObj.offsetWidth;
        }
    }
    SlideLength = (MainContainerMain.offsetWidth - (Demos[0].offsetWidth * Demos.length));
    SliderFlag = false;
    OpenSlider(0);
}

function FindImageObjSlider(thisObj,thisIndex) {
    var ImageObj = null;  
    var DivLength = 0;
    var ObjLength = 0;
    var divHeight = 0;
    for (ObjLength = 0; ObjLength < thisObj.childNodes.length; ObjLength++) {
        if (thisObj.childNodes.item(ObjLength).nodeName == "DIV") {
            DivLength += 1
            if (DivLength == thisIndex) {
                if (thisIndex != 1) {
                    divHeight = parseFloat(MainContainerMain.offsetHeight) - parseFloat(divHeight);
                    ImageObj = thisObj.childNodes.item(ObjLength);
                    ImageObj.style.backgroundImage = 'url(' + ImageObj.getAttribute("ImageSrc") + ')';
                    ImageObj.style.backgroundRepeat = 'no-repeat';
                    ImageObj.style.height = divHeight+2;
                    ImageObj.style.backgroundPosition = "bottom";
                    if (thisIndex == 3) { ImageObj.style.display = "none" }
                } else {
                    ImageObj = thisObj.childNodes.item(ObjLength).childNodes.item(0);
                }
                break;
            } else if (DivLength == 1) {
                divHeight = parseFloat(thisObj.childNodes.item(ObjLength).offsetHeight);
            } 
        }
    }
    return ImageObj
}

function FindSlider(thisObj) {
    var sliderObj = null;
    if (thisObj.getAttribute("type")) {
        sliderObj = thisObj;
    } else {
        sliderObj = FindSlider(thisObj.parentNode)
    }
    return sliderObj;
}

function eventHandler(e) {
       
    var str = "";
    var thisObj = null;
    var CloseSliderIndex = 0;

    if (e.target) {
        thisObj = e.target;
    } else {
        thisObj = e.srcElement;
    }
    
    thisObj = FindSlider(thisObj)
            
    var OpenSliderIndex = thisObj.getAttribute("Index");
    
    if (String(Demos[OpenSliderIndex].getAttribute("Max")) == "true") {
        return false;
    }
    
    if (IntTimer == false) { return }
    IntTimer = false;
    
    for (CloseSliderIndex = 0; CloseSliderIndex < Demos.length; CloseSliderIndex++) {
        if (String(Demos[CloseSliderIndex].getAttribute("Max")) != "false") { break; }
    }
    
    SliderFlag = false;
    if (CloseSliderIndex < Demos.length) { SliderFlag = false; OpenCloseSlider(CloseSliderIndex, OpenSliderIndex) };
}

function getObjectSlider(thisObj,TagNode) {
    var returnObj = null;
    var Flag = false;
    var childObjLenght = 0;
    for (childObjLenght = 0; childObjLenght < thisObj.childNodes.length; childObjLenght++) {
        if (thisObj.childNodes.item(childObjLenght).nodeName == TagNode) {
            returnObj = thisObj.childNodes.item(childObjLenght);
            Flag = true;
            break;
        }
    }
    return { Flag: Flag, obj: returnObj };
}

function OpenCloseSlider(CloseSliderIndex, OpenSliderIndex) {
   if (!SliderFlag) {
        Demos[CloseSliderIndex].setAttribute("Max", false);
        TempLength = parseFloat(Demos[CloseSliderIndex].getAttribute("OldWidth"));        
    }
    
    var TempIndex = 0;
    var SliderWidth = Demos[CloseSliderIndex].offsetWidth;
    if (SliderWidth > TempLength) {
        for (TempIndex = CloseSliderIndex; TempIndex < Demos.length; TempIndex++) {
            if (TempIndex == CloseSliderIndex) {
                if (!SliderFlag) {
                    var childDivObj = getObjectSlider(ContainerDivObj[TempIndex], "DIV");
                    if (childDivObj.Flag == true) {childDivObj.obj.style.display = "none" };
                    var inActiveImg = ImageObj[TempIndex].getAttribute("ImageSrcInAct");
                    ImageObj[CloseSliderIndex].src = inActiveImg;
					ImageObj[CloseSliderIndex].style.cursor = "pointer";
                }
                SliderWidth = SliderWidth - 15;
                if (SliderWidth < TempLength){SliderWidth = TempLength}
                Demos[TempIndex].style.width = SliderWidth;
                ContainerDivObj[TempIndex].style.width = SliderWidth;
                DivObj[TempIndex].style.width = SliderWidth;
                if (SliderWidth < 100) {
                    ContainerDivObj[TempIndex].style.display = "none";
                    DivObj[TempIndex].style.display = ""
                    var ImageSource = DivObj[TempIndex].getAttribute("ImageSrc");
                    DivObj[TempIndex].style.backgroundImage = 'url("' + ImageSource + '")';
                    DivObj[TempIndex].style.backgroundPosition = "bottom";       
                 }
             } else {
                var ObjPosition = getPositionSlider(Demos[TempIndex - 1]);
                var thisLeftPosition = ObjPosition.x + (Demos[TempIndex - 1].offsetWidth + 1);
                Demos[TempIndex].style.left = thisLeftPosition;
            }
        }
        if (!SliderFlag) {
            SliderFlag = true;            
            timer = setInterval("OpenCloseSlider(" + CloseSliderIndex + "," + OpenSliderIndex + ")", 10);
        }
    } else {
        clearInterval(timer);
        SliderFlag = false;
        OpenSlider(OpenSliderIndex);
    }
}

function OpenSlider(SliderIndex) {
    if (SliderFlag == false) {
        var ImageSource = ContainerDivObj[SliderIndex].getAttribute("ImageSrc");
        if (String(Demos[SliderIndex].getAttribute("Max")) == "false") {
            Demos[SliderIndex].setAttribute("Max", true);
        }
        
        TempLength = 0;
        if (Demos[SliderIndex].addEventListener) {
              thisWidth = Demos[SliderIndex].offsetWidth - 1;
          } else {
            
            thisWidth = Demos[SliderIndex].offsetWidth;
        }

        TempLength = SlideLength + parseFloat(Demos[SliderIndex].getAttribute("OldWidth"));
        DivObj[SliderIndex].style.display = "none";
        ContainerDivObj[SliderIndex].style.display = "";
        ContainerDivObj[SliderIndex].style.backgroundImage = 'url("' + ImageSource + '")';
        ContainerDivObj[SliderIndex].style.backgroundPosition = "bottom";
    }
   
    var TempIndex = 0;
    var SliderWidth = Demos[SliderIndex].offsetWidth;
    if (SliderWidth < TempLength - 4) {
        for (TempIndex = SliderIndex; TempIndex < Demos.length; TempIndex++) {
            if (TempIndex == SliderIndex) {
                if (SliderFlag == false) {
                    var ActiveImg = ImageObj[TempIndex].getAttribute("ImageSrcAct");
                    ImageObj[TempIndex].src = ActiveImg;
					ImageObj[TempIndex].style.cursor = "default";
                }
                thisWidth += 15;
                if (thisWidth > TempLength) {thisWidth = TempLength-4;}
                Demos[TempIndex].style.width = thisWidth;
                ContainerDivObj[TempIndex].style.width = thisWidth;
            }
            else {
                var ObjPosition = getPositionSlider(Demos[TempIndex - 1]);
                var thisLeftPosition = ObjPosition.x + (Demos[TempIndex - 1].offsetWidth + 1); 
                Demos[TempIndex].style.left = thisLeftPosition;
            }
        }
        if (SliderFlag == false) {
            timer = setInterval("OpenSlider(" + SliderIndex + ")", 1);
            SliderFlag = true;
        }
    }
    else {
        var childDivObj = getObjectSlider(ContainerDivObj[SliderIndex], "DIV");
        if (childDivObj.Flag == true) {
            childDivObj.obj.style.display = ""
            //childDivObj.obj.style.width = ContainerDivObj[SliderIndex].offsetWidth;
            childDivObj.obj.style.height = ContainerDivObj[SliderIndex].offsetHeight;
            childDivObj.obj.style.overflow = "auto";
         };
        IntTimer = true;
        clearInterval(timer);
    }
}

function getPositionSlider(thisObj) {
    var tempObj = thisObj;
    var left = 0;
    var top = 0;
    var height = tempObj.offsetHeight;
    while (tempObj != null) {
        top += tempObj.offsetTop;
        left += tempObj.offsetLeft;
        tempObj = tempObj.offsetParent;
    }
    return { x: left, y: top+2, parHeight: height };
}