<?php
    $jsonUrl = url('calendarGeneral/default/getJsonEvents');
?>

<script type='text/javascript' src='js/fullcalendar/_loader.js'></script>
<script type='text/javascript' src='js/jquery-ui-1.9.2.custom.min.js'></script>

<script type='text/javascript'>

	$(document).ready(function() {
	
		$('#calendar').fullCalendar({
		    header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
			//editable: true,	
			selectable: true,		
			events: "<?php echo $jsonUrl; ?>",
			firstDay: 1,
			eventDrop: function(event, delta) {
				alert(event.title + ' was moved ' + delta + ' days\n' +
					'(should probably update your database)');
			},
			
			loading: function(bool) {
				if (bool) $('#loading').show();
				else $('#loading').hide();
			}
			
		});
		
	});

</script>
<style type='text/css'>


	#loading {
		position: absolute;
		top: 5px;
		right: 5px;
		}

	#calendar {
		width: 900px;
		margin: 0 auto;
		}

</style>



<div id='loading' style='display:none'>loading...</div>
<div id='calendar'></div>

<style>
.fc-widget-content{
  color: #666;
  font-size: 11px;
  font-weight: bold;
  text-shadow: 0 1px rgba(255, 255, 255, 0.8);
  
  
  background-image: -webkit-linear-gradient(top, #eaeaea 0%, #e5e5e5 60%, #d9d9d9 100%);
  background-image: -moz-linear-gradient(top, #eaeaea 0%, #e5e5e5 60%, #d9d9d9 100%);
  background-image: -o-linear-gradient(top, #eaeaea 0%, #e5e5e5 60%, #d9d9d9 100%);
  background-image: linear-gradient(to bottom, #eaeaea 0%, #e5e5e5 60%, #d9d9d9 100%);
  -webkit-box-shadow: inset 1px 1px rgba(255, 255, 255, 0.5);
  box-shadow: inset 1px 1px rgba(255, 255, 255, 0.5);
}

.fc-today{
    background: #e6e6e6; /* Old browsers */
    background: -moz-linear-gradient(top, #e6e6e6 0%, #dedede 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e6e6e6), color-stop(100%,#dedede)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e6e6e6 0%,#dedede 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e6e6e6 0%,#dedede 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e6e6e6 0%,#dedede 100%); /* IE10+ */
    background: linear-gradient(to bottom, #e6e6e6 0%,#dedede 100%); /* W3C */
}

.fc-other-month{
    color: #b3b3b3;
    background: #f3f3f3;
}
</style>