/*
	resizer.js
	Version 1.0 (9/14/2011)
	By Phillip Gooch (phillip.gooch@gmail.com)
	About: resizer.js detects screen width (and changes to it) and changes element classes 
	 accordingly. The classes "tiny_screen", "small_screen", "medium_screen", and "large_screen"
	 will be added at sizes <=320px, 321px-768px, 769px-1024px, and >=1025px respectively. The 
	 script uses the window as it's guide, so scrollbars are subtracted before the width is 
	 determined.
	Use: The variable "sizeable" is used as the jQuery selector that classes are applied to. The
	 script automatically runs at document.ready() and window.resize(). 
	Requirements: Requires jQuery version 1.0 or greater (although it was tested on 1.6.3).
																								  */
var sizeable = 'body,#content,#sidebar,#footer';
$(document).ready(function(){
	$(window).resize();
});
$(window).resize(function(){
	var width = parseInt($(window).width());
	if(width<=320){
		$(sizeable).removeClass("tiny_screen small_screen medium_screen large_screen").addClass('tiny_screen');
	}else if( (width>320) && (width<=768) ){
		$(sizeable).removeClass("tiny_screen small_screen medium_screen large_screen").addClass('small_screen');
	}else if( (width>768) && (width<=1024) ){
		$(sizeable).removeClass("tiny_screen small_screen medium_screen large_screen").addClass('medium_screen');
	}else{//>1024
		$(sizeable).removeClass("tiny_screen small_screen medium_screen large_screen").addClass('large_screen');
	}
});
