var HomepageRotator = new Class({

    _slide: null,
    _imgHolder: null,
    _timerID: null,

    initialize: function (urls) {
        this.urls = urls;


        //this.createPagers();
        this.loadImage(0);
        this._imgHolder = $('slide-image');
        this.startTimer();
        $('slide-holder').addEvent('mouseenter', this.pauseTimer.bind(this));
        $('slide-holder').addEvent('mouseleave', this.startTimer.bind(this));
        this._imgHolder.addEvent('click', this.imgClicked.bind(this));

    },

    imgClicked: function () {
        var url = this.urls[this._slide].url;
        window.location = url;
    },

    /*createPagers: function () {
        for (i = 0; i < this.urls.length; i++) {
            var pager = new Element('div').inject($('slide-pager'));
            pager.addEvent('mouseup', this.loadImage.bind(this, i));
        }
    },

    getPager: function (index) {
        $('slide-pager').getChildren().set('class', '');
        var length = $('slide-pager').getChildren().length;
        var sel = index;
        return $('slide-pager').getChildren()[sel];
    },

    selectPager: function (index) {
        //this.getPager(index).set('html', index + 1);
        this.getPager(index).set('class', 'selected');

    },

    loadPager: function (index) {

        this.getPager(index).set('html', '');
        var loading = new Element('img', { 'src': '/resources/images/loader.gif' });
        loading.inject(this.getPager(index));
        this.getPager(index).set('class', 'loading');
    },*/

    startTimer: function () {
        this._timerID = this.nextImage.periodical(5000, this);
    },

    pauseTimer: function () {
        window.clearInterval(this._timerID);
    },

    loadImage: function (index) {
        if (index == this._slide) {
            return;
        }
        var src = this.urls[index].img;
        Asset.image(src, { 'onLoad': function (img) {
            this.imageLoaded.delay(0, this, [img, index]);
        } .bind(this)
        });
        //this.loadPager(index);
    },

    imageLoaded: function (img, index) {

        var newImg = this._imgHolder.getElement('img.new');
        var oldImg = this._imgHolder.getElement('img.old');

        if (newImg != null) {
            newImg.set('class', 'old');
            newImg.set('tween', { duration: 'long' });
            newImg.tween('opacity', 1, 0);
        }
        if (oldImg != null) {
            oldImg.destroy();
        }


        img.set('class', 'new');
        img.setStyle('opacity', 0);
        img.inject(this._imgHolder);
        img.set('tween', { duration: 'long' });
        img.tween('opacity', 0, 1);
        this._slide = index;
        //this.selectPager(index);
    },

    nextImage: function () {
        var nextIndex = this._slide + 1;
        if (nextIndex >= this.urls.length) {
            nextIndex = 0;
        }
        this.loadImage(nextIndex);
    }

});