﻿// SlideShow.js
// Copyright (c) Nikhil Kothari, 2007
// http://www.nikhilk.net
//
// This product's copyrights are licensed under the Creative
// Commons Attribution-ShareAlike (version 2.5).B
// http://creativecommons.org/licenses/by-sa/2.5/
//
// You are free to:
// - copy, distribute, display, and perform the work 
// - make derivative works 
// Under the following conditions:
// Attribution. You must attribute the original work in your
//              product or release.
// Share Alike. If you alter, transform, or build upon this work,
//              you may distribute the resulting work only under
//              a license identical to this one.
//

Type.registerNamespace('nStuff.Samples.Photos');

nStuff.Samples.Photos.SlideShow = function(element) {
    nStuff.Samples.Photos.SlideShow.initializeBase(this, [element]);

    this._photos = [];
    this._photoIndex = -1;
    this._tag = null;

    this._slideShowElement = null;
    this._slideShowActivateAnimation = null;
    this._slideShowDeactivateAnimation = null;

    this._nextButton = null;
    this._prevButton = null;
    this._playButton = null;
    this._stopButton = null;

    this._photoImage1 = null;
    this._photoImage2 = null;
    this._photoTransition = null;
    this._titleLabel = null;
    this._audioTrack = null;

    this._timerID = 0;
}
nStuff.Samples.Photos.SlideShow.prototype = {

    get_photoIndex: function() {
        return this._photoIndex;
    },
    set_photoIndex: function(value) {
        var oldIndex = this._photoIndex;

        if (this._photos) {
            if (value >= this._photos.length) {
                value = this._photos.length - 1;
            }
            this._photoIndex = value;
            if (this._slideShowElement) {
                this._showPhoto(oldIndex, this._photoIndex, false);
            }
        }
    },

    get_photos: function() {
        return this._photos;
    },
    set_photos: function(value) {
        this._photos = value;
        this._photoIndex = 0;
        if (this._slideShowElement) {
            this._showPhoto(-1, 0, false);
        }
    },

    get_tag: function() {
        return this._tag;
    },
    set_tag: function(value) {
        this._tag = value;
    },

    add_photoChanged: function(handler) {
        this.get_events().addHandler('photoChanged', handler);
    },
    remove_photoChanged: function(handler) {
        this.get_events().removeHandler('photoChanged', handler);
    },

    dispose: function() {
        if (this._timerID) {
            window.clearInterval(this._timerID);
            this._timerID = 0;
        }

        this._slideShowElement = null;
        this._slideShowActivateAnimation = null;
        this._slideShowDeactivateAnimation = null;
        this._photo1 = null;
        this._photo2 = null;
        this._photoImage1 = null;
        this._photoImage2 = null;
        this._photoTransition = null;
        this._titleLabel = null;
        this._nextButton = null;
        this._prevButton = null;
        this._playButton = null;
        this._stopButton = null;

        nStuff.Samples.Photos.SlideShow.callBaseMethod(this, 'dispose');
    },

    initialize: function() {
        this.get_element().parentNode.style.width = '';
        this.get_element().parentNode.style.height = '';
        nStuff.Samples.Photos.SlideShow.callBaseMethod(this, 'initialize');
    },
    
    xamlInitialize: function() {
//        var rootElement = this.get_rootElement();
        var rootElement = this.get_element().content.root;
        this._slideShowElement = rootElement.findName('slideShow');
        this._slideShowActivateAnimation = rootElement.findName('slideShowActivate');
        this._slideShowDeactivateAnimation = rootElement.findName('slideShowDeactivate');

        this._photo1 = rootElement.findName('photo1');
        this._photo2 = rootElement.findName('photo2');
        this._photoImage1 = rootElement.findName('photoImage1');
        this._photoImage2 = rootElement.findName('photoImage2');
        this._photoTransition = rootElement.findName('photoTransition');
        this._titleLabel = rootElement.findName('titleLabel');

        this._nextButton = rootElement.findName('nextButton');
        this._prevButton = rootElement.findName('prevButton');

        this._slideShowElement.addEventListener('MouseEnter', Function.createDelegate(this, this._onSlideShowMouseEnter));
        this._slideShowElement.addEventListener('MouseLeave', Function.createDelegate(this, this._onSlideShowMouseLeave));
        this._nextButton.addEventListener('MouseLeftButtonDown', Function.createDelegate(this, this._onNextButtonClick));
        this._prevButton.addEventListener('MouseLeftButtonDown', Function.createDelegate(this, this._onPrevButtonClick));

        this._playButton = rootElement.findName('playButton');
        this._stopButton = rootElement.findName('stopButton');
        if (this._playButton && this._stopButton) {
            this._playButton.addEventListener('MouseLeftButtonDown', Function.createDelegate(this, this._onPlayButtonClick));
            this._stopButton.addEventListener('MouseLeftButtonDown', Function.createDelegate(this, this._onStopButtonClick));
            
            this._audioTrack = rootElement.findName('audioTrack');
            if (this._audioTrack) {
                this._audioTrack.addEventListener('MediaEnded', Function.createDelegate(this, this._onMediaEnded));
            }
        }

        if (this._photoIndex != -1) {
            this._showPhoto(-1, this._photoIndex, false);
           this._onPlayButtonClick(null,null);
            
        }
    },

    _onMediaEnded: function(sender, e) {
        if (this._timerID) {
            this._audioTrack.stop();
            this._audioTrack.play();
        }
    },

    _onNextButtonClick: function(sender, e) {
        var oldIndex = this._photoIndex;
        this._photoIndex++;
        if (this._photoIndex >= this._photos.length) {
            this._photoIndex = 0;
        }
        this._showPhoto(oldIndex, this._photoIndex, true);
    },

    _onPlayButtonClick: function(sender, e) {
        if (!this._timerID) {
            this._playButton.opacity = 0;
            this._playButton.isHitTestVisible = false;
            this._stopButton.opacity = 1;
            this._stopButton.isHitTestVisible = true;
            
            if (this._audioTrack) {
                this._audioTrack.play();
            }

            this._timerID = window.setInterval(Function.createDelegate(this, this._onTimerTick), 5000);
            this._onTimerTick();
        }
    },

    _onPrevButtonClick: function(sender, e) {
        var oldIndex = this._photoIndex;
        this._photoIndex--;
        if (this._photoIndex < 0) {
            this._photoIndex = this._photos.length - 1;
        }
        this._showPhoto(oldIndex, this._photoIndex, true);
    },

    _onSlideShowMouseEnter: function(sender, e) {
        if (this._photoIndex == -1) {
            return;
        }
        if (this._slideShowActivateAnimation) {
            this._slideShowDeactivateAnimation.stop();
            this._slideShowActivateAnimation.begin();
        }
    },

    _onSlideShowMouseLeave: function(sender, e) {
        if (this._photoIndex == -1) {
            return;
        }
        if (this._slideShowActivateAnimation) {
            this._slideShowActivateAnimation.stop();
            this._slideShowDeactivateAnimation.begin();
        }
    },

    _onStopButtonClick: function(sender, e) {
        if (this._timerID) {
            window.clearInterval(this._timerID);
            this._timerID = 0;
            
            if (this._audioTrack) {
                this._audioTrack.stop();
            }
            
            this._playButton.opacity = 1;
            this._playButton.isHitTestVisible = true;
            this._stopButton.opacity = 0;
            this._stopButton.isHitTestVisible = false;
        }
    },

    _onTimerTick: function() {
        var oldIndex = this._photoIndex;
        this._photoIndex++;
        if (this._photoIndex >= this._photos.length) {
            this._photoIndex = 0;
        }
        this._showPhoto(oldIndex, this._photoIndex, false);
    },

    _showPhoto: function(oldIndex, newIndex, userTriggered) {
        if (oldIndex == newIndex) {
            return;
        }
        if (this._photoTransition != null) {
            this._photoTransition.stop();
        }

        if (this._titleLabel) {
            this._titleLabel.Text = this._photos[newIndex].title;
        }
        if (oldIndex != -1) {
            this._photoImage2.ImageSource = this._photos[oldIndex].url;
            this._photo2.Opacity = 1;
            this._photo1.Opacity = 0;
        }
        this._photoImage1.ImageSource = this._photos[newIndex].url;

        if (this._photoTransition != null) {
            this._photoTransition.begin();
        }

        var photoChangedHandler = this.get_events().getHandler('photoChanged');
        if (photoChangedHandler) {
            photoChangedHandler(this, Sys.EventArgs.Empty);
        }
    }
}
nStuff.Samples.Photos.SlideShow.registerClass('nStuff.Samples.Photos.SlideShow', Sys.Preview.UI.Xaml.Control);

if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();