/**
 * Shuffle images.
 *
 * @author Christian Hansen <christian@resource-it.dk>
 * @version 2.0
 * @copyright Resource it ApS
 *
**/
    

    /**
     * @uses class.function.js
     **/
    function ImageShuffle(width, height, timeout, fade) {

        this.upperLoaded = this.lowerLoaded = false;
        this.timeout = timeout;
        this.fade = fade;
        this.imageIndex = 0;
    
        this.images = [];
        this.html = new Object;
        this.html.container = document.createElement("div");
        this.html.container.style.width = width + "px";
        this.html.container.style.height = height + "px";
        this.html.container.style.overflow = "hidden";
        this.html.container.style.position = "relative";
        
        this.html.lower = document.createElement("img");
        this.html.lower.style.position = "absolute";
	this.html.lower.style.display = "none";
        this.html.lower.style.top = this.html.lower.style.left = "0px";
        this.html.lower.style.zIndex = 1;
	this.html.lower.style.width = width + "px";
        this.html.lower.onload = function() { this.lowerLoaded = true; }.bind(this);
        this.html.container.appendChild(this.html.lower);
        
        this.html.upper = document.createElement("img");
        this.html.upper.style.position = "absolute";
	this.html.upper.style.display = "none";
        this.html.upper.style.top = this.html.upper.style.left = "0px";
        this.html.upper.style.zIndex = 2;
	this.html.upper.style.width = width + "px";
        this.html.upper.style.opacity = 1;
        this.html.upper.style.filter = "alpha(opacity=100)";
        this.html.upper.onload = function() { this.upperLoaded = true; }.bind(this);
        this.html.container.appendChild(this.html.upper);
    
    }//ImageShuffle
    
    ImageShuffle.prototype.loadImages = function() {
        for ( var c = 1; c < arguments.length; c++ ) this.images[this.images.length] = arguments[0] + arguments[c];
        this.html.lower.src = this.images[this.imageIndex++];
        this.html.upper.src = this.images[this.imageIndex++];
    }//loadImages
    
    ImageShuffle.prototype.appendTo = function(o) {
        o.appendChild(this.html.container);
    }//append
    
    ImageShuffle.prototype.shuffle = function() {

        if ( this.html.upper.style.opacity == 0 && this.upperLoaded ) {
            this.imageIndex = ++this.imageIndex == this.images.length ? 0 : this.imageIndex; 
            setTimeout(function() {
                this.html.upper.style.opacity = parseFloat(this.html.upper.style.opacity) + ( this.fade / 100 );
                if ( parseFloat(this.html.upper.style.opacity) >= 1 ) {
                    this.html.upper.style.opacity = 1;
                    this.html.upper.style.filter = "alpha(opacity=" + Math.round(100 * this.html.upper.style.opacity) + ")";
                    this.lowerLoaded = false;
                    this.html.lower.src = this.images[this.imageIndex];
                    setTimeout(this.shuffle.bind(this),this.timeout);
                } else {
                    this.html.upper.style.filter = "alpha(opacity=" + Math.round(100 * this.html.upper.style.opacity) + ")";
                    setTimeout(arguments.callee.bind(this),30);
                }
            }.bind(this),this.fade);
        } else if ( this.html.upper.style.opacity == 1 && this.lowerLoaded ) {
	    this.html.upper.style.display = "block";
	    this.html.lower.style.display = "block";

            this.imageIndex = ++this.imageIndex == this.images.length ? 0 : this.imageIndex; 
            setTimeout(function() {
                this.html.upper.style.opacity = parseFloat(this.html.upper.style.opacity) - ( this.fade / 100 );
                if ( parseFloat(this.html.upper.style.opacity) <= 0 ) {
                    this.html.upper.style.opacity = 0;
                    this.html.upper.style.filter = "alpha(opacity=" + Math.round(100 * this.html.upper.style.opacity) + ")";
                    this.upperLoaded = false;
                    this.html.upper.src = this.images[this.imageIndex];
                    setTimeout(this.shuffle.bind(this),this.timeout);
                } else {
                    this.html.upper.style.filter = "alpha(opacity=" + Math.round(100 * this.html.upper.style.opacity) + ")";
                    setTimeout(arguments.callee.bind(this),30);
                }
            }.bind(this),this.fade);

        } else {
            setTimeout(this.shuffle.bind(this),30);
        }
    }//shuffle

    ImageShuffle.prototype.run = function() {
        setTimeout(this.shuffle.bind(this),this.timeout);
    }//run