jQuery.noConflict();
function ytImgRotator(name, images, urls, delay)
{
    this.name = name;
    this.images = images;
    this.urls = urls;
    this.delay = delay;
    
    this.currentImage = -1;
    this.nextImage = -1;
    this.timerSeed = 0;
    
    this.rotate = function()
    {
        document.write("<style>");
        document.write("#ytImgRotatorDiv { position: relative }");
        document.write("#ytImgRotatorDiv img { position: absolute; left: 0px; top: 0px; visibility: hidden }");
        document.write("#ytImgRotatorControls { margin-top: 11px; margin-bottom: 12px; }");
        document.write(".ytRotatorNormal { background-color: white }");
        document.write(".ytRotatorSelected, #ytImgRotatorControls a:hover { background-color: #c2d6dd }");
        document.write("#ytImgRotatorControls a:link, #ytImgRotatorControls a:visited { font-family: arial; font-size: 12px; text-decoration: none; padding: 2px; padding-left: 5px; padding-right: 5px; border: 1px solid #c2d6dd; margin-right: 6px } ");
        document.write("</style>");

        document.write("<div id=ytImgRotatorDiv><img src=" + this.images[0] + " style='position: relative'>");
        for (var i = 0; i < this.images.length; i++)
        {
            document.write("<a id=ytImgRotatorHref" + (i) + " href=" + this.urls[i] + "><img id=ytImgRotatorImage" + (i) + " border=0 src=");
            if (i == 0)
                document.write(this.images[i]);
            document.write("></a>");
        }
        document.write("<div id=ytImgRotatorControls>");
        for (var i = 0; i < this.images.length; i++)
        {
            document.write("<a href='javascript:void(0)' onclick='" + this.name + ".nextImage = " + (i) + ";" + this.name + ".ytNextImage(" + this.name + ")' id=ytImgRotatorPage" + (i) + ">" + (i + 1) + "</a>");
        }
        document.write("<a style='padding-left: 7px; padding-right: 7px;' href='javascript:void(0)' onclick='" + this.name + ".ytNextImage(" + this.name + ")'>Next</a>");
        document.write("</div>");
        document.write("</div>");
        
        // preload the next image
        if (this.images.length > 1)
        {
            var tmpImg = new Image();
            tmpImg.src = this.images[1];
        }

        this.ytNextImage = function(rot)
        {
            // this is a kludge because IE doesn't pass the extra arguments to the setInterval function.
            var f = function()
            {

                var previousImage = -1;
                if (rot.currentImage >= 0)
                {
                    previousImage = rot.currentImage;
                }
                
                var pg = document.getElementById("ytImgRotatorPage" + rot.currentImage);
                if (pg)
                {
                    pg.className = "ytRotatorNormal";
                }
                if (rot.nextImage >= 0)
                {
                    rot.currentImage = rot.nextImage;
                    rot.nextImage = -1;
                }
                else
                    rot.currentImage ++;

                if (rot.currentImage >= rot.images.length)
                {
                    rot.currentImage = 0;
                }

                var pg = document.getElementById("ytImgRotatorPage" + rot.currentImage);
                if (pg)
                {
                    pg.className = "ytRotatorSelected";
                }
                
                document.getElementById("ytImgRotatorImage" + (rot.currentImage) ).src = rot.images[rot.currentImage];
                document.getElementById("ytImgRotatorHref" + (rot.currentImage) ).href = rot.urls[rot.currentImage];
                
                jQuery("#ytImgRotatorImage" + (rot.currentImage)).css("display","none").css("visibility","visible");
                if (previousImage >= 0)
                {
                    jQuery("#ytImgRotatorImage" + (previousImage)).fadeOut("slow");
                }
                jQuery("#ytImgRotatorImage" + (rot.currentImage)).fadeIn("slow");
                
                // preload the next image
                var im = document.getElementById("ytImgRotatorImage" + (rot.currentImage + 1) );
                if (im)
                    im.src = rot.images[rot.currentImage + 1];
            }
            f();
            self.clearInterval(rot.timerSeed);
            rot.timerSeed = self.setInterval(f, rot.delay * 1000,rot);
        }
        
        this.ytNextImage(this);
    }
}