/// <reference name="MicrosoftAjax.js"/>

Type.registerNamespace("SPIPhotoClub");

SPIPhotoClub.SlideShowBehavior = function(element) {
    SPIPhotoClub.SlideShowBehavior.initializeBase(this, [element]);
    
    // Behavior Properties
    this._previousButtonID = null;                  // ID of previous button
    this._nextButtonID = null;                      // ID of next button
    this._playButtonID = null;                      // ID of the play button
    this._captionLabel1ID = null;                   // ID of the first caption label
    this._imgContainer1ID = null;                   // ID of the first image container
    this._captionLabel2ID = null;                   // ID of the second caption label
    this._imgContainer2ID = null;                   // ID of the second image container
    this._image2ID = null;                          // ID of the second image element
    this._autoPlay = false;                         // If show should be played automatically
    this._autoRepeat = false;                       // true if show repeats
    this._timerInterval = 0;                        // time in milliseconds between slide changes
    this._galleryID = null;                         // gallery id to display
    this._competitionID = null;                     // competition to run as slide show, ignored if _galleryID set
    this._placedOnlyResults = true;                 // Display only placed images, if _competitionID set
    this._playButtonValue = "Play";                 // button text when show is stopped
    this._stopButtonValue = "Stop";                 // button text when show is playing
    this._imageSizeToDisplay = 0;                   // size of image to display
    this._displayAuthor = true;                     // if Author's name should be displayed
    this._displayAuthorImageId = false;             // if Author's image id should be displayed
    this._displayImageNotes = false;                // if image notes should be displayed
    this._displayTitle = false;                     // if title should be displayed
    this._displayCompetitionInfo = false;           // if image's competition information should be displayed
    this._randomStart = false;                      // true if starting slide should be randomized
    this._slides = null;                            // array of slides to display
    
    // Variables
    this._timer = null;                             // timer reference
    this._visibleImageElemnt = null;                // reference to the visible image
    this._visibleCaptionElement = null;             // reference to visible caption element
    this._visibleImgContainer = null;               // reference to the visible image container
    
    this._hiddenImageElement = null;                // reference to the hidden image
    this._hiddenCaptionElement = null;              // reference to caption in hidden element
    this._hiddenImgContainer = null;                // reference to the hidden image container
    
    this._bNext = null;                             // next button element
    this._bPrevious = null;                         // previous button element
    this._bPlay = null;                             // play button element
    
    this._currentIndex = 0;                         // index of current slide
    this._isPlaying = false;                        // true if show is playing, false if stopped
    
    this._captionElement1 = null;                   // caption element for first image
    this._imgContainerElement1 = null;              // element containing first image/caption
    
    this._captionElement2 = null;                   // caption element for second image
    this._imgContainerElement2 = null;              // element containing second image/caption
    this._image1Element = null;                     // first image element (this is target ID element)
    this._image2Element = null;                     // second image element
    
    this._offsetTopContainer1 = null;
    this._offsetLeftContainer1 = null;
    
    // Delegates
    this._clickNextHandler = null;                  // handler for click of next button
    this._clickPreviousHandler = null;              // handler for click of previous button
    this._clickPlayHandler = null;                  // handler for click of play button
    this._tickHandler = null;
    this._imageLoadedHandler = null;               // handler for image loaded event
}

