var NewsSlider = new Class({
    Implements: [Options, Events],
    options: {
        minimumTransitionDelay: 10,  // in seconds.  The time in which the news item is shown.
        fadeTransitionTime: 250,
        disablesAutoTransitionOnClick: false,
        url: "/_xml/images.json"
    },
    sliderItemsId: 'HomeImageNav',
    //sliderContainerId: 'newsContainer',
    sliderItems: [],
    sliderImages: null,
    sliderContainerObj: null,
    sliderItemsObj: null,
    requestresult: null,
    oldIndex: -1,
    switchToIndex: -1,
    initialize: function (options) {
        this.setOptions(options);

        this.sliderItemsObj = $(this.sliderItemsId);
        var image = $('homeImage');

        image.addEvent("load", function () {
            this.fadeInNextItem();
        } .bindWithEvent(this));

        this.initializeSlider();
    },
    initializeSlider: function () {
        this.requestresult = new Request.JSON({ url: this.options.url, onSuccess: this.initializeItems.bindWithEvent(this), onFailure: function (error) {
            alert("Error: " + error);
        }
        });
        this.requestresult.send();
    },
    initializeItems: function (result, text) {
        var image = $('homeImage');
        image.set('morph', { duration: this.options.fadeTransitionTime });

        var morph = image.get('morph');
        morph.addEvent('complete', function () {
            if (this.switchToIndex >= 0) {
                this.switchNewsContent(this.switchToIndex);
            }
        } .bindWithEvent(this));

        this.sliderItems = JSON.decode(text);
        this.buildSlider();
    },
    buildSlider: function () {
        for (var i = 0; i < this.sliderItems.length; i++) {
            var slidable = this.sliderItems[i];

            slidable.ImageObj = new Asset.image(slidable.image);

            var li = new Element('a', { 'class': 'imageNavLink' });
            //li.set('html', i + 1);
            li.set('rel', i);
            //li.set('href', slidable.link);

            li.addEvent('click', function (e) {
                this.interval = $clear(this.interval);
                var target = $(e.target);
                var index = target.get('rel');
                this.switchNewsItem(index);
                if (!this.options.disablesAutoTransitionOnClick) {
                    this.startTimer();
                }
            } .bindWithEvent(this));

            li.inject(this.sliderItemsObj);
            slidable.ListItem = li;
            if (i == 0) {
                this.switchNewsItem(0);
            }
        }
        this.startTimer();
    },
    switchNewsItem: function (index) {
        if (index == this.oldIndex) {
            return;
        }
        this.switchToIndex = index;
        if (this.oldIndex >= 0) {
            this.fadeOutCurrentItem();
        } else {
            this.switchNewsContent(index);
        }
    },
    switchNewsContent: function (index) {
        this.switchToIndex = -1;

        var obj = this.sliderItems[index];
        var oldObj = this.sliderItems[this.oldIndex];

        var image = $('homeImage');
        image.src = obj.image;
        obj.ListItem.addClass("Active");
        $('imgLink').set('href', obj.link);
        if (oldObj) {
            oldObj.ListItem.removeClass('Active');
        }
        this.oldIndex = index;
        //this.fadeInNextItem();
    },
    startTimer: function () {
        this.interval = this.moveToNext.periodical(this.options.minimumTransitionDelay * 1000, this);
    },
    moveToNext: function () {
        var nextIndex = (this.oldIndex + 1) % this.sliderItems.length;
        this.switchNewsItem(nextIndex);
    },
    fadeOutCurrentItem: function () {
        var image = $('homeImage');
        image.morph({ 'opacity': [1, 0] });
    },
    fadeInNextItem: function () {
        var image = $('homeImage');
        image.morph({ 'opacity': [0, 1] });
    }
});

window.addEvent('domready', function () {
    var newsSlider = new NewsSlider();
});