$(document).ready(function(){
	//When you click on a link with class of calendarImage and the href starts with a #
	$('a.calendarImage[href^=#]').click(function() {
		var popID = $(this).attr('rel'); //Get Popup Name
		var popURL = $(this).attr('href'); //Get Popup href to define size

		//Pull Query & Variables from href URL
		/*
		var query= popURL.split('?');
		var dim= query[1].split('&');
		var popWidth = dim[0].split('=')[1]; //Gets the first query string value
		*/
		
		var popHeight = $(window).height() - 2-20;
		//'-2' used to get appropriate window dimensions
		//'-60' used to add spacing around popup window
		var multiplier = popHeight / $(this).children("img").attr('height'); //multiplier to enlarge the image
		var popWidth = Math.round($(this).children("img").attr('width') * multiplier);
		$('#calendarPopup').children("img").attr({
			height: popHeight,
			width: popWidth
		});
		
		//Fade in the Popup and add close button
		$('#' + popID).fadeIn().css({
			'width': Number( popWidth),
			'height': Number( popHeight)
		});

		//Define margin for center alignment (vertical   horizontal) - we add 4px to the height/width to accomodate for the border width defined in the css
		var popMargTop = ($('#' + popID).height() + 4) / 2;
		var popMargLeft = ($('#' + popID).width() + 4) / 2;

		//Apply Margin to Popup
		$('#' + popID).css({
			'margin-top' : -popMargTop,
			'margin-left' : -popMargLeft
		});

		//Fade in Background
		$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
		$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies

		return false;
	});

	//Close Popups and Fade Layer
	$('a.btn_close, #fade').live('click', function() { //When clicking on the close or fade layer...
		$('#fade , .calendarPopupBlock').fadeOut(function() {
		});
		return false;
	});

});