var activeIndex;
var scroll;
var scrollInstant;
var NumberOfSlides;
var Slides;
var minOpacityLevel = 0.25;
var slidePrefix = 'slide';

function GetSlideName(slideIndex) {
    return slidePrefix + slideIndex;
}

function SetDescriptionActive(slideIndex) {
    var slideDescriptionTextDiv = $('slideDescriptionText');
    if(slideDescriptionTextDiv != null) {
        slideContainsTextValue = SlideDescriptionText.length > 0;
    
        if(slideContainsTextValue) {
            var html = SlideDescriptionText[slideIndex];
            slideDescriptionTextDiv.innerHTML = html;            
        }
    }
}

var prevActiveIndex

function HighlightRelatedSidelink(slideIndex) {
    var sideLinks = $$('#leftNavLinks .indentSideLink');
    sideLinks.each(function(element) {
        element.className = 'indentSideLink';
    });
    
    //hack - so some code can be consolidated for generating the slider html
    //an element has an id in the format sidelinkkey<slide index numer> 
    //the class for that element contains the id field of the side link to highlight
    
    var sideLinkKeyElementId = 'sidelinkkey' + slideIndex;
    var sideLinkDivId = $(sideLinkKeyElementId).className;
    $(sideLinkDivId).className = 'indentSideLink selectedLinkSmall';
}

function HighlightSelectedSlide(slideIndex) {
    Slides.each(function(element) {
        element.className = 'slide';
    });
    
    var selecteSlideDivId = 'slide' + slideIndex;
    $(selecteSlideDivId).className = 'slide selectedSlide';
    
}

function SetSlideActive(slideIndex, scrollDirection) {
    SetDescriptionActive(slideIndex);
    activeIndex = slideIndex;
    
    HighlightSelectedSlide(slideIndex);
    HighlightRelatedSidelink(slideIndex);
            
    var activeSlideCaption = $(GetSlideName(slideIndex)+ "_image");
    activeSlideCaption.className = 'selectedImage';
    
    var activeSlideName = GetSlideName(activeIndex);
    if(scrollDirection == 'left' && (activeIndex > prevActiveIndex)) {
        scroll.toElement(activeSlideName);
    } else if (scrollDirection == 'right' && (activeIndex < prevActiveIndex)) {
        scroll.toElement(activeSlideName);
    } else if (scrollDirection == 'noscroll') {
        //do nothing
    } else {
        scroll.toElement(activeSlideName);
    }
}

function GetSlideIndexFromOffset(slideIndex, offset) {
    var newIndex = slideIndex + offset;
    if(newIndex < 0) {
        updatedIndex = NumberOfSlides - 1;
        return updatedIndex;
    } if(newIndex >= NumberOfSlides) {
        updatedIndex = 0;
        return updatedIndex;
    }
    return newIndex;    
}

function LoadFunction() {
    Slides = $$('.slide');
    NumberOfSlides = Slides.length;
    
    Slides.each(function(element) {
        element.addEvent('mouseenter', function(){
            SetElementActive(element);
        });
    });
    scroll = new Fx.Scroll('tableWrapper', {
    wait: false,
    fps: 100,
    duration: 700
    });
    
    scrollInstant = new Fx.Scroll('tableWrapper', {
    wait: false,
    duration: 10
    });
    
    SetSlideActive(0);

    $('leftArrow').addEvent('click', function(event) {
	    event = new Event(event).stop();
	    SetSlideActive(GetSlideIndexFromOffset(activeIndex, -1), 'left');
    });
    
    $('rightArrow').addEvent('click', function(event) {
	    event = new Event(event).stop();
	    SetSlideActive(GetSlideIndexFromOffset(activeIndex, 1), 'right');
    });
    
    AddGifImage('arrow_left_off');
    AddGifImage('arrow_left_on');
    AddGifImage('arrow_right_off');
    AddGifImage('arrow_right_on');
    
    AddVisualCues('leftArrow', 'arrow_left');
    AddVisualCues('rightArrow', 'arrow_right');
   
}

function AddVisualCues(arrowName, imageName) {
    $(arrowName).addEvent('mouseover', function(event) {
	    event = new Event(event).stop();
	    $(arrowName).className = 'arrowActive';
        SetImage(arrowName + 'Img', imageName + '_on');	    
    });
    
    $(arrowName).addEvent('mouseout', function(event) {
	    event = new Event(event).stop();
	    $(arrowName).className = 'arrowInactive';
	    SetImage(arrowName + 'Img', imageName + '_off');	    
    });
}
    
var elementToHighlightGlobal;
var highlightSpeed = 500;

function SetElementActive(elementToHighlight) {
    activeIndex = parseInt((elementToHighlight.id.substring(slidePrefix.length)));
    SetSlideActive(activeIndex, 'noscroll');
}