Reactive fullcalendar

calendar.js

Template.Calendar.onCreated(function () {
  const instance = this;

  instance.viewDate = new ReactiveVar();

  instance.autorun(() => {
    const viewDate = instance.viewDate.get();

    if (typeof viewDate !== 'undefined') {
      const startDate = Math.round(viewDate.start / 1000);
      const endDate = Math.round(viewDate.end / 1000);
      instance.subscribe('subscribe', startDate, endDate);
    }
  });
});

Template.Calendar.onRendered(function () {
  const instance = Template.instance();
  
  const calendar = instance.$('#calendar');

  instance.autorun(function () {

    calendar.fullCalendar({
      // options
    });

    const viewDate = instance.viewDate.get();

    if (typeof viewDate !== 'undefined') {

      if (!!instance.handle) {
        instance.handle.stop();
      }

      const someData = Collection.find({
        $or: [
          {date: {$gte: new Date(viewDate.start * 1000)}},
          {date: {$lte: new Date(viewDate.end * 1000)}}
        ]
      });

      instance.handle = someData.observeChanges({
        added: function (id, doc) {
          calendar.fullCalendar('renderEvent', {
            id, title
          }, true);
        },
        removed: function (value) {
          calendar.fullCalendar('removeEvents', value);
        }
      });

    }
  })

})