$(function() {
	function newCal(m,y) {
		$("#calendar").fadeOut('fast',function() {
			var data="m="+m+"&y="+y;
			$.ajax({
				type: "POST",
				url: "calcall.php",
				data: data,
				success: function(msg){
					$("#calendar").hide();
					$("#calendar").html(msg);
					$("#calendar").fadeIn('fast');
				}
			});
		});
	}
	
	$("#nextmonth").live('click',function() {
		var m = parseInt($("#month").val());
		var y = parseInt($("#year").val());
		if (m==12) {m=1;y=y+1;} else {m=m+1;}
		newCal(m,y);
	});
	
	$("#prevmonth").live('click',function() {
		var m = parseInt($("#month").val());
		var y = parseInt($("#year").val());
		if (m==1) {m=12;y=y-1;} else {m=m-1;}
		newCal(m,y);
	});

	$(".date_has_event").live('click',function() {
		var d = $(this).attr("id");
		var m = $("#month").val();
		var y = $("#year").val();
		window.location="schedule.php?d="+d+"&m="+m+"&y="+y;
	});
	
	
	$(".albumclick").click(function() {
		var id = $(this).attr("id");
		window.location="media.php?page=albums&aid="+id;
	});
	
	$(".dialog2").dialog({
			autoOpen: false,
			bgiframe: true,
			width: 1024,
			height: 680,
			modal: true,
			show: 'fold',
			hide: 'fold'
	});
	
	
	$(".mediaalbum").click(function() {
		var id = $(this).attr("id");
		var string = "<img src='images/main/"+id+".jpg' width='1010' height='670'>";
		$(".dialog2").html(string);
		$(".dialog2").dialog('option', 'buttons',{ "Close": function() {$(this).dialog("close"); } });
		$(".dialog2").dialog("open");
	});
	$('.mediaalbum').mouseover(function(e) {
		
		//Grab the title attribute's value and assign it to a variable
		var tip = $(this).attr('id');	
		
		//Append the tooltip template and its value
		$(this).parent().append('<div id="tooltip"><div class="tipHeader"></div><div class="tipBody">' + window["L"+tip] + '</div><div class="tipFooter"></div></div>');		
		
		//Set the X and Y axis of the tooltip
		$('#tooltip').css('top', e.pageY + 10 );
		$('#tooltip').css('left', e.pageX + 20 );
		
		//Show the tooltip with faceIn effect
		$('#tooltip').fadeIn('500');
		$('#tooltip').fadeTo('10',0.8);
		
	}).mousemove(function(e) {
	
		//Keep changing the X and Y axis for the tooltip, thus, the tooltip move along with the mouse
		$('#tooltip').css('top', e.pageY + 10 );
		$('#tooltip').css('left', e.pageX + 20 );
		
	}).mouseout(function() {
	
	
		//Remove the appended tooltip template
		$(this).parent().children('div#tooltip').remove();
		
	});

});