document.observe("dom:loaded", function() {
	var navElement = $("nav");
	var snimgs     = navElement.select(".subnav_img");

	snimgs.invoke("next").invoke("hide");

	snimgs.each(function(snimg) {
		snimg.observe("click", function(event) {
			snimgs.without(snimg).invoke("next").invoke("hide");
			snimg.next().show();
		});
	});

	var slideElement 	= $("slide");
	var slideImgs    	= slideElement.select("img");
	var ctrlElements 	= slideElement.down("ul").select("div");
	var slideMapping	= new Hash;

	slideImgs.without(slideImgs.first()).invoke("hide");
	ctrlElements.invoke("setStyle", { backgroundColor : "#999" });
	ctrlElements.first().setStyle({ backgroundColor : "#333" });

	var i;
  var counter = 1;

	for(i = 0; i < ctrlElements.size(); i++)
	{
		slideMapping.set(ctrlElements[i].identify(), slideImgs[i])

		ctrlElements[i].observe("click", function(event)
		{
			event.stop();

			var ctrlElement = event.element();
			counter = ctrlElements.indexOf(ctrlElement) + 1;
			slideShow(ctrlElement, ctrlElements, slideImgs, slideMapping);
		});
	}

	new PeriodicalExecuter(function(pe) {
		if(counter >= ctrlElements.size()) counter = 0;
		slideShow(ctrlElements[counter], ctrlElements, slideImgs, slideMapping);
		counter++;
	}, 7);


});

slideShow = function(ctrlElement, ctrlElements, slideImgs, slideMapping) {
	ctrlElements.invoke("setStyle", { backgroundColor : "#999" });
	ctrlElement.setStyle({ backgroundColor : "#333" });

	slideImgs.invoke("hide");
	slideMapping.get(ctrlElement.identify()).show();
}