//SlideShow
function SlideShow (list, holder) {
	//alert("SlideShow (" + [list, holder] + ")");
	
	this.list = list;
	this.holder = holder;
	this.entry_length = $(list + " li").length;
	this.selected = 0;
	this.interval_id;
	
	if (this.entry_length > 1) {
		
		$(holder).append('<div id="slideshow_selector"></div>');
		var selector = holder + " #slideshow_selector";
		$(selector).css({clear:"both", display:"block"});
		
		var i;
		var image;
		var entry;
		var p = this;
		for (i = 0; i < this.entry_length; i++) {
			image = $(list + " li").get(i);
			$(image).css("display", "none");
			$(selector).append('<a href="#">&nbsp;' + (i + 1) + '&nbsp;</a>');
			entry = $(holder + " a").get(i);
			$(entry).click(function () {p.select($(holder + " a").index(this));});
		}
		
		this.select(this.selected);
	}
	
}

SlideShow.prototype.next = function () {
	//alert("SlideShow.next ()");
	
	this.select(this.selected + 1);
}

SlideShow.prototype.previous = function () {
	//alert("SlideShow.previous ()");
	
	this.select(this.selected - 1);
}

SlideShow.prototype.select = function (value) {
	//alert("SlideShow.select (" + [value] + ")");
	
	var p = this;
	
	value = value < 0 ? this.entry_length + value : value;
	value = value % this.entry_length;
	
	var last_image = $(this.list + " li").get(this.selected);
	var image = $(this.list + " li").get(value);
	$(last_image).css("display", "none");
	$(image).css("display", "block");
	
	var last_entry = $(this.holder + " a").get(this.selected);
	var entry = $(this.holder + " a").get(value);
	$(last_entry).removeClass("selected");
	$(entry).addClass("selected");
	
	this.selected = value;
	
	clearInterval(this.interval_id);
	this.interval_id = setInterval(function () {p.next();}, 4 * 1000);
}

var scrollbar;
var slideshow;
$(function () {
		scrollbar = new ScrollBar('#area .slider', '#area');
		slideshow = new SlideShow('#image ul', '#image');
	}
);