// mereFS() mere fullscreen
jQuery.fn.mereFS = function (style, always, position, minWidth, space, /**/ showTitle, titlePosition ){
/* 
$('#1').mereFS('fit', 'no', 'center', 0, 0, 'yes', 'bottom');
$(window).resize(function(){
	$('#1').mereFSResize('fit', 'no', 'center', 0, 0, 'yes', 'bottom');
});
	
Parameters
1. style: How should the element be resized?
	1. fit: Don't let the exeed the boundaries of the browser window
	2. stretch: Set the element to fill the browser window
2. always (yes, no): Do you want the element to be full screen even when it is smaller than the window?
3. position (center, top & bottom, left & right): Where to put the image
4. minWidth (num): How small should the element get before it stops shrinking with the browser window?
5. space (num): Margins around the element (used with "fit")
6. showTitle (yes, no): Should the title be displayed?
7. titlePosition (top, bottom): Where should the title display? */
$ = jQuery; 
// Declare the element!
el = $(this);

// Class: Give the element a class
$(el).addClass('mereFS').hide();

// Wrapper: Set up the Wrapper DIV
if ($('#mereFSWrap').length == 0) $('body').append('<div id="mereFSWrap"></div><div id="mereFSTitle"></div>');

// Hide: Hide the title untill we get it set up
$('#mereFSTitle').hide();

// After the element loads
$(el).load(function(){ 
		
	// Put the Element inside of the wrapper
	$(el).prependTo('#mereFSWrap');
	
	// Get the elements padding & border width & height to remove from the final width & height
	elpaddingTop = parseInt($(el).css('padding-top').replace('ems',''));
	elpaddingBottom = parseInt($(el).css('padding-bottom').replace('ems',''));
	elpaddingLeft = parseInt($(el).css('padding-left').replace('ems',''));
	elpaddingRight = parseInt($(el).css('padding-right').replace('ems',''));
	
	elBorderTop = parseInt($(el).css('border-top-width').replace('ems',''));
	elBorderBottom = parseInt($(el).css('border-bottom-width').replace('ems',''));
	elBorderLeft = parseInt($(el).css('border-left-width').replace('ems',''));
	elBorderRight = parseInt($(el).css('border-right-width').replace('ems',''));
	
	elExtrasTop = elpaddingTop + elBorderTop;
	elExtrasBottom = elpaddingBottom + elBorderBottom;
	
	elExtrasLeft = elpaddingLeft + elBorderLeft;
	elExtrasRight = elpaddingRight + elBorderRight;
	
	elExtrasVert = elpaddingTop + elpaddingBottom + elBorderTop + elBorderBottom;
	elExtrasHor = elpaddingLeft + elpaddingRight + elBorderLeft + elBorderRight;
	
	// Window width & height
	winHeight = $(window).height();
	winWidth = $(window).width();
	halfWinHeight = winHeight/2;
	halfWinWidth = winWidth/2;
	// Element width & height
	realWidth = $(el).width()+elExtrasHor;
	realHeight = $(el).height()+elExtrasVert;
	elHeight = realWidth;
	elWidth = realHeight;
	halfElHeight = elHeight/2;
	halfElWidth = elWidth/2;
	// Double the space
	space = space+space;
	// Half the space, unless it's zero
	if(space>0) halfSpace = space/2;
	else halfSpace = space;
	// If the space is bigger than the widow... reset it to 5% of the browser window
	if(space>winWidth || space>winHeight) space = winWidth*0.2;
	
	// Dimensions:  Check if the window is wide or tall
	if(winHeight > winWidth) winDim = 'tall';
	else winDim = 'wide';
	// Dimensions:  Check if the element is wide or tall
	if(elHeight > elWidth) elDim = 'tall';
	else elDim = 'wide';
	// Big or Small:  Check if the element is larger than the window
	if(elHeight > winHeight || elWidth > winWidth) elSize = 'big';
	else elSize = 'small';
	
	// If were stretching the element & it's big... remove the space
	if(style == 'stretch' && elSize == 'big') {
		space = 0;
		halfSpace = 0;
	}
	
	// Fit: If we are fitting the element inside the browser window
	if(style == 'fit') { 
		// If we are always making the element fit the browser window or if it's bigger     
		if(always == 'yes' || elSize == 'big') {
			newElWidth = winWidth-space-elExtrasHor;
			newElHeight = winHeight-space-elExtrasVert;
			newElWidth = newElWidth-elExtrasHor;
			newElHeight = newElHeight-elExtrasVert;
		} else {
			newElWidth = elWidth;
			newElHeight = elHeight;
		}
		if(elDim == 'wide' && winDim == 'wide') $(el).css({ height:newElHeight, width:'' });
		if(elDim == 'wide' && winDim == 'tall') $(el).css({ width:newElWidth, height:'' });
		if(elDim == 'tall' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
		if(elDim == 'tall' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
		// get element width & height to check
		checkElHeight = $(el).height()+elExtrasVert;
		checkElWidth = $(el).width()+elExtrasHor;
		if (checkElHeight > winHeight) $(el).css({ height:newElHeight, width:'' });
		if (checkElWidth > winWidth) $(el).css({ width:newElWidth, height:'' });
	} 
	// Stretch: If we are filling the browser window with the element
	else { 
		if(always == 'yes' || elSize == 'big') {
			newElWidth = winWidth;
			newElHeight = winHeight;
		} else {
			newElWidth = elWidth;
			newElHeight = elHeight;
		}
		if(elDim == 'wide' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
		if(elDim == 'wide' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
		if(elDim == 'tall' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
		if(elDim == 'tall' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
		// get element width & height to check
		checkElHeight = $(el).height();
		checkElWidth = $(el).width();
		if (checkElHeight < winHeight) $(el).css({ height:newElHeight, width:'' });
		if (checkElWidth < winWidth) $(el).css({ width:newElWidth, height:'' });
	}

	// Element width & height
	newElHeight = $(el).height()+elExtrasVert;
	newElWidth = $(el).width()+elExtrasHor;
	newHalfElHeight = newElHeight/2;
	newHalfElWidth = newElWidth/2;
	
	// Difference: Get the width & height difference
	if(style == 'stretch') {
		widthDiff = newElWidth-winWidth;
		halfWidthDiff = widthDiff/2;
		negHalfWidthDiff = 0-halfWidthDiff;
		
		heightDiff = newElHeight-winHeight;
		halfHeightDiff = heightDiff/2;
		negHalfHeightDiff = 0-halfHeightDiff;
	}
	
	// Positioning
	$(el).css({ position:'fixed', zIndex:'-9999' });
	if(position == 'top') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'bottom') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'right') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'left') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'top right') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'right top') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'top left') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'left top') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'bottom right') $(el).css({ bottom:halfSpace, right:halfSpace });
	else if(position == 'right bottom') $(el).css({ bottom:halfSpace, right:halfSpace });
	else if(position == 'bottom left') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'left bottom') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'top center') {
		$(el).css({ top:halfSpace });
		if(style == 'fit') $(el).css({ left:halfWinWidth-newHalfElWidth });
		else $(el).css({ left:negHalfWidthDiff });
	}
	else if(position == 'bottom center') {
		$(el).css({ bottom:halfSpace });
		if(style == 'fit') $(el).css({ left:halfWinWidth-newHalfElWidth });
		else $(el).css({ left:negHalfWidthDiff });
	}
	else if(position == 'center right') {
		$(el).css({ right:halfSpace });
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight });
		else $(el).css({ top:negHalfHeightDiff });
	}
	else if(position == 'center left') {
		$(el).css({ left:halfSpace });
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight });
		else $(el).css({ top:negHalfHeightDiff });
	}
	else if(position == 'center') {
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight, left:halfWinWidth-newHalfElWidth });
		else $(el).css({ top:negHalfHeightDiff, left:negHalfWidthDiff });
	}
	
	// Fade out the Loading .gif and in the element
	$(el).fadeIn();
	
	
	
	
	
	// Title: If we're showing the title
	if(showTitle == 'yes') {
		// Title and the title div element
		title = $(el).attr('title');
		titleDiv = $('#mereFSTitle');
		
		
		
		// Put the title inside the title div
		$(titleDiv).html(title);
		
		// Get titleDiv's padding & border width to remove from the titleDiv's width
		titleDivPaddingTop = parseInt($(titleDiv).css('padding-top').replace('ems',''));
		titleDivPaddingBottom = parseInt($(titleDiv).css('padding-bottom').replace('ems',''));
		titleDivPaddingLeft = parseInt($(titleDiv).css('padding-left').replace('ems',''));
		titleDivPaddingRight = parseInt($(titleDiv).css('padding-right').replace('ems',''));
		
		titleDivBorderTop = parseInt($(titleDiv).css('border-top-width').replace('ems',''));
		titleDivBorderBottom = parseInt($(titleDiv).css('border-bottom-width').replace('ems',''));
		titleDivBorderLeft = parseInt($(titleDiv).css('border-left-width').replace('ems',''));
		titleDivBorderRight = parseInt($(titleDiv).css('border-right-width').replace('ems',''));
		
		// Add padding where there is none
		titleSpace = 5;
		if(titleDivPaddingTop == 0) { 
			$(titleDiv).css({paddingTop:titleSpace});
			titleDivPaddingTop = titleSpace;
		} if(titleDivPaddingRight == 0) {
			$(titleDiv).css({paddingRight:titleSpace});
			titleDivPaddingRight = titleSpace;
		} if(titleDivPaddingBottom == 0) {
			$(titleDiv).css({paddingBottom:titleSpace});
			titleDivPaddingBottom = titleSpace;
		} if(titleDivPaddingLeft == 0) {
			$(titleDiv).css({paddingLeft:titleSpace});
			titleDivPaddingLeft = titleSpace;
		}
		
		titleDivExtras = titleDivPaddingLeft + titleDivPaddingRight + titleDivBorderLeft + titleDivBorderRight;
		
		// Position: get the elements position
		elPosition = $(el).offset(); 
		elPositionBottom = elPosition.top + newElHeight;
		elPositionBottom = winHeight - elPositionBottom;
		
		// Fit: If we are fitting the element inside the browser window
		if(style == 'fit') {
			$(titleDiv).css({ width:newElWidth-titleDivExtras-elExtrasHor });
			// Position the title
			if(titlePosition == 'top') $(titleDiv).css({ position:'fixed', top:elPosition.top+elExtrasVert/2, left:elPosition.left+elExtrasHor/2 });
			else $(titleDiv).css({ position:'fixed', bottom:elPositionBottom+elExtrasVert/2, left:elPosition.left+elExtrasHor/2 });
		} 
		// Stretch: If we are filling the browser window with the element
		else {
			$(titleDiv).css({ width:winWidth-titleDivExtras });
			// Position the title
			if(titlePosition == 'top') $(titleDiv).css({ position:'fixed', top:0, left:0 });
			else $(titleDiv).css({ position:'fixed', bottom:0, left:0 });	
		}
		
		// Fade: Fade the title in
		$(titleDiv).fadeIn();
	
	} // End if for title
	
}); // End .load()
} // End function




















