/******************************************************
Gallery Event

Version	: 2.2
Author	: irc@isd.gov.hk
Date	: 8 Jun 2007
******************************************************/


// PageLoad function
// This function is called when:
// 1. after calling $.historyInit();
// 2. after calling $.historyLoad();
// 3. after pushing "Go Back" button of a browser
function pageload(hash) {
	// hash doesn't contain the first # character.
	if(hash) {
		// restore gallery loaded state
		showEvent(hash);
	} else {
		// start page
		location.href='index.htm';
	}
}


function showEvent(yde) {
	$('#gallery').html('');

	//loading
	var loading = document.createElement('img');
 	$(loading).src('../../images/loading.gif').addClass('loading');
 	//$(loading).ajaxStart(function(){$(this).show();}).ajaxStop(function(){$(this).hide();}); //jQuery 1.0.3 ajaxStop bug. Will be fixed in 1.0.4

	//Get YD & Event No.
	var A=yde.split('-');
	var yd=A[0];
	var e=A[1]
	
	//Insert Divs
	var frame = document.createElement('div');
 	var nav = document.createElement('div');

	$(frame).addClass('frame').css('position', 'relative').css('overflow', 'hidden');
	$(nav).addClass('nav');
	$("#gallery").append(loading).append(frame).append(nav);

	//Start Ajax
	$('#gallery .loading').show();
	$.ajax({
		type: 'GET',
		url: 'xml/'+yd+'.xml',
		dataType: 'xml',
		success: function(xml){
			$('#gallery .loading').hide();
			var event = $('event:eq('+($('event', xml).size()-e)+')', xml);
			var album = $('title', event).text();
			document.title += ' - ' + album;
			$('#gallery .loading').after("<h3 class='title'>"+album+"</h3>");

			$('photo', event).each(function(i){
				var thumb = "xml/" + $('url', this).text().replace(/.jpg/, 's.jpg'); //thumbnail should be ##s.jpg
                var caption = $('caption', this).text().replace(/\n */g,' ');
                var link = document.createElement('a');
				$(link).addClass('thumb').href('#'+yd+'-'+e).click(function(){ showPhoto(event, i) });
				$(link).hover(function(){$(this).addClass('hover')}, function(){$(this).removeClass('hover')});
				var photo = new Image;
				$(photo).src(thumb).attr({
					alt: caption,
					title: caption
				});
				$(photo).css('display', 'none');
				$(link).append(photo);
				$(nav).append(link);
				$(photo).scope('thumb').fadeIn('fast');
			});
			showPhoto(event, 0);
		}
	});
}

function showPhoto(e, p){
	$('#gallery .loading').show();
	var url = "xml/" + $('photo:eq('+p+')/url', e).text();
	if ($.browser.msie) url+= '?' + (Math.round(512 * Math.random()) + Math.round(512 * Math.random())); //prevent IE image cache
	var caption = $('photo:eq('+p+')/caption', e).text().replace(/\n */g,' ');

	//create the container
	var container = document.createElement('div');
	var description = document.createElement('p');
	$(description).addClass('caption').html(caption).css('width', '530px').css('margin', '10px 0').css('padding', '0');
	$(container).append(description).addClass('container').css('background', '#28d7f4').css('position', 'absolute').css('left', '0').css('top', '0'); //
	$('#gallery .frame').prepend(container);
	var photo = new Image;
	$(photo).addClass('photo').src(url);
	$(photo).attr({
		alt: caption,
		title: caption
	});
	$(photo).load( function() {
		$('#gallery .loading').hide();
		$('#gallery .frame').animate({
	  		height: this.height+$(description).height()+20
		}, '1500');
		$('#gallery .frame div:eq(0)').prepend($(this));
		$('#gallery .frame div').css('display', 'none');
		$('#gallery .frame div:gt(1)').remove();
		$('#gallery .frame div:eq(1)').css('display', 'block').css('zIndex', '0');
		$('#gallery .frame div:eq(0)').css('zIndex', '1').fadeIn(1500);
	});
}

$(document).ready(function(){
		$.historyInit(pageload);
});