﻿// Global Variables
var totalImages;                        // count of all images
var imageWidth = 460;                   // must change for diff. sized images, NOTE, all corresponding CSS values must manually be changed to match this value
var imgIndex = 1;                       // index location of currently displayed image
var indexDelta = 0;                     // change between currently displayed image and currently selected image
var OnLoadBehavior;                     // behavior object by which to control auto animation
var firstView = true;                   // true for very first slide, first time only, used to set delay on first animation
var firstAnimation;                     // first image animation, used to set delay for first view
var repeatRotatorAnimation = true;      // false when mouse is not over rotator, true when it is
var currentMoviePicIndex = 1;           // keeps track of currently selected thumbnail
var rotatorTitle = "titlePlaceholder";  // placeholder for slideshow title.  NOTE: this matches corresponding span id
var rotatorText = "textPlaceholder";    // placeholder for slideshow text   NOTE: this matches corresponding span id
var msSummaries = "ms_items_text";      // span containing all labels and text, NOTE: this matches span created by XSLT
var rotatorTitlePH;                     // handle to title placeholder span
var rotatorTextPH;                      // handle to text placeholder span
var rotatorSummaryInfo;                 // handle to span containing all labels for titles and text
var initialized = false;                // for slow connections, make sure initialized has completed before allowing animation to complete
var isMouseOverRotator = false;         // keep of track of onMouseOver in case mouse was placed over rotator during an animation
var navLinkUL = 'navigationLinks';      // NOTE: this matches UL tag containing navigation links for the movie scroller
var navLinksCollection = new Array;     // colleciont of navigation links for the movie scroller (0-9), used to set CSS of selected link/current image dynamically
var linksDisabled = false;              // toggle used to determine whether a mouse over/out should pause the rotator animation
                                        // if an animation is already playing, ignore the mouse over animation event


// Get the page setup for scrolling through the images
function initialize() {
	if(initialized) return;
    var images = $get('ms_items');
    if (images == null) return;
    
    // Determine how many images were provided
    images.imageCount = 0;
    for (var i = 0; i < images.children.length; i++) {
        var child = images.children[i];
        
        if (child.tagName && child.tagName.toLowerCase() == 'img'){
            images.imageCount++;
        }
    }
    // set global image variable
    totalImages = images.imageCount; 

    images.style.width = (images.imageCount * imageWidth) + 'px';
    images.style.left = '0px';
    
    images.visibleIndex = 0;
    
    // get and save references to title and text placeholders, containing span element
    rotatorTitlePH = $get(rotatorTitle);
    rotatorTextPH = $get(rotatorText);
    msSummaries = $get('ms_items_text');
    
    // set movie scroller summary (title and text info)
    replaceRotatorText();
    
    // get and save reference to navigation links
    var navUL = $get(navLinkUL);
    var x = 0; // keep track of current location in the array
    
    for (var i = 0; i < navUL.children.length; i++) {
        var child = navUL.children[i];
        
        if (child.tagName && child.tagName.toLowerCase() == 'li' && undefined != child.children[0]) {
            
             if (undefined != child.children[0].id) {
                    navLinksCollection[x] = child.children[0].id;
                    x++;
               }
        }        
    }
    
    // set first link to 'selected
    setActiveCss(true,1);
    
    // finished initializing - it is now safe to run animation completely
    initialized = true;
}

// slideshow animation specific functions

function setMoveOffset(increment, imgNumber) {
    // call before current image number is updated with false value to 'deselect' link
    setActiveCss(false, imgIndex);
    // set the current css class of the link for the active image

    // check for special condition when user wants to advance beyond the list of images in either direction
   if ((imgIndex == totalImages && increment == 1) || (imgIndex == 1 && increment == -1)) {
        indexDelta = (increment == 1) ? 1 - totalImages : totalImages - 1;
        increment = (increment == -1) ? totalImages - 1 : 1 - totalImages;
    }
    else {
        // go to a specific image number if imgNumber != 0, need to calculate delta
        if (imgNumber > 0) {
            increment = imgNumber - imgIndex;
            indexDelta = increment;
        }
        else {
            // increment or decrement imgIndex to move forward or backward by one image
            indexDelta = increment;
        }
    }

    // to move 'forward', or have the appearance of moving forward, delta must be negative
    // if moving to the left, or backwards, increment is negative and must be reversed
    increment = increment * -1;
	
    // delta is either a positive or negative number indicating the number of images to move, multiply by width of image

    return imageWidth * increment;
}

