(function($) {
    		
	    $.fn.extend({
		    createGallery: function(options) {
			    return this.each(function() {
				    var $this = $(this);
				    $(window).load(function()	{
					    $.wvGallery.init($this, $.extend({}, $.fn.createGallery.defaults, options));
				    });
			    });
		    }
	    });
    			
	    $.fn.createGallery.defaults = {
		    url: '/AJAX/gallery_contents.aspx',
		    onLoad: null,
		    imageList: {},
		    images: 'div.showing li',
		    thumbsContainer: 'div.thumbs',
		    thumbs: 'div.thumbs li',
		    thumbFade: 0.7,
		    thumbFadeDuration: 200,
		    numThumbsShown: 5,
		    currentPosition: 0,
		    scrollDuration: 500,
		    fixHeight: true,
		    maxHeight: 0,
		    loadingClass: 'ajax_loading',
		    loadingOpacity: 0.7
	    };

	    $.extend({
    		
		    wvGallery: {
    			
			    _uID: 0,
			    settings: [],
    			
			    init: function(jQobj, settings)	{
				    var pointer = this;
				    var inst = this._uID;
				    // Save settings
				    this.settings[inst] = settings;
				    // First, get and save the max height, and set up the required padding on the first item
				    this.setupFirstPicture(jQobj, this.settings[inst]);
				    // Add in the left and right arrows
				    this.createScrollButtons(jQobj, inst);
				    // Fetch results
				    $.getJSON(this.settings[inst].url, function(reply)	{
					    $.each(reply.images, function(i, image)	{
						    $('<li><a href="#"><img /></a><p></p></li>').find('img').attr('src', image.filename).css({
							    'height': image.height + "px",
							    'padding-top': (parseInt(pointer.settings[inst].maxHeight - image.height) / 2) + "px",
							    'padding-bottom': (parseInt(pointer.settings[inst].maxHeight - image.height) / 2) + "px"
						    }).end()
							    .find('p').text(image.caption || '').end()
							    .appendTo($(pointer.settings[inst].images).parent());
					    });
					    pointer.calculateScrollDistance(jQobj, pointer, inst);
					    // Set the width of the thumb container
					    pointer.setThumbContainerWidth(jQobj, pointer.settings[inst]);
					    // Position captions
					    pointer.positionCaptions(jQobj, pointer.settings[inst]);
					    // Set up the thumbnail fading
					    pointer.setThumbFade(jQobj, pointer.settings[inst]);
					    // Set up show/hide for captions
					    pointer.setCaptionFade(jQobj, pointer.settings[inst]);
					    // Set up selection of new image
					    pointer.showNewPicture(jQobj, pointer.settings[inst]);
					// Click for next image
					pointer.clickForNextImage(jQobj, pointer.settings[inst]);
					    // Hide the loader!
					    $(pointer.settings[inst].images).addClass('loaded');
					    pointer.settings[inst].loadScreen.fadeOut(1000, function()	{	$(this).remove();	});
					    pointer._uID++;
				    });
			    },
    			
			    setupFirstPicture: function(jQobj, settings)	{
				    // Set the CSS to include 'zoom: 1' for ie
				    $(jQobj).find(settings.images).css('zoom', 1);
				    // Get the maximum height and save it
				    settings.maxHeight = parseInt($(jQobj).find(settings.images).find('a').attr('rel'));
				    // Get this image's height
				    var height = parseInt($(jQobj).find(settings.images).find('img').height());
				    // Get this image's padding-top - half the difference in heights
				    var paddingTop = parseInt((settings.maxHeight - height) / 2);
				    // Remove the padding from the height
				    height = settings.maxHeight - paddingTop;
				    // Now we have the heights we cam create the loading overlay
				    this.createLoader(jQobj, settings);
				    // Apply the padding and the height and also morph the loader
				    $(jQobj).find(settings.images).animate({
					    'height': height,
					    'paddingTop': paddingTop	
				    }, 1000);
				    settings.loadScreen.animate({
					    'height': settings.maxHeight			
				    }, 1000);
			    },
    			
			    createLoader: function(jQobj, settings)	{
				    var pointer = this;
				    settings.loadScreen = $('<div></div>').addClass(settings.loadingClass).appendTo(document.body);	
				    settings.loadScreen.css({
					    'top': $(jQobj).find(settings.images).eq(0).offset().top,
					    'left': $(jQobj).find(settings.images).eq(0).offset().left,
					    'width': $(jQobj).find(settings.images).eq(0).width(),
					    'height': $(jQobj).find(settings.images).eq(0).height(),
					    'opacity': settings.loadingOpacity
				    });
			    },
    		
			    createScrollButtons: function(jQobj, inst)	{
				    // Save a reference to this plugin
				    var pointer = this;
				    var settings = this.settings[inst];
				    // Check to see if the number of thumbs is greater than the required thumbs shown
				    if($(jQobj).find(settings.thumbs).length > settings.numThumbsShown)	{
					    // Create buttons
					    settings.previousButton = $('<span class="previousButton">Previous thumbnails</span>');
					    settings.nextButton = $('<span class="nextButton">Next thumbnails</span>');
					    // Stick them in at the beginning and end of the thumb container
					    $(jQobj).find(settings.thumbsContainer).prepend(settings.previousButton).append(settings.nextButton);
					    // Add functionality
					    settings.previousButton.click(function()	{	
						    pointer.scrollLeft(jQobj, pointer, inst)	
					    });
					    settings.nextButton.click(function()	{	
						    pointer.scrollRight(jQobj, pointer, inst)	
					    });
				    }
			    },
    		
			    scrollLeft: function(jQobj, pointer, inst)	{
				    if(pointer.settings[inst].currentPosition < 0)	{
					    pointer.settings[inst].currentPosition = parseInt($(pointer.settings[inst].thumbs).parent().css('left')) + pointer.settings[inst].scrollDistance;
					    // Temporarily remove the click event from the button
					    pointer.settings[inst].previousButton.unbind('click');
					    // Animate the scrolling....
					    $(jQobj).find(pointer.settings[inst].thumbs).parent().animate({
						    left: '+=' + pointer.settings[inst].scrollDistance + 'px'
					    },
					    {
						    duration: pointer.settings[inst].scrollDuration,
						    complete: function()	{
							    pointer.settings[inst].previousButton.click(function()	{	pointer.scrollLeft(jQobj, pointer, inst)	});
						    }
					    });
				    }
			    },
    			
			    scrollRight: function(jQobj, pointer, inst)	{
				    if(-(pointer.settings[inst].currentPosition - pointer.settings[inst].scrollDistance) < pointer.settings[inst].totalThumbContainerWidth)	{
					    // Save the new position
					    pointer.settings[inst].currentPosition = parseInt($(pointer.settings[inst].thumbs).parent().css('left')) - pointer.settings[inst].scrollDistance;
					    // Temporarily remove the click event from the button
					    pointer.settings[inst].nextButton.unbind('click');
					    // Animate the scrolling....
					    $(jQobj).find(pointer.settings[inst].thumbs).parent().animate({
						    left: '-=' + pointer.settings[inst].scrollDistance + 'px'
					    },
					    {
						    duration: pointer.settings[inst].scrollDuration,
						    complete: function()	{
							    pointer.settings[inst].nextButton.click(function()	{	pointer.scrollRight(jQobj, pointer, inst)	});
						    }
					    });
				    }
			    },
    			
			    calculateScrollDistance: function(jQobj, pointer, inst)	{
				    // Get the width of one of the thumbs
				    pointer.settings[inst].thumbWidth = $(jQobj).find(pointer.settings[inst].thumbs).eq(0).width();
				    // Add on any margin and padding
				    pointer.settings[inst].thumbWidth += parseInt($(jQobj).find(pointer.settings[inst].thumbs).eq(0).css('margin-left'));
				    pointer.settings[inst].thumbWidth += parseInt($(jQobj).find(pointer.settings[inst].thumbs).eq(0).css('margin-right'));
				    pointer.settings[inst].thumbWidth += parseInt($(jQobj).find(pointer.settings[inst].thumbs).eq(0).css('padding-left'));
				    pointer.settings[inst].thumbWidth += parseInt($(jQobj).find(pointer.settings[inst].thumbs).eq(0).css('padding-right'));
				    // Calculate how much to scroll the thumbs
				    pointer.settings[inst].scrollDistance = pointer.settings[inst].numThumbsShown * pointer.settings[inst].thumbWidth;
			    },
    		
			    setThumbContainerWidth: function(jQobj, settings)	{
				    settings.totalThumbs = $(jQobj).find(settings.thumbs).length;
				    settings.totalThumbContainerWidth = settings.totalThumbs * settings.thumbWidth;
				    $(jQobj).find(settings.thumbs).parent().css('width', settings.totalThumbContainerWidth + "px");
			    },
    			
			    setThumbFade: function(jQobj, settings)	{
				    $(jQobj).find(settings.thumbs).find('img').hover(
					    function()	{
						    $(this).animate(
							    {	opacity: settings.thumbFade	},
							    {	duration: settings.thumbFadeDuration,	queue: false	});
					    },
					    function()	{
						    $(this).animate(
							    {	opacity: 1	},
							    {	duration: settings.thumbFadeDuration,	queue: false	});
					    }
				    );
			    },
    			
			    showNewPicture: function(jQobj, settings)	{
				    // Loop through all the thumbs
				    $(jQobj).find(settings.thumbs).find('a').click(function()	{
					    // Calculate which thumbnail was clicked on
					    var index = $(this).parents('ul').children().index(this.parentNode);
					    // Hide the existing image and show the new one
					    $(jQobj).find(settings.images).removeClass('current').css('display', '').eq(index).addClass('current');
					    return false;							 
				    });
			    },
    		
			    positionCaptions: function(jQobj, settings)	{
				    $(jQobj).find(settings.images).css({
					    'position': 'relative',
					    'zoom': 1
				    }).find('p').css({
					    'position': 'absolute',
					    'bottom': '0'
				    });
			    },
    		
			    setCaptionFade: function(jQobj, settings)	{
				    $(jQobj).find(settings.images).find('p').each(function()	{
					    if($(this).text() == '')	$(this).css('visibility', 'hidden');
				    });
				    $(jQobj).find(settings.images).hover(
					    function()	{	$(this).find('p').fadeIn();		},
					    function()	{	$(this).find('p').fadeOut();	}
				    );
			},
			
			
            clickForNextImage: function(jQobj, settings)	{
				var index, length = $(jQobj).find(settings.images).length - 1;
				$(jQobj).find(settings.images).find('A').click(function()	{
					$(jQobj).find(settings.images).each(function(i)	{
						if($(this).is(':visible'))	{
							index = i;
						}
					});
					if(index >= length)	{
						$(jQobj).find(settings.thumbs).eq(0).find('a').click();
					}
					else	{
						$(jQobj).find(settings.thumbs).eq(index + 1).find('a').click();
					}
					return false;
				});
			}			
    		
		    }
    		
	    });

    $(function()	{
	    $('div.gallery').createGallery({
            url: '/AJAX/gallery_contents.aspx?storycode=' + Config.get('storycode'),
				           numThumbsShown:7
				           });
    });

})(jQuery);