/*
  Simple slideshow using prototype and scriptaculous.
  
  Usage:
  
    <script src="prototype.js"></script>
    <script src="effects.js"></script>
    <script src="slideshow.js"></script>
    <style type="text/css">
      #slideshow { position: relative; width: 100px; height: 100px; }
      #slideshow div { position: absolute; left: 0; top: 0; }
    </style>
    <div class="slideshow" id="slideshow">
      <div class="slide"><img src="slide1.jpg"></div>
      <div class="slide"><img src="slide2.jpg"></div>
      <div class="slide"><img src="slide3.jpg"></div>
    </div>
    <script type="text/javascript">new Slideshow('slideshow', 3000);</script>
  
  See also: http://blog.remvee.net/post/17
  
  Copyright (c) 2006 - R.W. van 't Veer
*/

function Slideshow(slideshow, timeout, Files, start_div) {
 
  var Divs = new Array();
  Divs.push(start_div);
  start_div.style.zIndex = 11;
  for(var i=1; i < Files.length; i++){
      var dv = document.createElement("div");
      dv.className = "slide";
      Divs.push(dv);      
  }
  this.slides = Divs;
  //timeout устанавливается в заданный
  this.timeout = timeout;
  this.current = 0;
  //this.slides[this.current].innerHTML = "<img src='"+Files[this.current]+"' />";
  //this.slides[this.current].style.zIndex = this.slides.length - this.current;
  //document.getElementById('slideshow').appendChild(this.slides[this.current]); 
  Element.show(slideshow);
  setTimeout((function(){this.next();}).bind(this), this.timeout + 850);
}
this.msv = Array();
msv.push(document.createElement("div"));

Slideshow.prototype = {
  next: function() {
    if(this.current % this.slides.length == 0){
        this.slides[this.current % this.slides.length].style.zIndex = 11;
    }
    var slide = this.slides[(this.current + 1) % this.slides.length];
    slide.style.zIndex = this.slides.length - (this.current % this.slides.length);
    if(msv.length < 10){
        var img = document.createElement("img");
        img.src = Files[(this.current + 1) % this.slides.length];
        slide.appendChild(img);
        this.slides[(this.current + 1) % this.slides.length] = slide;
        msv.push(slide);
    }
    document.getElementById('slideshow').appendChild(slide);

    Effect.Fade(this.slides[this.current], {
      afterFinish: function(effect) {       
        effect.element.style.zIndex = 0;
        Element.show(effect.element);
        Element.setOpacity(effect.element, 1);
      }
    });
    
    this.current = (this.current + 1) % this.slides.length;
    setTimeout((function(){this.next();}).bind(this), this.timeout + 850);
  }
}