var PicturePage = function() {

	return {
		loadInit : function() {
			$('#picture img').animate({opacity: .2}, 500);
			$.ajax({
				type: 'get',
				url: this.href,
				dataType: 'json',
				success: PicturePage.loadComplete
			});
			return false;
		},
		loadComplete: function(data, textStatus) {
			var new_main_image = new Image;
			new_main_image.src = $('#picture img.one').attr('src').replace(/[^\/]+\.jpg$/, data.curr.short_id + '.jpg');
			new_main_image.className = 'two';
			$(new_main_image).load(PicturePage.loadImgComplete);
			if (data.prev)
			{
				var new_prev_image = new Image;
				new_prev_image.src = $('#picture img.one').attr('src').replace(/fullsize/, 'thumbnail').replace(/[^\/]+\.jpg/, data.prev.short_id + '.jpg');
				$('#previous img').replaceWith(new_prev_image);
				$('#previous a').attr('href', data.prev.url).css({display: ''});
				$('#previous span').css({display: 'none'});
			}
			else
			{
				$('#previous span').css({display: 'block'});
				$('#previous a').css({display: 'none'});
			}
			if (data.next)
			{
				var new_next_image = new Image;
				new_next_image.src = $('#picture img.one').attr('src').replace(/fullsize/, 'thumbnail').replace(/[^\/]+\.jpg/, data.next.short_id + '.jpg');
				$('#next img').replaceWith(new_next_image);
				$('#next a').attr('href', data.next.url).css({display: ''});
				$('#next span').css({display: 'none'});
			}
			else
			{
				$('#next span').css({display: 'block'});
				$('#next a').css({display: 'none'});
			}
			$('#image_id').text('Image ID ' + data.curr.short_id);
			$('#comment').text((data.curr.comment) ? data.curr.comment : '' );
		},
		loadImgComplete: function() {
			$('#picture img.two').replaceWith(this);
			var left_offset = ($('#picture #img_holder').width() - $(this).width()) / 2;
			$('#picture img.two').css({display: 'block', opacity: 0, top: '0px', left: left_offset + 'px'}).animate({opacity: 1}, 500, PicturePage.resetAfterImgSwap);
		},
		resetAfterImgSwap: function() {
			var one_replacement = $('#picture img.two').clone();
			one_replacement.css({top: '', left: '', display: ''});
			one_replacement.removeClass('two').addClass('one');
			$('#picture img.one').replaceWith(one_replacement);
			$('#picture img.two').css({display: ''});
		}
	};
}();


$(document).ready(function(){
	//$('a.checkbox').click(PicturePage.loadInit);
});