var HIDE_TIMEOUT = 250;
var currentPageIndex = 0;
var pages;
var padder;

Event.observe(window, "load", function() {
	// Set up the dropdown
	$("menu").select("a").each(function(i) {
		var menu = $(i.readAttribute("menu-id"));
		if(menu) {
			menu.setStyle({ visibility : "visible" });
			menu.activator = i;
			i.menu = menu;
			menu.activator.active = (menu.activator.className == "active");
			menu.observe("mouseout", function(ev) {
				var menu = ev.findElement("div");
				menu.timer = setTimeout("$('" + menu.id + "').hideMenu();", HIDE_TIMEOUT);
			});
			menu.observe("mouseover", function(ev) { clearTimeout(ev.findElement("div").timer) });
			menu.activator.observe("mouseover", function(ev) {
				var menu = ev.element().menu;
				clearTimeout(menu.timer);
				menu.activator.className = "active";
				Effect.Queues.get('menu').each(function(effect) { effect.cancel(); });
				new Effect.Morph(menu.id, {
					style : "height:" + menu.originalHeight + "px;top:" + menu.originalTop + "px;",
					transition : Effect.Transitions.linear,
					duration : .25,
					queue : { scope : 'menu' }
				});
			});
			menu.hideMenu = function() {
				Effect.Queues.get('menu').each(function(effect) { effect.cancel(); });
				new Effect.Morph(this.id, {
					style : "height:0px;top:" + this.hiddenTop + "px",
					transition : Effect.Transitions.linear,
					duration : .25,
					queue : { scope : 'menu' }
				});
				if (!menu.activator.active)
					menu.activator.className = "";
			}
			menu.activator.observe("mouseout", function(ev) { ev.element().menu.timer = setTimeout("$('" + ev.element().menu.id + "').hideMenu();", HIDE_TIMEOUT) });
			menu.originalHeight = menu.getHeight();
			menu.originalTop = i.cumulativeOffset().top - menu.originalHeight;
			menu.hiddenTop = i.cumulativeOffset().top;
			menu.setStyle({ top : menu.hiddenTop + "px", height : "0px", left : i.cumulativeOffset().left + "px" });
		}
	});
	
	// Support for paging
	pages = $$(".content .page");
	var hasPager = ($$(".content .pager").length > 0);
	if (pages.length > 1) {
		for(var i = 0; i < pages.length; i++) {
			pages[i].setStyle({
				position : "absolute",
				top : pages[i].cumulativeOffset().top + "px",
				left : pages[i].cumulativeOffset().left + "px",
				width : pages[i].getWidth() + "px",
				height : pages[i].getHeight() + "px",
				visibility : "visible"
			});
			pages[i].hide();
			if (!hasPager) {
				var pagerPrevious = (i > 0) ? "<a href=\"#\" class=\"previous\" onclick=\"goPrevious(); return false;\">&laquo; Previous</a>" : null;
				var pagerNext = (i < pages.length - 1) ? "<a href=\"#\" class=\"next\" onclick=\"goNext(); return false;\">Next &raquo;</a>" : null;
				pages[i].insert({ bottom : new Template("<div class=\"pager\">#{previous} #{next}</div>").evaluate({ next : pagerNext, previous : pagerPrevious }) });
			}
		}
		$$(".content").first().insert(new Element("div", { id : "placeholder", height : "25px" }));
		currentPageIndex = -1;
		goNext();
	}
});

function goNext() {
	if (currentPageIndex + 1 >= pages.length)
		return;
	if (currentPageIndex >= 0) {
		var current = pages[currentPageIndex++];
		Effect.Fade(current);
		Effect.Appear(pages[currentPageIndex]);
	} else
		pages[++currentPageIndex].show();
	pages[currentPageIndex].setStyle({ top : $("placeholder").cumulativeOffset().top + "px", left : $("placeholder").cumulativeOffset().left + "px" });
}

function goPrevious() {
	if (currentPageIndex - 1 < 0)
		return;
	var current = pages[currentPageIndex--];
	Effect.Fade(current);
	Effect.Appear(pages[currentPageIndex]);
	pages[currentPageIndex].setStyle({ top : $("placeholder").cumulativeOffset().top + "px", left : $("placeholder").cumulativeOffset().left + "px" });
}