loadingImg = new Image();
loadingImg.src = "/images/loading.gif";

var loading = false;

document.observe('dom:loaded', function() {
	var page = $$('body').first().readAttribute('id');

	if ( $('next') ) {
		Event.observe('next', 'click', function(event) {
			Event.stop(event);
			if (!loading) {
				if (currentPage < totalPages) {
					currentPage++;
					loadPage(page, currentPage);
				}
			}
		});
	}

	if ( $('prev') ) {
		Event.observe('prev', 'click', function(event) {
			Event.stop(event);
			if (!loading) {
				if (currentPage > 1) {
					currentPage--;
					loadPage(page, currentPage);
				}
			}
		});
	}

	if ( $('pagination') ) {
		$('pagination').select('a.pageNum').each(function(el) {
			Event.observe(el, 'click', function(event) {
				Event.stop(event);
				if (!loading) {
					currentPage = parseInt( $(el).readAttribute('id').sub('p', '') );
					loadPage(page, currentPage);
				}
			});
		});
	}

	if ( page == "broden" )	{
		$$('div.firstCol').first().select('a').each(function(el) {
			Event.observe(el, 'click', function(event) {
				Event.stop(event);
				if (!loading) {
					parts = $(el).readAttribute('href').split('pnr=');
					currentPage = parseInt(parts[1]);
					loadPage(page, currentPage);
				}
			});
		});
	}
});

function loadPage(page, pnr)
{
	loading = true;
	var done = false;

	if ( $('next') ) {
		var next = (pnr == totalPages) ? '<span>Volgende pagina</span>' : '<a href="/'+page+'.php?pnr='+(pnr+1)+'">Volgende pagina</a>';
		$('next').update(next);
	}
	if ( $('prev') ) {
		var prev = (pnr == 1) ? '<span>Vorige pagina</span>' : '<a href="/'+page+'.php?pnr='+(pnr-1)+'">Vorige pagina</a>';
		$('prev').update(prev);
	}

	if ( $('pagination') ) {
		$('pagination').select('a.pageNum').each(function(p) {
			if ( $(p).hasClassName('current') ) {
				$(p).removeClassName('current');
			}
			$('p'+pnr).addClassName('current');
		});
	}

	new Effect.Opacity('dynContent', {
		duration: 0.25, from: 1.0, to: 0.0, afterFinish: function() {
			$('dynContent').update();
			new Ajax.Request('/content.json.php', {
				method: 'get',
				parameters:	{ page: page, pnr: pnr },
				requestHeaders: {Accept: 'application/json'},
				onCreate: function() {
					new PeriodicalExecuter(function(pe) {
						if (!done) {
							$('dynContent').up().insert({top: '<p id="loading">Bezig met laden...</p>'});
							$('loading').setStyle( {opacity: 0} );
							new Effect.Opacity('loading', {	duration: 0.25, from: 0.0, to: 1.0 });
						}
						pe.stop();
					}, 1);
				},
				onSuccess: function(transport) {
					done = true;
					var json = transport.responseText.evalJSON(true);

					if ( $('loading') ) {
						new Effect.Opacity('loading', {
							duration: 0.25, from: 1.0, to: 0.0, afterFinish: function() {
								$('loading').remove();
								$('dynContent').update(json);
								new Effect.Opacity('dynContent', {
									duration: 0.25, from: 0.0, to: 1.0, afterFinish: function() {
										loading = false;

										if ( page == "broden" ) {
											initialize(false); /* lightbox */
										}
									}
								});
							}
						});
					} else {
						$('dynContent').update(json);
						new Effect.Opacity('dynContent', {
							duration: 0.25, from: 0.0, to: 1.0, afterFinish: function() {
								loading = false;

								if ( page == "broden" ) {
									initialize(false); /* lightbox */
								}
							}
						});
					}
				},
				onFailure: function() {
					document.location = '/'+page+'.php?pnr='+pnr+'/';
				}
			});
		}
	});
}
