﻿"use strict";
var SlideShow = {

    navButtonImage: '',         // The default nav button image
    navButtonImageSelected: '', // The 'selected' nav button image
    navContainer: '',           // The parent element for the nav buttons
    navButtons: '',             // The collection of nav buttons
    slides: '',                 // The collection of slide show images

    initialize: function (navBtnImgOffSrc, navBtnImgOnSrc, navContainerID, slideContainerId) {
        if (!navBtnImgOffSrc || !navBtnImgOnSrc || !navContainerID || !slideContainerId) {
            document.alert("One or more slideshow parameters has not been provided. Slideshow initialization terminated.");
            return;
        }
        this.navButtonImage = navBtnImgOffSrc;
        this.navButtonImageSelected = navBtnImgOnSrc;
        this.navContainer = $("#" + navContainerID);
        this.slides = $("#" + slideContainerId).children("img");
        this.createNavigation();
        $(this.navButtons[0]).trigger("click");
    },

    createNavigation: function () {
        for (var i = 0; i <= this.slides.length - 1; i += 1) {
            $('<img src="' + this.navButtonImage + '" alt="Show image" title="Show image" />').appendTo(this.navContainer);
        }
        this.navButtons = this.navContainer.children("img");
        this.navButtons.click(function () {
            var index = $(SlideShow.navButtons).index(this);
            $(SlideShow.navButtons).attr("src", SlideShow.navButtonImage);
            $(this).attr("src", SlideShow.navButtonImageSelected);
            SlideShow.swapImage(index);
        });
    },

    swapImage: function (imgIndex) {
        $(this.slides).css("display", "none");
        $(this.slides.get(imgIndex)).css("display", "inline");
    }

};

$(document).ready(function () {

    SlideShow.initialize("/images/slideShowButton.gif",          // The default nav button image path

                         "/images/slideShowButton_selected.gif", // The 'selected' nav button image path

                         "slideShowNavigation",                 // The ID of the parent element for the nav buttons

                         "slideShowScreen");                    // The ID of the parent element for the slide images 

});


