jQuery(function($) {
	// <a href=\"{$link}\" class=\"image-swapper-thumb load-image\" id=\"image-swapper-thumb-{$key}\" rel=\"media\">
	$( '.image-swapper-thumb' ).bind('click', function(e) {
		var target = $(this).closest( ".article" ).children( ".article-media" );

		// Find arguments
		var key = $(this).attr( 'id' ).substring(20);
		var type = $(this).attr( 'rel' );
		var articleId = target.attr( 'id' ).substring(14);

		// Lock container to current size
		var width = target.width();
		var height = target.height();
		target.css({ 'width' : width + 'px', 'height' : height + 'px' });

		// Show spinning ajax gif
		target.html( '<img src="/pix/ajax-loader.gif" alt="loading..." class="ajax-loader" />' );
		var loaderWidth = target.children( 'img.ajax-loader' ).width();
		var loaderHeight = target.children( 'img.ajax-loader' ).height();
		var marginTop = (height - loaderHeight) / 2;
		var marginLeft = (width - loaderWidth) / 2;
		target.children( 'img.ajax-loader' ).css({ 'margin-top' : marginTop + 'px', 'margin-left' : marginLeft + 'px' });

		// Load content
		$.ajax({
			async:		false,
			type:		'POST',
			url:		'/inc/loadImage.php',
			cache:		false,
			data:		'key=' + key + '&type=' + type + '&articleId=' + articleId,
			success:	function(html) {
				// Hide spinner
				target.children( 'img.ajax-loader' ).hide();
				// Load content
				target.html(html).children().hide();
			},
			complete:	function() {
				// Resize container (target)
				var newWidth = target.children( '.media-wrapper' ).attr( 'width' );
				target.css({ 'width' : newWidth + 'px' });
				
				var imageHeight = target.children( '.media-wrapper' ).attr( 'height' );
				var captionHeight = target.find( '.article-image-caption' ).closest( '.caption-wrapper' ).height() - 13;

				// Calculate for the captions height, if there is one
				if ( parseInt(captionHeight) > 0) {
					captionHeight = parseInt(captionHeight) + 12;
				} else {
					captionHeight = 0;
				}
				var newHeight = parseInt(imageHeight) + captionHeight;
		
				target.css({ 'height' : newHeight + 'px' });
		
				// Show content
				target.children().show();
			}
		});

		e.preventDefault();
	});
});