var PhotoSlideshow = Class.create({
     initialize: function(el, timeout) {
       this.el = el;
       this.timeout = timeout || 5000;
       Event.observe(window, 'load', this.onload.bind(this));
     },
     
     onload: function() {
       this.el = $(this.el);
       this.photos = this.el.childElements();          
       if (this.photos.length <= 1) return;
       var first_photo = Math.floor(Math.random()*(this.photos.length));
       for (var i = 0; i < this.photos.length; i++) {
         if(i == first_photo){
           this.photos[i].setOpacity(100.0);
           this.current = i;
         }
         else
         {
           this.photos[i].setOpacity(0.0);
         }
         this.photos[i].show();
       }
       if (this.photos.length == 0) return;
       window.setTimeout(this.next.bind(this), this.timeout);
     },
     
     next: function() {
       var hide = new Effect.Fade($(this.photos[this.current]), { sync: true, queue: 'end' });
       this.current = (this.current + 1) % this.photos.length;
       var show = new Effect.Appear($(this.photos[this.current]), { sync: true, queue: 'end' });
       new Effect.Parallel([hide, show], { duration: 2.0 });
       window.setTimeout(this.next.bind(this), this.timeout);
     }
    });
    
    new PhotoSlideshow('banner');