//all of these values are div size prior to padding being applied
//var mainWrapperMinX=975;
//var mainWrapperMinY=572;
var mainWrapperMinX=1025;
var mainWrapperMinY=601;

//var mainWrapperMaxX = 1320;
//var mainWrapperMaxY = 775;
var mainWrapperMaxX = 1370;
var mainWrapperMaxY = 804;

var yToXRatio = mainWrapperMaxY / mainWrapperMaxX;

var padding =50;//the combined padding on both sides of the container. Ex: if padding:25px, this variable should be set to 50.

var resizeTimer = null;
$(document).ready(function(){  
	flashResize();
	
	
	$(window).bind('resize', function(){
   	   if (resizeTimer) clearTimeout(resizeTimer);
    	resizeTimer = setTimeout(flashResize, 100); 									  
									  
	});
	
	
	
	//$(window).resize(flashResize);
					   				   
});



function flashResize(){
		var w = $(window).width();

		//var aspectRatio = w / mainWrapperMaxX;	
		var h = Math.round(w * yToXRatio);
		//set outer constraints for range of scaling
		
		
		//min x and y range
		//if($(window).width() < mainWrapperMinX || $(window).height < mainWrapperMinY){
		if(w < mainWrapperMinX ){	
	
			$(".mainWrapper").width(mainWrapperMinX - padding);
			$(".mainWrapper").height(mainWrapperMinY - padding);
		
		}
		
		//max x and y range
		//else if ($(window).width() > mainWrapperMaxX || $(window).height > mainWrapperMaxY){
		else if (w  > mainWrapperMaxX){	
		
			$(".mainWrapper").width(mainWrapperMaxX - padding);
			$(".mainWrapper").height(mainWrapperMaxY - padding);
			
		}
	
		//div is within acceptable range. set proper aspect ratio and scale. Doing this based on width, for simplicity
		else{
	
			$(".mainWrapper").width(w - padding);
			$(".mainWrapper").height(h - padding);
			
		}
		
		//alert("mainWrapper width: " + $(".mainWrapper").width() + " mainWrapper height: " + $(".mainWrapper").height() );
			
}