/**
 * Class helps display a slideshow of elements.  The elements fade in and out.
 */
function SlideShow(containerId, elementType, fadeTime, toggleTime, autoToggle)
{
    this.containerId = containerId;
    this.elementType = elementType;
    this.fadeTime = fadeTime;
    this.toggleTime = toggleTime;
    this.autoToggle = autoToggle;

	this.startTimer = SlideShow_startTimer;    
    this.next = SlideShow_next;
    this.prev = SlideShow_prev;
    this.select = SlideShow_select;
    this.selectNoFade = SlideShow_selectNoFade;
    this.toggle = SlideShow_toggle;
    this.setAutoToggle = SlideShow_setAutoToggle;
    this.toggleImages = SlideShow_toggleImages;
    this.toggleImagesNoFade = SlideShow_toggleImagesNoFade;
}

function SlideShow_startTimer()
{
    var thisObj = this;
    setInterval(function(){ thisObj.toggle() }, this.toggleTime );    
}

function SlideShow_next()
{
    var $first = $("#" + this.containerId + " " + this.elementType + ":first");
    var $last = $("#" + this.containerId + " " + this.elementType + ":last");
    var $active = $("#" + this.containerId + " " + this.elementType + ".active");

    if ( $active.length == 0 )
    {
        $active = $last;
    }

    var $next = $active.next().length ? $active.next() : $first;
	this.toggleImages($active, $next);
}

function SlideShow_prev()
{
    var $first = $("#" + this.containerId + " " + this.elementType + ":first");
    var $last = $("#" + this.containerId + " " + this.elementType + ":last");
    var $active = $("#" + this.containerId + " " + this.elementType + ".active");

    if ( $active.length == 0 )
    {
        $active = $first;
    }

    var $next = $active.prev().length ? $active.prev() : $last;
	this.toggleImages($active, $next);
}

function SlideShow_select(id)
{
    var $first = $("#" + this.containerId + " " + this.elementType + ":first");
    var $last = $("#" + this.containerId + " " + this.elementType + ":last");
    var $active = $("#" + this.containerId + " " + this.elementType + ".active");
    var $next = $("#" + id);

    if ( $active.length == 0 )
    {
        $active = $first;
    }

	this.toggleImages($active, $next);
}

function SlideShow_selectNoFade(id)
{
    var $first = $("#" + this.containerId + " " + this.elementType + ":first");
    var $last = $("#" + this.containerId + " " + this.elementType + ":last");
    var $active = $("#" + this.containerId + " " + this.elementType + ".active");
    var $next = $("#" + id);

    if ( $active.length == 0 )
    {
        $active = $first;
    }

	this.toggleImagesNoFade($active, $next);
}

function SlideShow_toggle()
{
	if (this.autoToggle)
	{
		this.next();
	}
}

function SlideShow_setAutoToggle(autoToggle)
{
	this.autoToggle = autoToggle;
}

function SlideShow_toggleImages($active, $next)
{
    if (this.elementType == "img" && $next.attr("src") == "")
    {
        $next.attr("src", $next.attr("alt"));
        $next.attr("alt", "");
    }

    $active.animate({ opacity: 0.0}, this.fadeTime);
    $next.css({'opacity':'0.0', 'display':''})
        .addClass('active')
        .animate({ opacity: 1.0}, this.fadeTime, function() {
            $active.removeClass('active');
            $active.css({'display':'none'});
        });
}

function SlideShow_toggleImagesNoFade($active, $next)
{
    if (this.elementType == "img" && $next.attr("src") == "")
    {
        $next.attr("src", $next.attr("alt"));
        $next.attr("alt", "");
    }

    $active.css({ opacity: 0.0, 'display':'none'})
    	.removeClass('active');
    $next.css({'opacity':'1.0', 'display':''})
        .addClass('active')
}