var h = 0; // init height to nowt
function getEventsForPage(page, per_page, mode, region_id) {
	
	// the below just stops the events pod getting too small
	/*var th = $("event_wrapper").offsetHeight;
	$("event_outer").setStyle({
		height:th+'px'
	});*/
	
	
	// below basically fades out the current stuff
	// then, *after* it finishes, fires an AJAX request, which...
	// *after* it completes, shows the wrapper again. Nice.
	var target_url = "";
	if (mode =='upcoming') {
		target_url = "events-calendar/ajax/for-page/"+page+"/"+per_page+"/";
	} else {
		target_url = "events-calendar/ajax/for-page/previous/"+page+"/"+per_page+"/";
	}
	if (region_id > 0) {
		target_url += region_id + "/";
	}
	
	new Effect.Fade($("event_wrapper"), {
		duration:0.25,
		afterFinish: function() {
			new Ajax.Request(base_href + target_url, {
				method:'get',
				onSuccess: function(transport) {
					var result = eval('(' + transport.responseText + ')');
					if (result.msg != "OK") {
						alert(result.msg);					}
					if (result.events.length == 0) {
						return;
					}
					var newdiv = new Element("div", {'class':'events'});
					for (var i = 0; i < result.events.length; i++) {
						var event = result.events[i];
						var str = "";
						var intro = event.introduction.substr(0, 100) + "...";
						str += "<h3><a href='events-calendar/"+mode+"/"+event.region_url+"/"+event.url+"/'>"+event.title+"</a></h3>";
						str += "<p class='date'>"+event.date+"</p>";
						str += "<p>"+intro+"</p>";
						if (result.global_events) {
							str += "<p>"+event.region_title+"</p>";
						}
						str += "<a href='events-calendar/"+mode+"/"+event.region_url+"/"+event.url+"/'>View event details</a>";
						newdiv.insert(new Element("div", {'class':'event'}).update(str));
					}
					var c = 1;
					$$(".page_li").each(function(s) {
						if (c == page) {
							s.update(c);
						} else {
							s.update("<a href='javascript://' onclick='javascript:getEventsForPage("+c+", "+per_page+", \""+mode+"\", "+region_id+");'>"+c+"</a>");
						}
						c++;
					});
					$("event_wrapper").update(newdiv);
					
					new Effect.Appear($("event_wrapper"), {
						duration:0.25
						
					});
					
					
				}
			});
		}
	});
}