 (function($) {
 
 	// http://docs.jquery.com/Plugins/Authoring
 	// http://kimili.com/journal/flexible-scalable-background-image
 	
	$.fn.flexiBackground = function(settings) {
   
		var options = $.extend($.fn.flexiBackground.defaults, $.fn.flexiBackground.options);

		if (settings) $.extend(options, settings);


		// No need for any of this if the screen isn't bigger than the background image
		if (screen.availWidth <= options.startwidth || screen.availHeight <= options.startheight) {
			return;
		}
		
		// Parse out the URL of the background image and drop out if we don't have one
		var url = $('body').css('background-image').replace(/^url\(("|')?|("|')?\);?$/g, '') || false;	
		if (!url || url === "none" || url === "") {
			return;
		}
		
		// Create a new image element
		$.bgImage = $('<img />')
					.attr('src', url)
					.attr('id', options.imageID);
					
					
							
		// Create a wrapper and append the image to it.
		// The wrapper ensures we don't get scrollbars.
		$.wrapper = $('<div></div>')
						.css({
							'overflow' : 'hidden',
							'width' : '100%',
							'height' : '100%',
							'z-index' : '-1'
						})
						.append($.bgImage)
						.appendTo($('body'));
						
						
		// IE6 Doesn't do position: fixed, so let's fake it out.
		// We'll apply a class which gets used in the CSS to emulate position: fixed
		// Otherwise, we'll simply used position: fixed.
		
		if (options.ie6) {
			$.wrapper.addClass('ie6fixed');
		} else {
			$.wrapper.css({
				'position' : 'fixed',
				'top' : 0,
				'left' : 0
			});
		}
	

		// Set up a resize listener to add/remove classes from the body 
		$(window).bind("resize", function(){
    		$('body').resizeAction(); 
		});
		
		// Set it up by triggering a resize
		$(window).trigger('resize');
		
		return this;
 
	};			
			
			
			
			
					
	$.fn.resizeAction = function() {
	
		var options = $.extend($.fn.flexiBackground.defaults, $.fn.flexiBackground.options);
		
		var win = {
			height : $(window).height(),
			width : $(window).width()
		};
		
		// Get the aspect ratio of the image
		var imgAR = options.startwidth / options.startheight;	
			
		// The current aspect ratio of the window
		var winAR = win.width / win.height;
		
		// Determine if we need to show the image and whether it needs to stretch tall or wide
		if (win.width < options.startwidth && win.height < options.startheight) {
		
			$('body')
				.removeClass(options.wideClass)
				.removeClass(options.tallClass);
				
		} else if ((win.width < options.startwidth && win.height >= options.startheight) || (winAR < imgAR)) {

			$('body')
				.removeClass(options.wideClass)
				.addClass(options.tallClass);
				
			// Center the image
			$.bgImage.css('left', Math.min(((win.width - options.startwidth) / 2), 0));
			
		} else if (win.width >= options.startwidth) {
		
			$('body')
				.addClass(options.wideClass)
				.removeClass(options.tallClass);
				
			$.bgImage.css('left', 0);
		}
		
		// Need to fix the height of the wrapper for IE6
		if (options.ie6) {
			$.wrapper.css('height', win.height);
		}
				
	};
 
 
 
	$.fn.flexiBackground.defaults = { 
	
		ie6 : ($.browser.msie && parseInt($.browser.version, 10) <= 6),
		imageID : "expando",
		tallClass : 'tall',
		wideClass : 'wide'
	};
	 
	 
})(jQuery);

