fullCalendar: How to filter by date in clientEvents?

Question

To avoid overlapping events, I use this function:

    function isOverlapping(event){
    var array = $('#calendar').fullCalendar('clientEvents');
    for(i in array){
      if(array[i].id != event.id){
        if(array[i].allDay || event.allDay){
          if(array[i].start.getDate() == event.start.getDate()){
            if(array[i].start.getMonth() == event.start.getMonth()){
              return true;
            }
          }
        }
        else{
          if(event.end > array[i].start && event.start < array[i].end){ return true;}
        }
      }
    }
      return false;
  }

If my calendar has lots of events, the function is quite slow, so as to increase the speed, i thought it would be nice to compare only the events in the current view, so I wished I could use the clientEvents filter function like this:

    var array = $('#calendar').fullCalendar('clientEvents', function(events){ return (event.start >= view_start && view_end > event.start)});

But this returns all the events.

Note: I have declared view_start & view_end as global variables and calculated them in the ViewDisplay like this:

 view_start = view.visStart;
 view_end = view.visEnd;     

How can I get the events which are visible in the current view.

Solution 1

There are no built in filter in fullcalendar, you have to make them by yourself. The only thing you can do is to do what you are doing :) ...using your own filter functions.

This is what i do to filter them, but this is made client side, so the filtering will be made client side... This can be a problem, but for my particular solution its enought.

This is my example:

function getCalendarEvents(filter){

        var events = new Array();      
            if(filter == null)
            {
                events = calendar.fullCalendar('clientEvents');
            }
            else
            {
                events = getEventsByFilter(filter);                 
            }           
        return events;                 
    }

The filter events function:

function getEventsByFilter(filter){        
        var allevents = new Array();
        var filterevents = new Array();
        allevents = getCalendarEvents(null);

        for(var j in allevents){ 
            if(allevents[j].eventtype === filter)
            {
                filterevents.push(allevents[j]);
            }
        }           

        return filterevents;
    }

Solution 2

The problem with the oneliner you wanted to use is that the event.start is actually an object. I was able to use something similar like this:

moment(calEvent.start).format('YYYY-MM-DD')

So for your case try:

var array = $('#calendar').fullCalendar('clientEvents', function(events){ return (moment(events.start).format('YYYY-MM-DD') >= view_start && view_end > moment(events.start).format('YYYY-MM-DD'))});