How to load resources on-demand and sync it with events?

[coirpower]

`

    // Embed resources directly using PHP variable
    var resources = @json($staffs);

    var calendarEl = document.getElementById('calendar');

    var calendar = new EventCalendar(calendarEl, {
        view: 'resourceTimelineWeek',
        firstDay: 1,
        slotDuration: {days: 1},
        headerToolbar: {
            start: 'prev,next today',
            center: 'title',
            end: 'resourceTimelineWeek'
        },
        eventSources: [
            {
                url: '/attendance/resourcesAndAttendance',
                method: 'GET',
                failure: function() {
                    alert('There was an error while fetching events!');
                }
            }
        ],
        views: {
            resourceTimelineWeek: {
                pointer: true, 
                resources: resources
            }
        },
        dayMaxEvents: true,
        nowIndicator: true,
        selectable: false            
    });
});

`

I use the above code but it looks like the calendar loads resources at initialization and does not automatically refresh them when I fetch events.

Basically, I have server side code that will return only the required resources and their events, and would like the calendar to fetch and load these dataset at runtime. Any suggestions?

[vkurko]

It seems that something like refetchResources() is needed. I will try to implement it in future versions.

[busti]

I wound up using a workaround:

        calendar.setOption('eventSources',
            [
                {
                    events: function (fetchInfo, successCallback, failureCallback) {
                        req = fetch(`/schedule/events?start=${fetchInfo.startStr}&end=${fetchInfo.endStr}`)
                        json = req.then(res => res.json())
                        json.then(j => {
                            window.history.pushState(null, '', `/schedule?start=${fetchInfo.startStr}&end=${fetchInfo.endStr}`);
                            calendar.setOption('resources', j.resources);
                            successCallback(j.events);
                        })

                        req.catch(e => failureCallback(e))
                    }
                }
            ]
        )

It's not perfect tho. Resources can shuffle around and collapsed resources open back up.