
function initSlideshow(showIndex) {

    /* ----- procedural setup >>>> ----- */
    var root = showIndex;
    var seconds = 5;
    var slideCount = $("#"+root+" .slides li").size();
    var currentIndex = 0;
    $("#"+root+" .showcontrols .position").text("1 of "+slideCount);

    //startAutoShow();
    $("#"+root+" .slides li:eq(" + currentIndex + ")").fadeIn(1000);
    autoShowInterval = setInterval(function() {},100000000000);
                                  
    /* ----- <<<< procedural setup ----- */



    /* ----- general functions >>>> ----- */

    // automatically move from one horse to another
    function autoShow(direction) {
        oldIndex = currentIndex;
  
        // move forward
        if( direction == "next" ) {
            currentIndex = (oldIndex + 1) % slideCount;
        }
  
        // move backward
        else if( direction == "prev" ) {
      
            // if the departing horse is not the first one
            if( oldIndex > 0 ) {
                currentIndex = (oldIndex - 1) % slideCount;
            }
      
            // if the departing horse is the first one
            else if( oldIndex == 0 ) {
                currentIndex = slideCount - 1;
            }
        }
  
        $("#"+root+" .slides li:eq(" + oldIndex + ")").fadeOut(1000);
        $("#"+root+" .slides li:eq(" + currentIndex + ")").fadeIn(1000);
        $("#"+root+" .showcontrols .position").text((currentIndex+1)+" of "+slideCount);
    }

    /* ----- <<<< general functions ----- */


    /* ----- interactive buttons >>>> ----- */

    // click on the pause button
    $("#"+root+" .showcontrols .playpause a").click(function() {
        if( $(this).hasClass("paused") ) {
            autoShow("next");
            startAutoShow();
        }
        else {
            stopAutoShow();
        }
    });

    // click on the next button
    $("#"+root+" .showcontrols .next a").click(function() {
        autoShow("next");
        stopAutoShow();
    });

    // click on the prev button
    $("#"+root+" .showcontrols .prev a").click(function() {
        autoShow("prev");
        stopAutoShow();
    });

    /* ----- <<<< interactive buttons ----- */


    /* ----- auto-show functions >>>> ----- */

    function stopAutoShow() {
        clearInterval(autoShowInterval);
        if( $("#"+root+" .showcontrols .playpause a").hasClass("paused") == false ) {
            $("#"+root+" .showcontrols .playpause a").text("Play Slideshow");
        }
        $("#"+root+" .showcontrols .playpause a").addClass("paused");
    }
    function startAutoShow() {
        autoShowInterval = setInterval(function() { autoShow("next") }, seconds*1000);
        $("#"+root+" .showcontrols .playpause a").removeClass("paused");
        $("#"+root+" .showcontrols .playpause a").text("Pause Slideshow");
    }
    /* ----- <<<< auto-show functions ----- */
}
// END initSlideshow




function initSelector(selectorIndex) {

    /* ----- procedural setup >>>> ----- */
    var root = selectorIndex;
    var showCount = $("#"+root+" .shows li").size();
    var currentShow = $("#"+root).attr("class");

    // get the height of the wrapper window
    var wrapperHeight = $("#"+root+" .showswrapper").height();
    // get the height of an individual item
    var showHeight = $("#"+root+" .shows li:first").height() + 1;
    // figure out how many items fit in the window
    var showsPerPage = Math.floor(wrapperHeight / showHeight);
    var pagesOfShows = Math.ceil(showCount / showsPerPage);
    // set the height of the list of shows
    var showsHeight = wrapperHeight * pagesOfShows;
    $("#"+root+" .shows").css("height",showsHeight+"px");

    // set the page to that of the current show
    var startShow = $("#"+root).attr("class");
    var startPage = Math.floor(
        ( $("#"+root+" .shows li").index( $("#"+root+" .shows li."+startShow) ) ) / showsPerPage
    );
    $("#"+root+" .shows").css({ top: "-"+(startPage * wrapperHeight)+"px" });
    manuSlide(startPage);
    var currentIndex = startPage;
    
    // set the thumbnail of the current show
    $("#"+root+" .shows li."+startShow).addClass("select");

    /* ----- <<<< procedural setup ----- */

    /* ----- general functions >>>> ----- */

    // manual click on a particular horse
    function manuSlide(page) {
		oldIndex = currentIndex;
		currentIndex = page;
        slideShowsList(currentIndex);
        $("#"+root+" .controls .index").eq(oldIndex).removeClass("select");
        $("#"+root+" .controls .index").eq(currentIndex).addClass("select");
	}

    // automatically move from one horse to another
    function autoSlide(direction) {
        oldIndex = currentIndex;
  
        // move forward
        if( direction == "next" ) {
            currentIndex = (oldIndex + 1) % pagesOfShows;
        }
  
        // move backward
        else if( direction == "prev" ) {
      
            // if the departing horse is not the first one
            if( oldIndex > 0 ) {
                currentIndex = (oldIndex - 1) % pagesOfShows;
            }
      
            // if the departing horse is the first one
            else if( oldIndex == 0 ) {
                currentIndex = pagesOfShows - 1;
            }
        }
  
        slideShowsList(currentIndex);
        $("#"+root+" .controls .index").eq(oldIndex).removeClass("select");
        $("#"+root+" .controls .index").eq(currentIndex).addClass("select");
    }


    // slide the carousel
    function slideShowsList(slideTo) {
        $("#"+root+" .shows").animate({ top: "-"+(slideTo * wrapperHeight)+"px" }, 500 );
    }

    // set wrapper classes
    function setHorse(leaving,coming) {
        jQuery("#"+root).removeClass(leaving);
        jQuery("#"+root).addClass(coming);
    }

    /* ----- <<<< general functions ----- */


    /* ----- interactive buttons >>>> ----- */

    // click on the down button
    jQuery("#"+root+" .controls .down a").click(function() {
        autoSlide("next");
    });

    // click on the up button
    jQuery("#"+root+" .controls .up a").click(function() {
        autoSlide("prev");
    });

    // click on an index button
    jQuery("#"+root+" .controls .index").click(function() {
        var thisPage = $("#"+root+" .controls .index").index(this);
        manuSlide(thisPage);
    });

    /* ----- <<<< interactive buttons ----- */
}
// END initSelector

