// fill - Scales and crops the image to fit within it's parent.
// scale - Simply scales the image to 100% width of the parent. Equivalent of setting html width to 100% and leaving html height unset, letting it float. That approach is not valid however, so this is a jQuery alternative.


// plugin definition
jQuery.fn.fullerimage = function(options) {
	var defaults = {
		resizeType: 'fill'
	};
	
	// Extend our default options with those provided.
	var opts = jQuery.extend(defaults, options);
	
	
	
	return this.each(function(){
			
		// Initialize variables
		var $self = jQuery(this);
		
		resizeImage($self);
		
		jQuery($self).load(function () {
		  resizeImage($self);
		});
		
		jQuery(window).load(function () {
		  resizeImage($self);
		});
		
		jQuery(window).resize(function(){
			resizeImage($self);	
		});
		
		
		function resizeImage($self) {
			
					
			var width = $self.width();
			var height = $self.height();
			
			
			if(opts.resizeType == "page"){
				
				
				//Setup some supporting html
				$self.wrap("<div></div>");
				$self.parent().addClass("fullscreen");
				jQuery("body").css({margin: "0", padding: "0"})
				
				//Position the image container
				$self.parent().height(Math.ceil($(window).height() * 1.02 ));
				$self.parent().width(Math.ceil($(window).width() * 1.02 ));
				$self.parent().css({position: "fixed", top: "0", left: "0"})
			}
			
			//determine the aspect ratio of the image
			var heightPercentageOfWidth = height / width;
			var widthPercentageOfHeight = width / height;
			
			if(opts.resizeType == "page" || opts.resizeType == "fill"){
				
				
				//Fill Parent
				if($self.width() <= $self.parent().width() || $self.width() >= $self.parent().width()){
					$self 
					   .width($self.parent().width()) 
					   .height($self.parent().width() * heightPercentageOfWidth);	
				}
				
				if($self.height() <= $self.parent().height()){	
					$self
						.height($self.parent().height())
						.width($self.parent().height() * widthPercentageOfHeight);	
				}	
							
				$self.center();
				
			}
			
			if(opts.resizeType == "scale"){
				//Scale Image
				$self 
					.width($self.parent().width()) 
					.height($self.parent().width() * heightPercentageOfWidth);	
				
			}

			
		}
	});
};