var dpjSlideShow = new Class.create();
dpjSlideShow.prototype = {
    container: null,
    images: new Array(),
    width: 400,
    height: 300,
    currentImageIndex: -1,
    wait: 4000,
    prevButton: null,
    nextButton: null,
    pageContainer: null,
    captionContainer: null,
    initialize : function(kwargs)
    {
	if(kwargs.images) this.images = kwargs.images;
	if(kwargs.width) this.width = kwargs.width;
	if(kwargs.height) this.height = kwargs.height;
    },

    setImages: function(images)
    {
	this.images = images;
	this.images.each(function(image){
	    image.setStyle({ display:'none', position:'absolute' });
	    image.onmouseover = function(e){ this.pause();  }.bindAsEventListener(this);
	    image.onmouseout = function(e){ this.play();  }.bindAsEventListener(this);
	    this.container.appendChild( image );
	}.bind(this));
	// this.images[0].setStyle({display:'block'});
	return this;
    },

    setContainer: function(container_id)
    {
	this.container = $(container_id);
	this.container.setStyle({ width: this.width +'px', height: this.height +'px' });
	return this;
    },

    setPrevButton: function(id)
    {
	this.prevButton = $(id);
	this.prevButton.setStyle({cursor:'pointer'});
	this.prevButton.onclick = function(e){ this.prev(); }.bindAsEventListener(this);
	this.prevButton.onmouseover = function(e){ this.pause();  }.bindAsEventListener(this);
	this.prevButton.onmouseout = function(e){ this.play();  }.bindAsEventListener(this);
	return this;
    },

    setNextButton: function(id)
    {
	this.nextButton = $(id);
	this.nextButton.setStyle({cursor:'pointer'});
	this.nextButton.onclick = function(e){ this.next(); }.bindAsEventListener(this);
	this.nextButton.onmouseover = function(e){ this.pause();  }.bindAsEventListener(this);
	this.nextButton.onmouseout = function(e){ this.play();  }.bindAsEventListener(this);
	return this;
    },

    setPageContainer: function(id)
    {
	this.pageContainer = $(id);
	return this;
    },

    setCaptionContainer: function(id)
    {
	this.captionContainer = $(id);
	return this;
    },

    setController: function(kwargs)
    {
	if(kwargs.prev) this.setPrevButton(kwargs.prev);
	if(kwargs.next) this.setNextButton(kwargs.next);
	if(kwargs.page) this.setPageContainer(kwargs.page);
	return this;
    },

    setIndex: function(index)
    {
	index = parseInt(index);
	if(!index){ index = 0; }
	this.swapImages(this.currentImageIndex, index);
	this.currentImageIndex = index;
    },

    init: function()
    {
	this.next();
    },

    play: function(auto)
    {
	if(this.auto || auto){
	    this.next();
	    this.auto = setInterval(this.play.bind(this), this.wait);
	}
    },

    pause: function()
    {
	clearInterval(this.auto);
    },

    next: function()
    {
	clearInterval(this.auto);
	nextIndex = this.currentImageIndex + 1;
	if( nextIndex > this.images.length-1 ) nextIndex = 0;
	this.swapImages(this.currentImageIndex, nextIndex);
	this.currentImageIndex = nextIndex;
    },

    prev: function()
    {
	clearInterval(this.auto);
	prevIndex = this.currentImageIndex - 1;
	if( prevIndex < 0 ) prevIndex = this.images.length-1;
	this.swapImages(this.currentImageIndex, prevIndex);
	this.currentImageIndex = prevIndex;
    },

    swapImages: function(currentIndex, nextIndex)
    {
	if(currentIndex==nextIndex) return;
	if(this.images[nextIndex]) this.images[nextIndex].appear({ duration: 0.3 })
	if(this.images[currentIndex]) this.images[currentIndex].fade({ duration: 0.3 })
	if(this.captionContainer) this.captionContainer.innerHTML = this.images[nextIndex].title;
	if(this.pageContainer) this.buildPager(nextIndex);
    },

    buildPager: function(currentIndex)
    {
	this.pageContainer.innerHTML = '';
	var pager = document.createElement('ul');
 	for(var i=0;i<this.images.length;i++){
	    var li = document.createElement('li');
	    if(i == currentIndex) li.className = 'current';
	    li.innerHTML = i + 1;
	    (function(n){
		li.onclick = function(e){ this.setIndex(n); }.bindAsEventListener(this);
	    }.bindAsEventListener(this))(i);
	    pager.appendChild(li);
	}
	//	this.pageContainer.innerHTML = nextIndex+1 + '/' + this.images.length;
	this.pageContainer.appendChild(pager);
    }
}