function setOnLoadBehavior() {
    OnLoadBehavior = $find("autoRotate").get_OnLoadBehavior().get_animation();
}

function replayRotator() {
    if (firstView) {
        setOnLoadBehavior();
        OnLoadBehavior.add_ended(playRotator);
        firstView = false;
    }   
}

function playRotator() {
    if (repeatRotatorAnimation) {
        OnLoadBehavior.play();
    }    
}

function pauseRotator() {
    // mouse is over rotator
    isMouseOverRotator = true;

    // only pause rotator animation if it is not currently in the process of rotating to the next image
    if (!linksDisabled) {

        if (firstView) {
            // get handle to this animation, for first views only since OnLoadBehavior is undefined for first iteration
            setOnLoadBehavior();
            OnLoadBehavior.add_ended(playRotator);
        }
        OnLoadBehavior.pause();
        repeatRotatorAnimation = false;
    }  
}

function resumeRotator() {
    // reset isMouseOverRotator now that the mouse has left the div
    isMouseOverRotator = false;

    if (!linksDisabled) {
        repeatRotatorAnimation = true;
        // bug in ajax animation toolkit.  animation must be fully stopped before the play() call will start the animation.
        OnLoadBehavior.stop();
        OnLoadBehavior.play();
    }     
}

function resumeAutoRotate() {
    // in this case, it is safe to resume auto rotation
    isMouseOverRotator = false;
    repeatRotatorAnimation = true;
    // bug in ajax animation toolkit.  animation must be fully stopped before the play() call will start the animation.
    OnLoadBehavior.stop();
    OnLoadBehavior.play();    
}

// this function is needed to determine whether or not the mouse is positioned over the rotator in case it was placed during an animation
//      and a mouseover event was not fired before the next rotation animation starts
function checkMousePosition() {
    // if mouse is over the rotator OR the initialized method has not completed, cancel current animation
  
    //alert("imgIndex="+imgIndex+"  indexDelta="+indexDelta);
    if (!initialized) {
        // get reference to animation
        setOnLoadBehavior();
        OnLoadBehavior.add_ended(playRotator);
        
        // cancel animation
        OnLoadBehavior.pause();
        OnLoadBehavior.stop();
    }
    
    if (isMouseOverRotator) {
        OnLoadBehavior.pause();
        OnLoadBehavior.stop();
    }   
}

function updateImagePointer() {
    imgIndex += indexDelta;

    // 'select' current image
    setActiveCss(true, imgIndex);
}

function disableEnableLinks() {
    linksDisabled = (linksDisabled) ? false : true;
}

function setActiveCss(active, imgNum) {
    // set the current css class of the link for the active image
    
    // get reference to correct link
    var linkID = navLinksCollection[imgNum];
    var link = $get(linkID);
    
    if (undefined != link) {
        link.className = (active) ? 'selected' : '';
    }	
}

function replaceRotatorText() {
    // calculate the requested image number, subtract one to account for the zero-based index
    var imgNumber = (imgIndex + indexDelta) - 1;   
    /*alert("msSummaries:"+msSummaries + " \r" +
            "imgNumber:"+imgNumber +"\r"+            
            "msSummaries.children[imgNumber]:"+msSummaries.children[imgNumber] +"\r"+            
            "msSummaries.children[imgNumber].children[0].innerHTML:"+msSummaries.children[imgNumber].children[0].innerHTML +"\r"+
            "msSummaries.children[imgNumber].children[1].innerHTML:"+msSummaries.children[imgNumber].children[1].innerHTML +"\r");
            */
           
    var title = msSummaries.children[imgNumber].children[0].innerHTML;
    var text= msSummaries.children[imgNumber].children[1].innerHTML;
    
    // get value of corresponding images text, subtract one due to 0-based index
    if (undefined != title) {
        rotatorTitlePH.innerHTML = title;
    }
    if (undefined != text) {
        rotatorTextPH.innerHTML = text;
    }
}

// end slideshow animation specific functions 