// mereFS() mere fullscreen
jQuery.fn.mereFSResize = function (style, always, position, minWidth, space, showTitle, titlePosition){

	// Window width & height
	winHeight = $(window).height();
	winWidth = $(window).width();
	halfWinHeight = winHeight/2;
	halfWinWidth = winWidth/2;
	
	// Dimensions:  Check if the window is wide or tall
	if(winHeight > winWidth) winDim = 'tall';
	else winDim = 'wide';
	
	// Make sure the element doesn't go below the minimum width
	if(winWidth-space > minWidth && always != 'no' || winWidth-space > minWidth && elSize == 'big') {  
		// Fit: If we are fitting the element inside the browser window
		if(style == 'fit' && elSize == 'big' || always == 'yes' && elSize != 'big') {  
			// If we are always making the element fit the browser window or if it's bigger     
			if(always == 'yes' || elSize == 'big') {
				newElWidth = winWidth-space-elExtrasHor;
				newElHeight = winHeight-space-elExtrasVert;
			} else {
				newElWidth = elWidth;
				newElHeight = elHeight;
			}
			if(elDim == 'wide' && winDim == 'wide') $(el).css({ height:newElHeight, width:'' });
			if(elDim == 'wide' && winDim == 'tall') $(el).css({ width:newElWidth, height:'' });
			if(elDim == 'tall' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
			if(elDim == 'tall' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
			// get element width & height to check
			checkElHeight = $(el).height()+elExtrasVert;
			checkElWidth = $(el).width()+elExtrasHor;
			if (checkElHeight > winHeight) $(el).css({ height:newElHeight, width:'' });
			if (checkElWidth > winWidth) $(el).css({ width:newElWidth, height:'' });
		} 
		// Stretch: If we are filling the browser window with the element
		else { 
			if(always == 'yes' || elSize == 'big') { 
				newElWidth = winWidth;
				newElHeight = winHeight;
			} else { 
				newElWidth = elWidth;
				newElHeight = elHeight;
			}
			if(elDim == 'wide' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
			if(elDim == 'wide' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
			if(elDim == 'tall' && winDim == 'wide') $(el).css({ width:newElWidth, height:'' });
			if(elDim == 'tall' && winDim == 'tall') $(el).css({ height:newElHeight, width:'' });
			// get element width & height to check
			checkElHeight = $(el).height();
			checkElWidth = $(el).width();
			if (checkElHeight < winHeight) $(el).css({ height:newElHeight, width:'' });
			if (checkElWidth < winWidth) $(el).css({ width:newElWidth, height:'' });
		}
	}
	// Element width & height
	newElHeight = $(el).height()+elExtrasVert;
	newElWidth = $(el).width()+elExtrasHor;
	newHalfElHeight = newElHeight/2;
	newHalfElWidth = newElWidth/2;
	
	// Difference: Get the width & height difference
	if(style == 'stretch') {
		widthDiff = newElWidth-winWidth;
		halfWidthDiff = widthDiff/2;
		negHalfWidthDiff = 0-halfWidthDiff;
		
		heightDiff = newElHeight-winHeight;
		halfHeightDiff = heightDiff/2;
		negHalfHeightDiff = 0-halfHeightDiff;
	}
	
	// Positioning
	$(el).css({ position:'fixed', zIndex:'-9999' });
	if(position == 'top') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'bottom') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'right') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'left') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'top right') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'right top') $(el).css({ top:halfSpace, right:halfSpace });
	else if(position == 'top left') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'left top') $(el).css({ top:halfSpace, left:halfSpace });
	else if(position == 'bottom right') $(el).css({ bottom:halfSpace, right:halfSpace });
	else if(position == 'right bottom') $(el).css({ bottom:halfSpace, right:halfSpace });
	else if(position == 'bottom left') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'left bottom') $(el).css({ bottom:halfSpace, left:halfSpace });
	else if(position == 'top center') {
		$(el).css({ top:halfSpace });
		if(style == 'fit') $(el).css({ left:halfWinWidth-newHalfElWidth });
		else $(el).css({ left:negHalfWidthDiff });
	}
	else if(position == 'bottom center') {
		$(el).css({ bottom:halfSpace });
		if(style == 'fit') $(el).css({ left:halfWinWidth-newHalfElWidth });
		else $(el).css({ left:negHalfWidthDiff });
	}
	else if(position == 'center right') {
		$(el).css({ right:halfSpace });
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight });
		else $(el).css({ top:negHalfHeightDiff });
	}
	else if(position == 'center left') {
		$(el).css({ left:halfSpace });
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight });
		else $(el).css({ top:negHalfHeightDiff });
	}
	else if(position == 'center') {
		if(style == 'fit') $(el).css({ top:halfWinHeight-newHalfElHeight, left:halfWinWidth-newHalfElWidth });
		else $(el).css({ top:negHalfHeightDiff, left:negHalfWidthDiff });
	}
	
	
	
	// Title: If we're showing the title
	if(showTitle == 'yes') {
		// Position: get the elements position
		elPosition = $(el).offset(); 
		elPositionBottom = elPosition.top + newElHeight;
		elPositionBottom = winHeight - elPositionBottom;
		
		// Fit: If we are fitting the element inside the browser window
		if(style == 'fit') {
			$(titleDiv).css({ width:newElWidth-titleDivExtras-elExtrasHor });
			// Position the title
			if(titlePosition == 'top') $(titleDiv).css({ top:elPosition.top+elExtrasTop, left:elPosition.left+elExtrasLeft });
			if(titlePosition == 'bottom') $(titleDiv).css({ bottom:elPositionBottom+elExtrasBottom, left:elPosition.left+elExtrasLeft });
		} 
		// Stretch: If we are filling the browser window with the element
		else {
			$(titleDiv).css({ width:winWidth-titleDivExtras });
			// Position the title
			if(titlePosition == 'top') $(titleDiv).css({ position:'fixed', top:0, left:0 });
			else $(titleDiv).css({ position:'fixed', bottom:0, left:0 });	
		}
	} // End if for title
	
} // End function
