/// <reference name="MicrosoftAjax.js"/>
function ImageRotator(containerId, topImageId, bottomImageId, serviceUrl, soapRequestText) {
    this.nextImage = 0;
    this.imgUrls = new Array();
    this.faderInterval = 0;
    this.presentOpacity = 1;
    this.container = document.getElementById(containerId);
    this.topImage = document.getElementById(topImageId);
    this.bottomImage = document.getElementById(bottomImageId);
    this.soapRequestText = soapRequestText;
    this.serviceUrl = serviceUrl;
    if (window.XMLHttpRequest) {
        try {
            this.req = new XMLHttpRequest();
        } catch (e) {
            this.req = false;
        }
    } else if (window.ActiveXObject) {
        try {
            this.req = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                this.req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                this.req = false;
            }
        }
    }
    Function.prototype.bind = function(obj) {
        var method = this;
        var args = [];
        for (var n = 1; n < arguments.length; n++) {
            args.push(arguments[n]);
        }
        var temp = function() {
            return method.apply(obj, args);
        };
        return temp;
    }
    this.setOpacity = function(element, value, completedHandler) {
        if (element && value) {
            this.presentOpacity += value;
            if (this.presentOpacity < 0 || this.presentOpacity > 1) {
                completedHandler();
            } else {
                element.style.opacity = this.presentOpacity;
            }
        } else {
            return;
        }
    };
    this.advanceNextImage = function() {
        this.nextImage++;
        if (this.nextImage >= this.imgUrls.length) {
            this.nextImage = 0;
        }
    };
    this.imageFadedOut = function(fadingImage, staticImage) {
        fadingImage.style.opacity = 0;
        clearInterval(this.faderInterval);
        fadingImage.setAttribute('src', this.imgUrls[this.nextImage]);
        this.advanceNextImage();
        setTimeout(this.crossFadeImageIn.bind(this, fadingImage, staticImage), 7500);
    };
    this.imageFadedIn = function(fadingImage, staticImage) {
        clearInterval(this.faderInterval);
        staticImage.setAttribute('src', this.imgUrls[this.nextImage]);
        this.advanceNextImage();
        setTimeout(this.crossFadeImageOut.bind(this, fadingImage, staticImage), 7500);
    };
    this.crossFadeImageOut = function(fadingImage, staticImage) {
        this.presentOpacity = 1;
        this.faderInterval = setInterval(this.setOpacity.bind(this, fadingImage, -0.1, this.imageFadedOut.bind(this, fadingImage, staticImage)), 10);
    };
    this.crossFadeImageIn = function(fadingImage, staticImage) {
        this.presentOpacity = 0;
        this.faderInterval = setInterval(this.setOpacity.bind(this, fadingImage, 0.1, this.imageFadedIn.bind(this, fadingImage, staticImage)), 10);
    };
    this.parseImagesList = function() {
        var il = this.req.responseXML.getElementsByTagName('string');
        for (var i = 0; i < il.length; i++) {
            var ili = il.item(i);
            var ipath = ili.firstChild.nodeValue;
            this.imgUrls[i] = ipath;
        }
    };
    this.initializeImages = function(dom) {
        this.parseImagesList();
        switch (this.imgUrls.length) {
            case 0:
                this.container.appendChild(document.createTextNode('Empty Slideshow'));
                break;

            case 1:
                this.topImage.setAttribute('src', this.imgUrls[0]);
                this.container.removeChild(this.bottomImage);
                break;

            default:
                this.topImage.setAttribute('src', this.imgUrls[this.nextImage]);
                this.advanceNextImage();
                this.bottomImage.setAttribute('src', this.imgUrls[this.nextImage]);
                this.advanceNextImage();
                setTimeout(this.crossFadeImageOut.bind(this, this.topImage, this.bottomImage), 5000);
                break;
        }
    };
    this.processReqChange = function() {
    if (this.req.readyState == 4 && this.req.status == 200 && this.req.responseXML) {
            this.initializeImages.call(this);
        }
    };
    this.startRotator = function() {
        if (this.req) {
            this.req.onreadystatechange = this.processReqChange.bind(this);
            this.req.open('POST', this.serviceUrl, true);
            this.req.setRequestHeader('Content-Type', 'text/xml; charset=utf-8');
            this.req.setRequestHeader('Content-Length', this.soapRequestText.length);
            this.req.setRequestHeader('SOAPAction', this.serviceUrl + '/GetImageUrls');
            this.req.send(this.soapRequestText);
        }
    };
}