App.Slideshow = 
{       
    parent: undefined,
    currentIndex: 4,
    maxIndex: 5,
        
    init: function (parent)
    {
        this.parent = parent;
        setTimeout(function () {
            App.Slideshow.scrollList();
        }, 4000);
    },
        
    scrollList: function ()
    {
        if (this.parent != undefined) {
            var scroller = $(this.parent).find('div.list').find('ul');
            var bigImg = $(this.parent).find('div.big').find('img');

            // prepend an Item
            $(scroller).prepend('<li><img src="' + App.base_url + 'images/layout/slideshow/' + dezInt(this.currentIndex, 2) + '-small.jpg" /></li>');
            
            var oldMarginTop = $(scroller).children(':first').css('margin-top');
            $(scroller).children(':first').css('margin-top', 0 - $(scroller).children(':first').outerHeight());
            $(scroller).children(':first').animate({marginTop: oldMarginTop});
            
            var lastIndex = this.currentIndex - 1;
            if (lastIndex < 1) {
                lastIndex = 5;
            }
            $(bigImg).fadeOut('fast', function () {
                $(bigImg).attr('src', App.base_url + 'images/layout/slideshow/' + dezInt(lastIndex, 2) + '-big.jpg');
                $(bigImg).fadeIn('fast');
            });
            
            this.currentIndex++;
            if (this.currentIndex > this.maxIndex) {
                this.currentIndex = 1;
            }
            
            setTimeout(function () {
                $(scroller).children(':last').remove();
                App.Slideshow.scrollList();
            }, 5000);
        }        
    }
}