$(document).ready(function()
{
	var html = '';
	//var width;
	//var height;
	
	$.get(xmlpath + 'feature_' + year + '.xml', function(data)
	{
		$(data).find('image').each(function()
		{
			var $image = $(this);
			
			var width = $image.find('width').text();
			var height = $image.find('height').text();
			
			if ((width == '0') && (height == '0'))//height and width are zero
			{
				html = '<a href="' + imagepath + $image.find('name').text() + '.jpg" title="' + $image.find('title').text() +'"><img src="' + imagepath + $image.find('name').text() + '.jpg" alt="' + $image.find('title').text() +'"/></a>';
			}
			
			else if ((width != '0') && (height == '0'))//height is zero that means only width is defined
			{
				html = '<a href="' + imagepath + $image.find('name').text() + '.jpg" title="' + $image.find('title').text() +'"><img src="' + imagepath + $image.find('name').text() + '.jpg" alt="' + $image.find('title').text() +'" width="' + width + '"/></a>';
			}
			
			else if ((width == '0') && (height != '0'))//width is zero that means only height is defined
			{
				html = '<a href="' + imagepath + $image.find('name').text() + '.jpg" title="' + $image.find('title').text() +'"><img src="' + imagepath + $image.find('name').text() + '.jpg" alt="' + $image.find('title').text() +'" height="' + height + '"/></a>';
			}
			
			else//both height and width are defined
			{
				html = '<a href="' + imagepath + $image.find('name').text() + '.jpg" title="' + $image.find('title').text() +'"><img src="' + imagepath + $image.find('name').text() + '.jpg" alt="' + $image.find('title').text() +'" width="' + width + '" height="' + height + '"/></a>';
			}
			$('#imageList').append($(html));
		});
		
		$('#imageList a').lightbox();
		$('#loading').hide("slow", function ()
		{
			$('#imageList').slideDown(24000);
		});
		
		
	});
});