var AjaxSlideShow = Class.create({
  current:0,
  image_array:null,
  initialize: function(images){
   //i need to get the first image and fade it in.
   var t = this;
   t.image_array = images;
    t.loadImage();
   new PeriodicalExecuter(function(pe){
     t.current = (t.current == images.length-1)?0:t.current+1;
     t.loadImage();
     }, 8);
  },
  loadImage : function(){
    var image = new Image();
    var t = this;
     image.onload = function() {
       t.response(image);
     };
     image.src = t.image_array[t.current];
  }, 
  response : function(image){
    var t = this;
    if($('listOfImages').down()){
      var old_li = $('listOfImages').down(0);
    }
    var new_li = new Element('li');
    new_li.setStyle({display:"none"})
    var new_image = new Element("img",{"src":image.src});
    new_li.insert(new_image);
    $('listOfImages').insert(new_li);
    new Effect.Appear(new_li,{duration:.75});
    if(old_li){
      new Effect.Fade(old_li,{duration:.5, afterFinish : function( effect ) {
              t.dispose(effect.element);
            }
      });
    }
  }, 
  dispose:function(garbage){
    var nullable = garbage.remove();
    nullable = null;
  }
  
});