/*
    POKE Posterwall
    jQuery plugin that always streaches the body background image to the full screen size.
    Auth: Mattias Gunneras POKE, 2009-11-17
    
    This is heavily influenced by, and kindly borrowed from Supersized @ http://buildinternet.com/project/supersized/
    which is a much more fully featured version that provides slideshow and navigation functionality.
*/

(function($){
	
	// Resize image now, on document load,
	// and when the browser window is resized.
	$.fn.posterwall = function(options) {
	    var options = $.extend({}, $.fn.posterwall.defaults, options);
	    this.each(function() {
	        
	        // update straight away.
	        $(this).update(options);
	        var that = this;
	        
	        var trigger_update = function() {
	            $(that).update(options);
	        };
	        
            //update on dom ready
            $(document).ready(trigger_update);
            // update on window resize
            $(window).bind("resize", trigger_update);
            // update when user triggers 'update'
            $(this).bind('update', trigger_update);
            // update when image is fully loaded.
            $(this).load(trigger_update);
	    });
	};
	
	$.fn.update = function(options) {
	    var options = $.extend({}, $.fn.posterwall.defaults, options);
	  	return this.each(function() {  	    	
			//Define image ratio
            // var startheight = startwidth = 100;
            // var ratio = startheight/startwidth;
            var ratio = options.ratio[1]/options.ratio[0];
			
			//Gather browser and current image size
			var imagewidth = $(this).width();
			var imageheight = $(this).height();
			var browserwidth = $(window).width();
			var browserheight = $(window).height();
            
			//Resize image to proper ratio
			if ((browserheight/browserwidth) > ratio){
			    var width = browserheight / ratio;
			    var height = browserheight;
			} else {
			    var width = browserwidth;
			    var height = browserwidth * ratio;
			}
			
			// set the new width and height values
			// if the width and hight is big enough
			width = width > options.min_size[0] ? width : options.min_size[0];
	        height = height > options.min_size[1] ? height : options.min_size[1];
	        $(this).width(width);
	        $(this).height(height);
		        
	    	// center the image
			if (options.vertical_center == 1){
                var left = (browserwidth - $(this).width())/2;
                var top = (browserheight - $(this).height())/2;
                $(this).css('left', left);
                $(this).css('top', top);
			}
    		
			return false;
		});
	};
	
	var s = [1200, 750];
	$.fn.posterwall.defaults = { 
		vertical_center: 1,
		ratio: s,
		min_size: s
	};	
	
})(jQuery);
