/// <reference path="..\..\..\Capitex.Web.UI\Javascript\Library\MicrosoftLibrary.js" />
/// <reference path="..\..\..\Capitex.Web.UI\Javascript\Library\Capitex.js" />
//slideInterval, mainAreaName, buttonNextId, buttonPreviousId
SlideShow = function(settings) {
    this._images = [];
    this._imageObjects = [];
    this._settings = settings;

    this.currentIndex = 0;
    this._previousIndex = 0;

    this._buttonNext = null;
    this._buttonPrevious = null;

    this._nextElement = null;
    this._previousElement = null;
    this._mainArea = null;

    this._onSlideId = null;
    this._onSlideOpacityNext = null;
    this._onSlideOpacityPrevious = null;
    
    this._isSliding = false;

    this._autoSlideId = null;

    $addLoadHandler(this, this.onLoad);
}

SlideShow.prototype.onLoad = function() {
    this._mainArea = $get(this._settings.MainAreaId);

    this._buttonNext = $get(this._settings.ButtonNextId);
    if (this._buttonNext) {
        if (!String.isNullOrEmpty(this._buttonNext.href))
            this._buttonNext.href = "#";
        else
            $addHandler(this._buttonNext, "click", SlideShow.noPostbackMethod);

        Capitex.eventDelegates.addHandler(this._buttonNext, "click", this, this.showNext);
    }

    this._buttonPrevious = $get(this._settings.ButtonPreviousId);
    if (this._buttonPrevious) {
        if (!String.isNullOrEmpty(this._buttonPrevious.href))
            this._buttonPrevious.href = "#";
        else
            $addHandler(this._buttonPrevious, "click", SlideShow.noPostbackMethod);

        Capitex.eventDelegates.addHandler(this._buttonPrevious, "click", this, this.showPrevious);
    }
    if ( this._images.length != 0)
        this.onStart();
}

SlideShow.prototype.isSlideEnabled = function() {
    return (this._images.length > 1);
}

SlideShow.noPostbackMethod = function() {
    return false;
}

SlideShow.prototype.add = function(item) {
    this._images.add(item);
}

SlideShow.prototype.showNext = function() {
    if (this.isSlideEnabled()) {
        this._previousIndex = this.currentIndex;
        if (this.currentIndex === this._images.length - 1)
            this.currentIndex = 0;
        else
            this.currentIndex++;

        this.onStartSlide();
    }
}

SlideShow.prototype.showPrevious = function() {
    if (this.isSlideEnabled()) {
        this._previousIndex = this.currentIndex;
        if (this.currentIndex === 0)
            this.currentIndex = this._images.length - 1;
        else
            this.currentIndex--;

        this.onStartSlide();
    }
}

SlideShow.prototype.ensureImageObject = function(index) {
    if (!this._imageObjects[index]) {

        var item = this._images[index];

        var img = document.createElement('img');
        this._mainArea.appendChild(img);
        this.setOpacity(img, 0);

        img.style.position = "absolute";

        img.style.display = "none";

        img.alt = item.AlternativeText;
        img.src = item.Url;
        img.id = "bild" + index;


        this._imageObjects[index] = img;


        var myImage = new Image();

        myImage.src = img.src;
        var width = myImage.width;

        myImage.onload = function() {
            width = myImage.width;
            var leftPos = 490 - width;
            leftPos = leftPos / 2;
            document.getElementById("bild"+index).style.left = leftPos + "px";
        }
    }
}


SlideShow.prototype.ensureNextImageObject = function() {
    var nextIndex = this.currentIndex + 1;
    var prevIndex = this.currentIndex - 1;

    if (nextIndex === this._images.length)
        nextIndex = 0;

    if (prevIndex < 0)
        prevIndex = this._images.length - 1;

    this.ensureImageObject(nextIndex);
    this.ensureImageObject(prevIndex);
}

SlideShow.prototype.getImageElement = function(index) {
    this.ensureImageObject(index);
    return this._imageObjects[index];
}

SlideShow.prototype.onStart = function() {
    this._nextElement = this.getImageElement(this.currentIndex);
    this.ensureNextImageObject();

    this._nextElement.style.display = "inline";
    this._onSlideOpacityNext = 0;

    this._onSlideId = $setTimeout(this, this.onSlide, this._settings.SlideInterval);
}

SlideShow.prototype.onStartSlide = function() {
    if (this._isSliding) {
        this.onStopSlide();
    }
    else {
        this._onSlideOpacityPrevious = 1;
    }

    this._nextElement = this.getImageElement(this.currentIndex);
    this._previousElement = this.getImageElement(this._previousIndex);
    this.ensureNextImageObject();
    this._nextElement.style.display = "inline";

    this._onSlideOpacityNext = 0;
    this._onSlideId = $setTimeout(this, this.onSlide, this._settings.SlideInterval);

    this._isSliding = true;

    if (!String.isNullOrEmpty(this._settings.ClientScript_OnStartSlide)) {
        eval(this._settings.ClientScript_OnStartSlide);
    }
}

SlideShow.prototype.onStopSlide = function() {
    if (this._previousElement) {
        this._previousElement.style.display = "none";
        this.setOpacity(this._previousElement, 0);
    }
    clearTimeout(this._onSlideId);
    this._isSliding = false;

    if (!String.isNullOrEmpty(this._settings.ClientScript_OnStopSlide)) {
        
        eval(this._settings.ClientScript_OnStopSlide);
    }
}

SlideShow.prototype.onSlide = function() {
    this._onSlideOpacityNext += 0.03;
    this.setOpacity(this._nextElement, this._onSlideOpacityNext);

    if (this._previousElement && this._onSlideOpacityPrevious > 0) {
        this._onSlideOpacityPrevious -= 0.03;
        this.setOpacity(this._previousElement, this._onSlideOpacityPrevious);
    }

    if (this._onSlideOpacityNext <= 1) {
        this._onSlideId = $setTimeout(this, this.onSlide, this._settings.SlideInterval);
    }
    else {
        this.onStopSlide();
        if (this._settings.AutoSlide && this.isSlideEnabled())
            this.resetAutoSlide();
    }
}

SlideShow.prototype.setAutoSlide = function() {
    this._autoSlideId = $setTimeout(this, this.onAutoSlide, this._settings.AutoSlideInterval);
}

SlideShow.prototype.stopAutoSlide = function() {
    clearTimeout(this._autoSlideId);
}

SlideShow.prototype.resetAutoSlide = function() {
    this.stopAutoSlide();
    this.setAutoSlide();
}

SlideShow.prototype.onAutoSlide = function() {
    this.showNext();
}

SlideShow.prototype.setOpacity = function(element, opacity) {
    if (Sys.Browser.agent === Sys.Browser.InternetExplorer) {
        opacity *= 100;
        if (element.filters.alpha) {
            element.filters.alpha.opacity = opacity;
        }
        else {
            element.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + String(opacity) + ")";
        }
    }
    else if (Sys.Browser.agent === Sys.Browser.Firefox) {
        element.style.MozOpacity = opacity;
    }
    else {
        element.style.KhtmlOpacity = opacity;
        element.style.opacity = opacity;
    }
}