Usar fullcalendar.io en KumbiaPHP

De KumbiaPHP Framework Wiki

Añadir en la cabecera del template los js del componente y los css:

Cabecera del template

<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.4.0/fullcalendar.min.js"></script>
<script src="http://fullcalendar.io/js/fullcalendar-2.4.0/lang-all.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.4.0/fullcalendar.min.css">

Yo uso CDN´s, pero se pueden descargar y poner en el public de tu aplicación.

Controlador

Luego en el controlador prueba he creado dos acciones (hemeroteca y datosJSON):

	public function datosJson(){
		$articulos = Load::model("articulos");
		echo $articulos->datosJson();
		View::select(null,null);
	}
	
	public function hemeroteca($mes=NULL){		
		if(!$mes){
			$this->mes = date("Y-m-d");
		}else{
			$this->mes = date("Y-").$mes.date("-d");
		}
		$this->eventos =  "'".PUBLIC_PATH."prueba/datosJson'";
	}

Modelo

En el modelo articulos añadir la acción:

	public function datosJson(){
		$inicio = 	$_GET["start"];
		$fin = 		$_GET["end"];
		$where = "(publicacion_dt BETWEEN '$inicio' AND '$fin') and estado = 1";
		$even = array();
		foreach ($this->find($where)  as $m){
			$aux["title"]= $m->titulo;
			$aux["start"]= "$m->publicacion_dt";
			$aux["url"]= PUBLIC_PATH."articulos/$m->slug";				
			$even[]= $aux;
		}
		return json_encode($even);
	}

Vista

La vista de hemeroteca es:

	<div class="content">
		<div class="row">
			<div class="col-xs-12">
				<h2>Calendario</h2>
				<?php View::content();?>
				<br>
				<div id="calendar"></div>
			</div>
		</div>
	</div>

<?php View::partial("recursos/calendar",false, array("eventos"=>$eventos,"mes"=>$mes));?>

Partial

Y el partial:

<?php
if(!isset($eventos))
	$eventos = array();
if(!isset($mes))
	$mes = date("Y-m-d");	
?>
<?php view::partial("recursos/cabeceraCalendar")?>
<script>
	$(document).ready(function() {		
		$('#calendar').fullCalendar({			
			header: {
				center: 'title',
				right: 'month,agendaWeek,agendaDay',
				left: 'prev,next today'
				
			},		
			dayClick: function(date, view) {
				$('#calendar').fullCalendar('changeView', 'agendaDay');
				$('#calendar').fullCalendar('gotoDate', date);
				},	
			defaultDate: '<?php echo $mes;?>',
			editable: false,
			lang: 'es',
			weekNumbers: true,			
			eventLimit: true, // allow "more" link when too many events
			events: <?php echo $eventos;?>
		});		
	});
</script>

--

Henrymalas (discusión) 14:11 4 ene 2016 (CET)