SPIPhotoClub.SlideShowBehavior.prototype = {
    initialize: function() {
        SPIPhotoClub.SlideShowBehavior.callBaseMethod(this, 'initialize');
        
        // Create handlers for slide show buttons clicks events and for image loaded events.
        if (this._nextButtonID) {           // if next button id passed
            this._bNext = document.getElementById(this._nextButtonID);          // Get the next button element 
            
            if (this._bNext) {
                this._clickNextHandler = Function.createDelegate(this, this._onClickNext);
                $addHandler(this._bNext, 'click', this._clickNextHandler);
            }
        }
        
        if (this._previousButtonID) {       // if previous button id passed
            this._bPrevious = document.getElementById(this._previousButtonID); // Get the previous button element
            
            if (this._bPrevious) {
                this._clickPreviousHandler = Function.createDelegate(this, this._onClickPrevious);
                $addHandler(this._bPrevious, 'click', this._clickPreviousHandler);
            } 
        }
        
        if (this._playButtonID) {           // if play button id passed
            this._bPlay = document.getElementById(this._playButtonID);      // Get the play button element
            
            if (this._bPlay) {
                this._clickPlayHandler = Function.createDelegate(this, this._onClickPlay);
                $addHandler(this._bPlay, 'click', this._clickPlayHandler);
            } 
        }
        
        this._image1Element = this.get_element();               // Set first hiddenSlide to target element
        this._hiddenImageElement = this._image1Element;         // This will be first element to load
        
        this._imageLoadedHandler = Function.createDelegate(this, this._onImageLoaded);
        $addHandler(this._image1Element, 'load', this._imageLoadedHandler);
        
        if (this._image2ID) {       // if second image id passed
            this._image2Element = document.getElementById(this._image2ID);      // set second image element
            
            if (this._image2Element) {      // if element returned
                $addHandler(this._image2Element, 'load', this._imageLoadedHandler);
            }
        }
        
        if (this._captionLabel1ID) {           // if id of caption label passed
            this._captionElement1 = document.getElementById(this._captionLabel1ID);       // set caption element
        }
        
        this._hiddenCaptionElement = this._captionElement1;     // set for first element to load
        
        if (this._captionLabel2ID) {           // if id of caption label passed
            this._captionElement2 = document.getElementById(this._captionLabel2ID);       // set caption element
        }
        
        if (this._imgContainer1ID) {
            this._imgContainerElement1 = document.getElementById(this._imgContainer1ID);
        }
        
        this._hiddenImgContainer = this._imgContainerElement1;      // this is first element loaded
        
        if (this._imgContainer2ID) {
            this._imgContainerElement2 = document.getElementById(this._imgContainer2ID);
            
          //  Element.setStyle(this._imgContainerElement2, {position:'absolute',top:'55px',left:'0px'});
        }
        
        if (this._image2ID) {
            this._image2Element = document.getElementById(this._image2ID);
        }
        
        // Get the slides for this show
//        var service = new PhotoClubServices();                // get service
//        
//        if (this._galleryID) {      // if gallery passed
//            service.GetSlides(this._galleryID, false, false, Function.createDelegate(this, this._slidesReturned), null, null);
//        }
//        else if (this._competitionID) {
//            service.GetSlides(this._competitionID, true, this._placedOnlyResults, Function.createDelegate(this, this._slidesReturned), null, null);
//        }
        this.initSlides();                 // set up slides
    },
    dispose: function() {        
        
        // Get rid of active handlers
        if (this._clickNextHandler) {
            $removeHandler(this._bNext, 'click', this._clickNextHandler);
            this._clickNextHandler = null;
        }
        if (this._clickPreviousHandler) {
            $removeHandler(this._bPrevious, 'click', this._clickPreviousHandler);
            this._clickPreviousHandler = null;
        }
        if (this._clickPlayHandler) {
            $removeHandler(this._bPlay, 'click', this._clickPlayHandler);
            this._clickPlayHandler = null;
        }     
        if (this._imageLoadedHandler) {
            $removeHandler(this._image1Element, 'load', this._imageLoadedHandler);
            
            if (this._image2Element) {
                 $removeHandler(this._image2Element, 'load', this._imageLoadedHandler);
            }
            this._imageLoadedHandler = null;
        }
        
        SPIPhotoClub.SlideShowBehavior.callBaseMethod(this, 'dispose');
    },
    
    // properties
    get_previousButtonID : function() {
        return this._previousButtonID;
    },
    
    set_previousButtonID : function(value) {
        if (this._previousButtonID != value) {
            this._previousButtonID = value;                     //Set new value
            this.raisePropertyChanged('previousButtonID');      // raise change event
        }
    },
    
    get_nextButtonID : function() {
        return this._nextButtonID;
    },
    
    set_nextButtonID : function(value) {
        if (this._nextButtonID != value) {
            this._nextButtonID = value;                     //Set new value
            this.raisePropertyChanged('nextButtonID');      // raise change event
        }
    },
    
    get_playButtonID : function() {
        return this._playButtonID;
    },
    
    set_playButtonID : function(value) {
        if (this._playButtonID != value) {
            this._playButtonID = value;                     //Set new value
            this.raisePropertyChanged('playButtonID');      // raise change event
        }
    },
    
    get_captionLabel1ID : function() {
        return this._captionLabel1ID;
    },
    
    set_captionLabel1ID : function(value) {
        if (this._captionLabel1ID != value) {
            this._captionLabel1ID = value;                     //Set new value
            this.raisePropertyChanged('captionLabel1ID');      // raise change event
        }
    },
    
    get_captionLabel2ID : function() {
        return this._captionLabel2ID;
    },
    
    set_captionLabel2ID : function(value) {
        if (this._captionLabel2ID != value) {
            this._captionLabel2ID = value;                     //Set new value
            this.raisePropertyChanged('captionLabel2ID');      // raise change event
        }
    },
    
    get_autoPlay : function() {
        return this._autoPlay;
    },
    
    set_autoPlay : function(value) {
        if (this._autoPlay != value) {
            this._autoPlay = value;                     //Set new value
            this.raisePropertyChanged('autoPlay');      // raise change event
        }
    },
    
    get_autoRepeat : function() {
        return this._autoRepeat;
    },
    
    set_autoRepeat : function(value) {
        if (this._autoRepeat != value) {
            this._autoRepeat = value;                     //Set new value
            this.raisePropertyChanged('autoRepeat');      // raise change event
        }
    },
    
    get_timerInterval : function() {
        return this._timerInterval;
    },
    
    set_timerInterval : function(value) {
        if (this._timerInterval != value) {
            this._timerInterval = value;                     //Set new value
            this.raisePropertyChanged('timerInterval');      // raise change event
        }
    },
    
    get_galleryID : function() {
        return this._galleryID;
    },
    
    set_galleryID : function(value) {
        if (this._galleryID != value) {
            this._galleryID = value;                     //Set new value
            this.raisePropertyChanged('galleryID');      // raise change event
        }
    },
    
    get_competitionID : function() {
        return this._competitionID;
    },
    
    set_competitionID : function(value) {
        if (this._competitionID != value) {
            this._competitionID = value;                     //Set new value
            this.raisePropertyChanged('competitionID');      // raise change event
        }
    },
    
     get_placedOnlyResults : function() {
        return this._placedOnlyResults;
    },
    
    set_placedOnlyResults : function(value) {
        if (this._placedOnlyResults != value) {
            this._placedOnlyResults = value;                     //Set new value
            this.raisePropertyChanged('placedOnlyResults');      // raise change event
        }
    },
    
    get_playButtonValue : function() {
        return this._playButtonValue;
    },
    
    set_playButtonValue : function(value) {
        if (this._playButtonValue != value) {
            this._playButtonValue = value;                     //Set new value
            this.raisePropertyChanged('playButtonValue');      // raise change event
        }
    },
    
    get_stopButtonValue : function() {
        return this._stopButtonValue;
    },
    
    set_stopButtonValue : function(value) {
        if (this._stopButtonValue != value) {
            this._stopButtonValue = value;                     //Set new value
            this.raisePropertyChanged('stopButtonValue');      // raise change event
        }
    },
    
    get_imageSizeToDisplay : function() {
        return this._imageSizeToDisplay;
    },
    
    set_imageSizeToDisplay : function(value) {
        if (this._imageSizeToDisplay != value) {
            this._imageSizeToDisplay = value;                     //Set new value
            this.raisePropertyChanged('imageSizeToDisplay');      // raise change event
        }
    },
    
    get_displayAuthor : function() {
        return this._displayAuthor;
    },
    
    set_displayAuthor : function(value) {
        if (this._displayAuthor != value) {
            this._displayAuthor = value;                     //Set new value
            this.raisePropertyChanged('displayAuthor');      // raise change event
        }
    },
    
    get_displayAuthorImageId : function() {
        return this._displayAuthorImageId;
    },
    
    set_displayAuthorImageId : function(value) {
        if (this._displayAuthorImageId != value) {
            this._displayAuthorImageId = value;                     //Set new value
            this.raisePropertyChanged('displayAuthorImageId');      // raise change event
        }
    },
    
    get_displayImageNotes : function() {
        return this._displayImageNotes;
    },
    
    set_displayImageNotes : function(value) {
        if (this._displayImageNotes != value) {
            this._displayImageNotes = value;                     //Set new value
            this.raisePropertyChanged('displayImageNotes');      // raise change event
        }
    },
    
    get_displayTitle : function() {
        return this._displayTitle;
    },
    
    set_displayTitle : function(value) {
        if (this._displayTitle != value) {
            this._displayTitle = value;                     //Set new value
            this.raisePropertyChanged('displayTitle');      // raise change event
        }
    },
    
    get_displayCompetitionInfo : function() {
        return this._displayCompetitionInfo;
    },
    
    set_displayCompetitionInfo : function(value) {
        if (this._displayCompetitionInfo != value) {
            this._displayCompetitionInfo = value;                     //Set new value
            this.raisePropertyChanged('displayCompetitionInfo');      // raise change event
        }
    },
    
    get_randomStart : function() {
        return this._randomStart;
    },
    
    set_randomStart : function(value) {
        if (this._randomStart != value) {
            this._randomStart = value;                     //Set new value
            this.raisePropertyChanged('randomStart');      // raise change event
        }
    },
    
    get_imgContainer1ID : function() {
        return this._imgContainer1ID;
    },
    
    set_imgContainer1ID : function(value) {
        if (this._imgContainer1ID != value) {
            this._imgContainer1ID = value;                     //Set new value
            this.raisePropertyChanged('imgContainer1ID');      // raise change event
        }
    },
    
    get_imgContainer2ID : function() {
        return this._imgContainer2ID;
    },
    
    set_imgContainer2ID : function(value) {
        if (this._imgContainer2ID != value) {
            this._imgContainer2ID = value;                     //Set new value
            this.raisePropertyChanged('imgContainer2ID');      // raise change event
        }
    },
    
    get_image2ID : function() {
        return this._image2ID;
    },
    
    set_image2ID : function(value) {
        if (this._image2ID != value) {
            this._image2ID = value;                      //Set new value
            this.raisePropertyChanged('image2ID');       // raise change event
        }
    },
    
    get_slides : function() {
        return this._slides;
    },
    
    set_slides : function(value) {
        if (this._slides != value) {
            this._slides = value;                      //Set new value
            this.raisePropertyChanged('slides');      // raise change event
        }
    },
    
    // event handlers
    _onClickNext : function(e) {            // Handle click event for Next button
        e.preventDefault();
        e.stopPropagation();                // prevent postback
        
        this._clickNext();                  // setup for next slide
    },
    
    _onClickPrevious : function(e) {        // Handle click event for Previous button
        e.preventDefault();
        e.stopPropagation();                // prevent postback
        
        this._clickPrevious();              // Set up for previous slide
    },
    
    _onClickPlay : function(e) {            // Handle click event for Play button
        e.preventDefault();
        e.stopPropagation();                // prevent postback
 
        this.playSlideShow();               // start or stop the slide show
    },
    
    _onImageLoaded : function(e) {         // Handle load event for hidden image
        
        if (this._hiddenImgContainer) {
        
            if (!this._visibleImgContainer) {           // if no visible container, this is first time
                Effect.Appear(this._hiddenImgContainer);   // fade in the hidden container
                
              //  Element.absolutize(this._hiddenImgContainer);   // force to absolute positioning
                
                var offset = Element.positionedOffset(this._hiddenImgContainer);
            
                this._visibleImgContainer = this._hiddenImgContainer;      // set as visible continer
                this._visibleImageElement = this._hiddenImageElement;
                this._visibleCaptionElement = this._hiddenCaptionElement;
                
                this._hiddenImgContainer = this._imgContainerElement2;  //set second container to hidden
                this._hiddenImageElement = this._image2Element;
                this._hiddenCaptionElement = this._captionElement2;
            }
            else {
                // If we position ourselves only once, we do not respond to resizing
                // of the browser window. If we omit the "Left" position and initialize
                // only once, it works on IE8 in native move but not compatibility mode.
                var offset = Element.positionedOffset(this._visibleImgContainer);
                this._offsetTopContainer1 = offset.top;
                this._offsetLefContainer1 = offset.left;
                var width = Element.getWidth(this._visibleImgContainer);

                Element.setStyle(this._imgContainerElement2, {position:'absolute',top:offset.top + 'px',left:offset.left + 'px',width:width+'px'});
                
                var tempContainerSave = this._hiddenImgContainer;    // save for switch
                var tempImageSave = this._hiddenImageElement;        // save element for switch
                var tempCaptionSave = this._hiddenCaptionElement;
                
                new Effect.Parallel([new  Effect.Appear(this._hiddenImgContainer, {duration: 1.5}),
                                     new Effect.Fade(this._visibleImgContainer, {duration: 1.5})]);      // cross fade
//                               
//                Effect.Appear(this._hiddenImgContainer, {duration: 1.0});
//                Effect.Fade(this._visibleImgContainer, {duration: 1.0});
                this._hiddenImgContainer = this._visibleImgContainer;           // set as hidden
                this._hiddenImageElement = this._visibleImageElement;      
                this._hiddenCaptionElement = this._visibleCaptionElement;     
                
                this._visibleImgContainer = tempContainerSave;      // set as visible  
                this._visibleImageElement = tempImageSave; 
                this._visibleCaptionElement = tempCaptionSave;
            }
        }
        
        this.setButtonState();                // reset buttons based on new index
    },
    
   // _slidesReturned : function(returnedSlides, eventArgs){     // Called when service returns the slides to display
    initSlides : function() {           //initalize slides for show
      //  this._slides = returnedSlides;              // Save returned slides
       
        if (this._slides) {           // if slides to display
            this._currentIndex = -1;                // set for first time
        
            if (this._randomStart) {                // if starting index should be randomized
                var stIndex = Math.floor(Math.random()*(this._slides.length-1));  // random starting index
                
                if (this._slides[stIndex].ImageSequenceNumber > 1) {   // only start on first image of a sequence
                    stIndex = (stIndex - this._slides[stIndex].ImageSequenceNumber) + 1;       // this should be starting image
                }
                
                this._currentIndex = stIndex - 1;   // set starting index for first time
            }
           
            this._clickNext();                      // process next click
            if (this._autoPlay) {                   // if show it to be started automatically
                this.playSlideShow();               // start the slide show
            }
        }
    },
    
    _clickNext : function() {           // switch to next slide to display
    
        if (this._slides) {             // if slides to display
            if ((this._currentIndex + 1) < this._slides.length) {
                ++this._currentIndex;
            } else if (this._autoRepeat) {
                this._currentIndex = 0;
            } else {
                return false;
            }
            this.setCurrentImage();
            return true;
        }
        
        return  false;
    },
    
    _clickPrevious : function() {       // set up to display the previous slide
        if (this._slides) {
            if ((this._currentIndex - 1) >= 0) {
                --this._currentIndex;
            }
            else if (this._autoRepeat) {
                this._currentIndex = this._slides.length - 1;
            } else {
                return false;
            }
            this.setCurrentImage();
            return true;
        }
        return false;
    },
    
    setCurrentImage : function() {      // load the current image
        if (this._slides) {
            this.setCaptionText(this._hiddenCaptionElement);   // set caption text

            this._hiddenImageElement.src = "SPIImageFiles.ashx?ImageSize=" + this._imageSizeToDisplay 
                                         + "&imageid=" + this._slides[this._currentIndex].ImageID;
        } else {
            this._hiddenImageElement.src = '';
        }
       // if(Sys.Browser.agent == Sys.Browser.Opera) {   
            // call the handler explicitly for opera
     //       this._onImageLoaded(true);
      //  }       
    },
   
    startTimer : function() {          // called to set/start the timer
        this._timer = window.setInterval(Function.createDelegate(this, this._timerCallback), this._timerInterval);
    },
    
    stopTimer : function() {          // callsed to stop the timer
        window.clearInterval(this._timer);      //stop the timer
        this._timer = null;
    },
    
    _timerCallback : function() {       //timer callback
        this._clickNext();              // go to next slide
    },
    
    setButtonState : function() {       // update button state
        if (!this._autoRepeat) {        // if slide show does not auto repeat
            // at the last slide
            if (this._slides.length <= this._currentIndex + 1 ) {
                if (this._bNext) this._bNext.disabled = true;
                if (this._bPlay) this._bPlay.disabled = true;
                if (this._bPrevious) this._bPrevious.disabled = false;    
               // turn off play mode if on
                this._isPlaying = false;
                if (this._timer) {
                    this.stopTimer();       // turn off timer
                }
                if (this._bPlay) {
                    this._bPlay.value = this._playButtonValue; 
                }
                                
            } else {
                if (this._bNext) this._bNext.disabled = false;
                if (this._bPlay) this._bPlay.disabled = false;            
            }
            // at the first slide
            if (this._currentIndex <= 0) {
                if (this._bPrevious) this._bPrevious.disabled = true;
            } else {
                if (this._bPrevious) this._bPrevious.disabled = false;
            }
        }
        else {                      // slide show auto repeats
            if ((!this._slides)
                || (this._slides.length == 0)) {         // disable buttons if no slides
                if (this._bPrevious) this._bPrevious.disabled = true;
                if (this._bNext) this._bNext.disabled = true;
                if (this._bPlay) this._bPlay.disabled = true;
            }
            else {
                if (this._bPrevious) this._bPrevious.disabled = false;
                if (this._bNext) this._bNext.disabled = false;
                if (this._bPlay) this._bPlay.disabled = false;
            }
        } 
        if (this._isPlaying) {
            // restart timer
            this.stopTimer();      // stop timer
            this.startTimer();     // start timer        
        }
    },
    
    resetPlayButtonState : function() {     // reset state of the play button
        if (this._isPlaying) {              // if show is now playing
            if (this._bPlay) {
                this._bPlay.value = this._stopButtonValue;     // Change to be stop button
            }
        }
        else {
            this.setButtonState();            // reset state of all other buttons
            if (this._bPlay) {
                this._bPlay.value = this._playButtonValue;     // Change button to play button
            }
        }
    },
    
    playSlideShow : function() {          // start or stop the slide show
        if (this._isPlaying) {                  // If slide show is playing, this is request to stop
            this.stopTimer();                   // stop the timer
            this._isPlaying = false;            // no longer playing
            this.resetPlayButtonState();        // reset button state
        } else {
            // play the side show
            this._isPlaying = true;             // slide show is now playing
            this.resetPlayButtonState();
            this.startTimer();                  // start the timer
        }
    },
    
    setCaptionText : function(captionElement) {       // set caption text for the current slide
    
        if (captionElement) {         // if we have the caption element
        
            captionElement.innerHTML = "";        // clear existing value
        
            if (this._slides) {     // if we have a slide
                var theSlide = this._slides[this._currentIndex];        // Make it easier to reference
                
                // display competiton information first
                if (this._displayCompetitionInfo) {     // if competition information should be displayed
                    
                    // dislay place of image
                    if((theSlide.Place > 0 && theSlide.Place < 120)
                       || theSlide.BestInShow
                       || theSlide.WildLifeWinner) {
                       
                        captionElement.innerHTML += "<strong>"     // make it bold
                       
                        if (theSlide.Place < 120) {      // if place provided
                             captionElement.innerHTML += theSlide.PlaceName;       // Set place name
                             
                             if (theSlide.BestInShow) {
                                captionElement.innerHTML += ", Best in Show";         // best in show
                             }  
                             
                             if (theSlide.WildLifeWinner) {
                                captionElement.innerHTML += ", Wildlife Winner"; 
                             }
                        }
                        else if (theSlide.BestInShow) {
                            captionElement.innerHTML += "Best in Show";         // best in show
                            
                            if (theSlide.WildLifeWinner) {
                                captionElement.innerHTML += ", Wildlife Winner"; 
                             }
                        }  
                        else if (theSlide.WildLifeWinner) {
                            captionElement.innerHTML += ", Wildlife Winner"; 
                        }
                        
                        captionElement.innerHTML += "</strong>"     // make it bold 
                    }
                    
                    // add competition type/level
                    if (theSlide.CompetitionTypeName || theSlide.CompetitionLevelName) {
                        if (captionElement.innerHTML != "") {
                            captionElement.innerHTML += "<br />";      // add new line
                        }
                        
                        if (theSlide.CompetitionTypeName) {
                            captionElement.innerHTML += theSlide.CompetitionTypeName;     // add compition type
                            
                            if (theSlide.CompetitionLevelName) {
                                captionElement.innerHTML += " - " + theSlide.CompetitionLevelName; 
                            }
                        }
                        else            // only of level name
                        {
                            captionElement.innerHTML += " - " + theSlide.CompetitionLevelName; 
                        }
                    }
                }
                
                // next display the image title, if desired
                if (this._displayTitle) {       // if image title should be displayed
                    if (theSlide.Title) {                // if image title present
                        if (captionElement.innerHTML != "") {
                            captionElement.innerHTML += "<br />";      // add new line
                        }
                        
                        var seqText = (theSlide.SequenceNumberOfImages>1) 
                                      ? String.format(" [{0} of {1}]", theSlide.ImageSequenceNumber, theSlide.SequenceNumberOfImages)  : "";
                        captionElement.innerHTML += "<i>" 
                                                 + theSlide.Title 
                                                 + seqText
                                                 + "</i>";     // Add title to caption
                    }
                }
                
                // author image id is next
                if (this._displayAuthorImageId) {
                    if (theSlide.AuthorImageId) {        // if Author image id present
                        if (captionElement.innerHTML != "") {
                            captionElement.innerHTML += "<br />";      // add new line
                        }
                        
                        captionElement.innerHTML += theSlide.AuthorImageId;        // add author image id
                    }
                }
                
                // author name is next
                if (this._displayAuthor) {
                    if (theSlide.AuthorName) {        // if Author image id present
                        if (captionElement.innerHTML != "") {
                            captionElement.innerHTML += "<br />";      // add new line
                        }
                        
                        captionElement.innerHTML += theSlide.AuthorName;     // add author name
                    }
                }
                
                // image notes are last
                if (this._displayImageNotes) {
                    if (theSlide.GalleryNotes) {
                        if (captionElement.innerHTML != "") {
                            captionElement.innerHTML += "<br />";      // add new line
                        }
                        
                        captionElement.innerHTML += theSlide.GalleryNotes;  // add notes
                    }
                }  
            }
        }
    }
}
SPIPhotoClub.SlideShowBehavior.registerClass('SPIPhotoClub.SlideShowBehavior', Sys.UI.Behavior);

if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();