<!-- Content Wrapper. Contains page content -->
  <div class="row">
    <!-- Content Header (Page header) -->
    

    <!-- Main content -->
    <section class="content"style="width:800px; height:800px; margin-right:auto; margin-left: auto;">
      <div class="row">
      	<div class="col-md-12">
          <div class="box box-solid">
            <div class="box-header with-border">
              <h4 class="box-title">Clé des couleurs</h4>
            </div>
            <div class="box-body">
              <!-- the events -->
              <div id="external-events row">
                <div class="external-event bg-yellow col-md-4">Mission</div>
                <div class="external-event bg-aqua  col-md-4">Autorisation</div>
                <div class="external-event bg-red  col-md-4">Congé</div>
             
              </div>
            </div>
            <!-- /.box-body -->
          </div>
          <!-- /. box -->
          
        </div>
        <!-- /.col -->
        <div class="col-md-12">
          <div class="box box-primary">
            <div class="box-body no-padding">
              <!-- THE CALENDAR -->
              <div id="calendar" ></div>
            </div>
            <!-- /.box-body -->
          </div>
          <!-- /. box -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

<div class="row">
    <div class="col-md-12">
        <div class="box">
            <div class="box-header">
                <h3 class="box-title">
              
                </h3>
            </div>
        </div>
    </div>
</div>
<script>
	$.get("<?php echo base_url("Dashboard/calendar"); ?>",function(data){
		var logs = JSON.parse(data);
		$('#calendar').fullCalendar({
        theme:false,
       
        local:"fr",
	      header    : {
	        left  : 'prev,next today',
	        center: 'title',
	        right : 'month,agendaWeek,agendaDay'
	      },
	      buttonText: {
	       today:    "aujourd'hui",
          month:    'Mois',
          week:     'Semaine',
          day:      'Jour',
          list:     'liste'
	      },
	      //Random default events
	      events    :logs
	    });
	});
	
</script>