var MyFader = function() {

    this.options = function() {
        this.currentPhoto = 1;
        this.secondPhoto = 2;
        this.fadeStep = 5;
        this.pauseTimeout = 5000; // pause in between transitions
        this.currentOpacity = new Array();
    };


    this.prepare = function() {

        this.init();

    };


    this.init = function() {
        this.options();

        // STOP IE FROM FLICKERING THE BACKGROUND IMAGE ON OPACITY CHANGE  :]
        // DAMN YOU INTERNET EXPLORER, DAMN YOU........
        try {
            document.execCommand('BackgroundImageCache', false, true);
        } catch(e) {
        }

        this.changed = false;
        this.firstRun = true;
        this.fContainer = $('fader');
        this.fInner = $('innerFader');
        this.fTitle = $('title');
        this.doFading = true;
        this.images = [];
        this.imgTitles = [];

        this.images = this.fInner.getElementsByTagName('img');

        for (i = 0; i < this.images.length; i++) {
            this.currentOpacity[i + 1] = 0;
            this.imgTitles[i + 1] = this.images[i].alt;
            this.images[i].style.display = 'none';
        }
        this.currentOpacity[this.currentPhoto] = 100;

        this.fInner.style.background = 'transparent url(' + this.images[this.currentPhoto - 1].src + ') no-repeat';
        this.fContainer.style.background = 'transparent url(' + this.images[this.secondPhoto - 1].src + ') no-repeat';
        this.fTitle.style.display = 'inline';

        // START FADING :)
        this.doFade();
    };

    this.doFade = function() {
        if (this.doFading) {

            if (this.changed) {
                clearTimeout(time);
            }

            var self = this;

            if(!this.firstRun){
            this.currentOpacity[this.currentPhoto] -= this.fadeStep;
            this.currentOpacity[this.secondPhoto] += this.fadeStep;
            }

            var timeoutFunc = function() {
                self.doFade();
            }
            if (this.firstRun) {
                time = setTimeout(timeoutFunc, this.pauseTimeout);
                this.firstRun = false;
                this.updateLinks(1);
            } else {
                time = setTimeout(timeoutFunc, 50);
            }

            //this.fTitle.update(this.imgTitles[this.currentPhoto]);

            if (this.currentOpacity[this.secondPhoto] / 100 >= 0.4) {
                //this.fTitle.update('');
            }

            if (this.currentOpacity[this.secondPhoto] / 100 >= 0.98) {
                this.currentPhoto = this.secondPhoto;
                //this.fTitle.update(this.imgTitles[this.currentPhoto]);

                clearTimeout(time);
                time = setTimeout(timeoutFunc, this.pauseTimeout);
                this.secondPhoto++;
                this.fInner.style.background = 'transparent url(' + this.images[this.currentPhoto - 1].src + ') no-repeat';
                if (this.secondPhoto == (this.images.length + 1)) {
                    this.secondPhoto = 1
                }
                this.fContainer.style.background = 'transparent url(' + this.images[this.secondPhoto - 1].src + ') no-repeat';
                this.fContainer.style.background = 'transparent url(' + this.images[this.secondPhoto - 1].src + ') no-repeat';
                this.changed = true;

                this.updateLinks(this.currentPhoto);
                
            }

            if (document.all) {
                this.fInner.style.filter = "alpha(opacity=" + this.currentOpacity[this.currentPhoto] + ")";
                this.fContainer.style.filter = "alpha(opacity=" + this.currentOpacity[this.secondPhoto] + ")";
            } else {
                this.fInner.style.MozOpacity = this.currentOpacity[this.currentPhoto] / 100;
                this.fContainer.style.MozOpacity = this.currentOpacity[this.secondPhoto] / 100;

                this.fInner.style.WebkitOpacity = this.currentOpacity[this.currentPhoto] / 100;
                this.fContainer.style.WebkitOpacity = this.currentOpacity[this.secondPhoto] / 100;
            }

        }
    };

    this.updateLinks = function(index){
        var img = this.images[this.currentPhoto - 1];
        var num = img.id.split('_');
        num = num[1];

        var values = [];
        values.push($('fLink_'+num+'_1').value);
        values.push($('fLink_'+num+'_2').value);
        values.push($('fLink_'+num+'_3').value);

        $('fLink_1').href = values[0];
        $('fLink_2').href = values[1];
        $('fLink_3').href = values[2];

        console.log(values);
    };

    this.stop = function() {
        this.doFading = false;
    };
};

