/*
1/. Read array
2/. set left margin to == width
3/. load image into background
4/. reduce left-margin to 0
5/. set background image of real back to that of slide
6/ repeat until array is empty
*/
 
var imageslide={
        counter: 0,
        repeat: true,   //true / false flag to set repeatability of cycle
        transition: 'fade',   //transition type  - currently 'fade' or 'slide'
        startState: 1, // 0=no image - transition to image 1; 1=1st image displayed from start - transition to image 2
        startdelay: 2000, //delay before imageslide starts
        transitiondelay: 2000,  //delay between transition starts
        transitiontime: 1800,   //time taken by transition - should be less than transition delay
 
        start: function()
        {
              if (document.getElementById("imageBoxSlideshow") && document.getElementById("bannerImages") && $("#bannerImages img").length>0)
              {
                  /*window.setTimeout("imageslide[imageslide.transition]()",imageslide.startdelay);  - this is too clever for IE to parse*/
                  imageslide.div = $("#imageBoxSlideshow");
                  imageslide.imageArray=$("#bannerImages img");
                  //set first image
                  if (imageslide.startState==1)
                  {
                      imageslide.div.parent().css("background","url("+imageslide.imageArray[0].src+") 0 0 no-repeat");
                      if (imageslide.imageArray.length>1) imageslide.counter++;
                  }
                  if (imageslide.transition=='slide')
                  {
                      window.setTimeout("imageslide.slide()",imageslide.startdelay);
                  }
                  else if (imageslide.transition=='fade')
                  {
                      window.setTimeout("imageslide.fade()",imageslide.startdelay);
                  }
 
              }
        },
 
 
    slide: function()
    {
        var array=imageslide.imageArray;
        var div=imageslide.div;
        div.css("marginLeft",div[0].parentNode.offsetWidth);
        div.css("backgroundImage","url("+array[imageslide.counter].src+")");
        div.animate({marginLeft: 0},imageslide.transitiontime,imageslide.next);
    },
 
    fade: function()
    {

        var array=imageslide.imageArray;
        var div=$(imageslide.div);
        div.css("opacity",0);
        div.css("backgroundImage","url("+array[imageslide.counter].src+")");
        div.animate({opacity: 1},imageslide.transitiontime,'',imageslide.next);
    },
 
    reset: function(div)
    {
        var imagebx=document.getElementById("imageBox");
        if (imageslide.transition=='slide')
        {
            div.style.marginLeft=imagebx.clientWidth;
        }
        else if (imageslide.transition=='fade')
        {
             $(div).css("opacity",0);
        }
    },
 
    next: function()
    {
        var imagebx=document.getElementById("imageBox");
        var slideshw=document.getElementById("imageBoxSlideshow");
        imagebx.style.backgroundImage=slideshw.style.backgroundImage;
        imagebx.style.backgroundPosition="0 0";
        imagebx.style.backgroundRepeat="no-repeat";
        imageslide.reset(slideshw);

        //setting up the hyperlink
        var current_image=imageslide.imageArray[imageslide.counter];
        var a=current_image.parentNode;
        if (a.nodeName=="A" && a.href!="")
        {
             eval("imagebx.onclick=function(){window.location.href='"+a.href+"'};");
        }
        else
        {
             imagebx.onclick=function(){};
        }


        imageslide.counter++;
        if (imageslide.counter>=imageslide.imageArray.length && imageslide.repeat==true)
        {
 
                imageslide.counter=0;
         }
         else if (imageslide.counter>=imageslide.imageArray.length && imageslide.repeat==false)
        {
 
                return;
        }
 
             if (imageslide.transition=='slide')
            {
                 window.setTimeout("imageslide.slide()",imageslide.startdelay);
            }
            else if (imageslide.transition=='fade')
             {
                  window.setTimeout("imageslide.fade()",imageslide.startdelay);
            }
       
 
    }
 
 
};
$(document).ready(function(){
imageslide.start();
});