function $Item(id) {
    var Element = document.getElementById(id);
    Element.hide = function () {
        Element.style.display = "none";
    }
    Element.show = function () {
        Element.style.display = "";
    }
    Element.setStyle = function () {
        Element.style[arguments[0]] = arguments[1];
    }
    Element.getStyle = function () {
        return Element.style[arguments[0]];
    }
    return Element;
}
//________________________________________________________________________________________________________________________________
function AnimateClass() 
{
    this.arrAnimate = Array();
    this.CurrIndex = 0;
    this.Speed = 0;
    this.GetDivViewMain = ""; // $("DivViewAnimation"); // document.getElementById("DivViewAnimation");
    this.GetDivCaptions = "";
    this.GetDivContent = "";
    this.IsMove = true;
    this.tempIndex = 0;
    this.GetTiemOuttemp = 0;
    this.newElementIndex = -1;
    this.GetTimeoutID = 0;
    this.GetTimeoutIDNexItem = 0;
    this.GetTimeoutIDTemp = 0;
    this.GetTimeoutIDFirst = 0;
    this.SpeedIE8 = false;
    var that = this;
    //=================================================================================================
    this.InitilazeAnimate = function () {

        if (window.navigator.userAgent.indexOf("MSIE 8")>0)
            that.SpeedIE8 = true;
        else
            that.SpeedIE8 = false;
        getArrayChilds = that.GetDivViewMain.getElementsByTagName("ul");
        getArrayCaptions = that.GetDivCaptions.getElementsByTagName("a");
        for (i = 0; i < getArrayChilds.length; i++) {
            that.arrAnimate[i] = getArrayChilds.item(i);
            that.arrAnimate[i].style.width = that.GetDivViewMain.style.width;
            that.arrAnimate[i].style.margin = "0px";
            that.arrAnimate[i].style.padding = "0px";
            that.arrAnimate[i].style.top = "0px";
            that.arrAnimate[i].style.left = "0px";
            getArrayCaptions.item(i).setAttribute("onclick", function () { return that.StopAnimate(this) }); //for IE<8
            getArrayCaptions.item(i).onclick = function () { return that.StopAnimate(this) }; //for IE=8
        }

        that.ChangeColor(0);
        that.SetPosition(that.CurrIndex);
    }
    //=================================================================================================
    this.SetPosition = function (indexArr)
     {
        that.arrAnimate[indexArr].style.left = "0px";
        for (i = indexArr - 1; i >= 0; i--) 
        {
            //that.arrAnimate[i].style.left = (parseInt(that.arrAnimate[i + 1].style.left) - parseInt(that.arrAnimate[i].style.width)) + "px";
            //that.arrAnimate[i].style.right = (parseInt(that.arrAnimate[i].style.left) + parseInt(that.arrAnimate[i].style.width)) + "px";
            that.arrAnimate[i].style.left = (parseInt(that.arrAnimate[i + 1].style.left) - parseInt(that.arrAnimate[i].offsetWidth)) + "px";
            //that.arrAnimate[i].style.right = (parseInt(that.arrAnimate[i].style.left) + parseInt(that.arrAnimate[i].offsetWidth)) + "px";

        }
        for (i = indexArr + 1; i < that.arrAnimate.length; i++) 
        {
            that.arrAnimate[i].style.left = (parseInt(that.arrAnimate[i - 1].style.left) + parseInt(that.arrAnimate[i].offsetWidth)) + "px";
            //that.arrAnimate[i].style.right = (parseInt(that.arrAnimate[i].style.left) + parseInt(that.arrAnimate[i].offsetWidth)) + "px";

        }
    }
    //=================================================================================================
    this.ChangePosition = function (indexArr, ToMoveArrow) {
        if (arguments.length > 1) {

            if (that.SpeedIE8) {
                if (that.Speed <= 0)
                    that.Speed = parseInt(that.GetDivViewMain.offsetWidth) / 4;
                that.Speed *= 2;

            }
            else
                that.Speed = parseInt(that.GetDivViewMain.offsetWidth) / 5;
            // parseInt(that.GetDivViewMain.offsetWidth) / 5;

            if (ToMoveArrow < 0)
                that.Speed *= -1;
            for (i = 0; i < that.arrAnimate.length; i++)
                that.arrAnimate[i].style.left = (parseInt(that.arrAnimate[i].style.left) + that.Speed) + "px";
        }
        else {
            that.Speed =5;
            for (i = 0; i < that.arrAnimate.length; i++)
                that.arrAnimate[i].style.left = (parseInt(that.arrAnimate[i].style.left) - that.Speed) + "px";
        }
    }
//___________________________________________________________________________________________________________________________________________
    this.MoveToFirst = function () {

        if (!that.IsMove) {
            window.clearTimeout(that.GetTimeoutIDTemp);
            return;
        }
        if (that.newElementIndex<0)
            that.ChangeColor(1);
        index = 0;
        if (that.newElementIndex >= 0)
            index = that.newElementIndex;


        if (parseInt(that.arrAnimate[index].style.left) >= 0) {
            that.newElementIndex = -1;
            that.arrAnimate[index].style.left = "0px";
            that.Speed = 0;
            that.CurrIndex = index;
            that.SetPosition(that.CurrIndex);
            that.IsMove = true;
            that.GetTimeoutID = window.setTimeout(that.AnimateMove, 5000);
            return;
        }
        that.ChangePosition(that.CurrIndex, 1);

        that.GetTimeoutIDTemp = window.setTimeout(that.MoveToFirst, 20);
    }
    //===========================================================================================================
    this.ChangeColor = function () 
    {
        GetIndex = that.CurrIndex;
        if (arguments.length > 0)
            GetIndex = 0;
        for (i = 0; i < that.arrAnimate.length; i++)
         {
            if (i == GetIndex)
                that.GetDivCaptions.getElementsByTagName("a").item(i).style.backgroundColor = "#FEF0C5";
            else
                that.GetDivCaptions.getElementsByTagName("a").item(i).style.backgroundColor = "transparent";
        }
    }
    //=================================================================================================================================
    this.AnimateMove = function () 
    {
        if (!that.IsMove) 
             return;
        
         if (that.newElementIndex >= that.CurrIndex)
          {
             //window.clearTimeout(GetTimeoutIDNexItem);
             if (parseInt(that.arrAnimate[that.newElementIndex].style.left) <= 5) 
              {
                  that.CurrIndex = that.newElementIndex;
                  that.arrAnimate[that.newElementIndex].style.left = "0px";
                  that.Speed = 0;
                  that.SetPosition(that.newElementIndex, 1);
                  that.newElementIndex = -1;
                  that.GetTimeoutIDNexItem = window.setTimeout(that.AnimateMove, 6000);
                  //$("DivInfo").innerHTML = "New Item Stage --> Current Index : " + CurrIndex + "  And newElementIndex : " + newElementIndex;
                  return;
              }

              that.ChangePosition(that.newElementIndex,-1);
              window.clearTimeout(that.GetTimeoutID);
                  that.GetTimeoutID = window.setTimeout(that.AnimateMove, 5);
              return;
          }
          if (that.newElementIndex<0)
              that.ChangeColor();
          if (parseInt(that.arrAnimate[that.CurrIndex].style.left) <= 5) 
        {

            that.arrAnimate[that.CurrIndex].style.left = "0px";
            that.Speed = 0;
            that.SetPosition(that.CurrIndex);
            if (that.CurrIndex >= that.arrAnimate.length - 1)
             {
                that.tempIndex = -1;
                window.clearTimeout(that.GetTiemOut);
                that.GetTimeoutIDFirst = window.setTimeout(that.MoveToFirst, 6000);
                return;
            }
            that.CurrIndex++;
            that.GetTimeoutIDNexItem = window.setTimeout(that.AnimateMove, 6000);
            return;
        }
        that.ChangePosition(that.CurrIndex);
        that.GetTimeoutID = window.setTimeout(that.AnimateMove, 10);
    }
    //========================================================================================================
    this.MoveToElement = function ()
     {
        if (that.CurrIndex > that.newElementIndex) 
        {
             that.IsMove = true;
             that.MoveToFirst();
             return false;
         }
         else if (that.CurrIndex < that.newElementIndex)
         {
              that.IsMove = true;
              that.AnimateMove(1);
             return false;
         }
         return false;
    }
    //===================================================================================================
     this.StopAnimate = function (element) 
    {
        window.clearTimeout(that.GetTimeoutID);
        window.clearTimeout(that.GetTimeoutIDNexItem);
        window.clearTimeout(that.GetTimeoutIDFirst);
        window.clearTimeout(that.GetTimeoutIDTemp);
        that.IsMove = false;
        that.newElementIndex = -1;
        element.style.backgroundColor = "#FEF0C5";
        getArrayCaptions = that.GetDivCaptions.getElementsByTagName("a");
        for (pos = 0; pos < getArrayCaptions.length; pos++) {
            if (element == getArrayCaptions.item(pos))
                that.newElementIndex = pos;
            else
                getArrayCaptions.item(pos).style.backgroundColor = "transparent";
        }
        that.MoveToElement();
        return false;
    }
//++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 
}