FullCalendar in cakePHP 3.0 not displaying events on calendar

Question

I am upgrading to cakePHP 3.0 and have almost all of the functionality of the FullCalendar plugin working except I can't get any events to populate on the calendar. I am not getting anymore error messages, which makes this difficult to solve. My controller method looks like this:

public function feed($id=null)
{
    $this->request->allowMethod(['get']);
    $this->layout = "ajax";
    $vars = $this->params['url'];
    $conditions = ['conditions' => ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']]];
    $events = $this->Events->find('all', $conditions);
    foreach($events as $event) {
        if($event->all_day == 1) {
            $allday = true;
            $end = $event->start;
        } else {
            $allday = false;
            $end = $event->end;
        }
        $data[] = array(
                'id' => $event->id,
                'title'=>$event->title,
                'start'=>$event->start,
                'end' => $end,
                'allDay' => $allday,
                'url' => Router::url('/') . 'full_calendar/events/view/'.$event->id,
                'details' => $event->details,
                'className' => $event->event_type->color
        );
    }
    $this->set("json", json_encode($data));
}

My View is :

<?php
/*
 * View/FullCalendar/index.ctp
 * CakePHP Full Calendar Plugin
 *
 * Copyright (c) 2010 Silas Montgomery
 * http://silasmontgomery.com
 *
 * Licensed under MIT
 * http://www.opensource.org/licenses/mit-license.php
 */
?>
<div class="page-width">
    <script type="text/javascript">plgFcRoot = "/<site name>/" + "full_calendar"; console.log(plgFcRoot);</script>
    <?php
    echo $this->Html->script(['/full_calendar/js/jquery-1.5.min', '/full_calendar/js/jquery-ui-1.8.9.custom.min', '/full_calendar/js/fullcalendar.min', '/full_calendar/js/jquery.qtip-1.0.0-rc3.min', '/full_calendar/js/ready']);
    echo $this->Html->css('/full_calendar/css/fullcalendar');
    ?>
    <div class="Calendar index">
        <div id="calendar"></div>
    </div>
    <div class="actions">
        <ul>
            <li><?= $this->Html->link(__('New Event', true), ['controller' => 'events', 'action' => 'add']) ?></li>
            <li><?= $this->Html->link(__('Manage Events', true), ['controller' => 'events']) ?></li>
            <li><?= $this->Html->link(__('Manage Events Types', true), ['controller' => 'event_types']) ?></li>
        </ul>
    </div>
</div>

My ready.js is:

/*
 * webroot/js/ready.js 
 * CakePHP Full Calendar Plugin
 *
 * Copyright (c) 2010 Silas Montgomery
 * http://silasmontgomery.com
 *
 * Licensed under MIT
 * http://www.opensource.org/licenses/mit-license.php
 */

// JavaScript Document
$(document).ready(function() {

// page is now ready, initialize the calendar...
$('#calendar').fullCalendar({

    header: {
        left:   'title',
        center: '',
        right:  'today agendaDay,agendaWeek,month prev,next'
    },
    defaultView: 'month',
    firstHour: 8,
    weekMode: 'variable',
    aspectRatio: 2,
    editable: false,
    events: plgFcRoot + "/events/feed",
    eventRender: function(event, element) {
        element.qtip({
            content: event.details,
            position: { 
                target: 'mouse',
                adjust: {
                    x: 10,
                    y: -5
                }
            },
            style: {
                name: 'light',
                tip: 'leftTop'
            }
        });
    },
    eventDragStart: function(event) {
        $(this).qtip("destroy");
    },
    eventDrop: function(event) {
        var startdate = new Date(event.start);
        var startyear = startdate.getFullYear();
        var startday = startdate.getDate();
        var startmonth = startdate.getMonth()+1;
        var starthour = startdate.getHours();
        var startminute = startdate.getMinutes();
        var enddate = new Date(event.end);
        var endyear = enddate.getFullYear();
        var endday = enddate.getDate();
        var endmonth = enddate.getMonth()+1;
        var endhour = enddate.getHours();
        var endminute = enddate.getMinutes();
        if(event.allDay == true) {
            var allday = 1;
        } else {
            var allday = 0;
        }
        var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00&allday="+allday;
        $.post(url, function(data){});
    },
    eventResizeStart: function(event) {
        $(this).qtip("destroy");
    },
    eventResize: function(event) {
        var startdate = new Date(event.start);
        var startyear = startdate.getFullYear();
        var startday = startdate.getDate();
        var startmonth = startdate.getMonth()+1;
        var starthour = startdate.getHours();
        var startminute = startdate.getMinutes();
        var enddate = new Date(event.end);
        var endyear = enddate.getFullYear();
        var endday = enddate.getDate();
        var endmonth = enddate.getMonth()+1;
        var endhour = enddate.getHours();
        var endminute = enddate.getMinutes();
        var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00";
        $.post(url, function(data){});
    }
})

});

Any help in this matter would be greatly appreciated. Sometimes I get this error in the console, but not every time: GET http://localhost//full_calendar/events/feed?start=1433052000&end=1436076000&_=1433266131989 404 (Not Found)

Answer 1

I just solved my issue. I used a process of elimination and found that the conditions array that I had was set up incorrectly for cakePHP 3.0, so it was a cake issue. Instead of

CakePHP 2.x Syntax

$conditions = array('conditions' => array('UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']));
$events = $this->Event->find('all', $conditions);

it is:

CakePHP 3.x Syntax

$conditions = ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']];
$events = $this->Events->find('all', $conditions)->contain(['EventTypes']);

There isn't a conditions setting in the array, you just set the conditions which I got from this example in the cakePHP documentation:

$this->loadModel('Articles');
$recentArticles = $this->Articles->find('all', [
    'limit' => 5,
    'order' => 'Articles.created DESC'
]);