 window.addEvent('domready',function() {
        /* settings */
        var showDuration = 6000;
        var container = $('slider');
        var images = container.getElements('img');
        var currentIndex = 0;
        var interval = 4000;
        var toc = [];
        var tocWidth = 10;
        var tocActive = 'toc-active';
        
        
        /* new: starts the show */
        var start = function() { interval = show.periodical(showDuration); };
        var stop = function() { $clear(interval); };
        /* worker */
        var show = function(to) {
        images[currentIndex].fade('out');
        toc[currentIndex].removeClass(tocActive);
        images[currentIndex = ($defined(to) ? to : (currentIndex < images.length - 1 ? currentIndex+1 : 0))].fade('in');
        toc[currentIndex].addClass(tocActive);
        };
        
        /* new: control: table of contents */
        images.each(function(img,i){
        toc.push(new Element('a',{
        //text: i+1,
        href: '#',
        'class': 'toc' + (i == 0 ? ' ' + tocActive : ''),
        events: {
            click: function(e) {
                if(e) e.stop();
                stop();
                show(i);
            }
        },
        styles: {
            left: ((i + 1) * (tocWidth + 4))+900
        }
        }).inject(container));
        if(i > 0) { img.set('opacity',0); }
        });
        
        /* new: control: start/stop on mouseover/mouseout */
        container.addEvents({
        mouseenter: function() { stop(); },
        mouseleave: function() { start(); }
        });
        
        /* start once the page is finished loading */
        window.addEvent('load',function(){
        start();
        });
        });
