(function($){
    //Resize image on ready or resize
    $.fn.supersize = function(keepaspect,ratio) {   
        //Invoke the resizenow() function on document ready
    	var element = $(this);
    	if (ratio==undefined || ratio==null) ratio = 9/16;
    	
        $(document).ready(function() {
        	element.resizenow(keepaspect, ratio); 
        });
        //Invoke the resizenow() function on browser resize
        $(window).bind("resize", function() {
        	element.resizenow(keepaspect, ratio); 
        });
    };
    //Adjust image size
    $.fn.resizenow = function(keepaspect, ratio) {
        //Define starting width and height values for the original image
        //Gather browser dimensions
        var browserwidth = $(window).width()- 340;
        var browserheight = $(window).height();
        //Resize image to proper ratio
        if (keepaspect) {
	        if ((browserheight/browserwidth) > ratio) {
	            $(this).height(browserheight);
	            $(this).width(browserheight / ratio);
	            $(this).children().height(browserheight);
	            $(this).children().width(browserheight / ratio);
	        } else {
	            $(this).width(browserwidth);
	            $(this).height(browserwidth * ratio);
	            $(this).children().width(browserwidth);
	            $(this).children().height(browserwidth * ratio);
	        }
        } else {
        	$(this).height(browserheight);
        	$(this).children().height(browserheight);
        	$(this).width(browserwidth);
        	$(this).children().width(browserwidth)
        }
        //Make sure the image stays center in the window
        $(this).children().css('left', (browserwidth - $(this).width())/2);
        $(this).children().css('top', (browserheight - $(this).height())/2);
    };
})(jQuery);

