Dynamically Showing/Hiding events based on Unit they belong

Scheduler Javascript
#1

I’m trying to reproduce the feature of Google Calendar where I can show/hide all events of a calendar.



Ie I have the following:

scheduler.load(["/calendars/2/calendar_dhtmlx_entries", “/calendars/3/calendar_dhtmlx_entries”]);



All events from “/calendars/2/calendar_dhtmlx_entries” return with a calendar_id 2 and all events from “/calendars/3/calendar_dhtmlx_entries” return with a calendar_id of 3. I would like to be able to toggle if the events show up or not with a checkbox.



Is this possible?



Tys

#2


Scheduler doesn’t provide such a built-in feature.


Please have a look at the dhtmlxScheduler/samples/02_customization/shared_events/ samples in the scheduler package. They can be helpful.

#3

So I ended up doing a “hard” reload, ie, clearing all the data, then calling the load method again with different calendar url’s based on what has changed.  Not ideal but good enough for now.

The current implementation in the schedular for multiple calendars doesn’t feel very coherent.  It would be nice if a future update would add the concept of separate calendars.  Configuration could then happen on per calendar basis instead of having to intercept all sorts of event calls, etc.

The following are the settings I’ve had to “hack around” which would be nice to configure on a per calendar basis instead of global:
- load path
- data connector (ie save calendar 2’s items to the calendar 2 path)
- css for the calendar
- readonly
- free time only (ie no details)
- being able to show/hide each calendar

I think you guys are 99% there!

It would also be nice if the data connector followed the restful API standard.

Tys

#4

We have plans to release the described functionality in several months. But there will be only PHP solution.

#5

If you aim to have a fully restful api then it is very easy to provide a completely server agnostic product.  A calendar fits the restful model very well, and many calendars is just as easy with nested resources.

wonderfullyflawed.com/2009/07/02 … api-right/

#6

Finally figured out an implementation that works well for showing/hiding calendars.

First I had to overload the scheduler.is_visible_events function to also check if an event is in the correct calendar.  It would be nice if we could get another call back for all events.

Next I have a set of check boxes that I check against to see if a calendar is selected, and an array that matches what is used in the units extension for all the calendars.  I observer changes on the check boxes which then trigger scheduler.filterCalendars.  That function recreates the units view as we only want to show visible calendars, then resets the view to the current date and mode (acting as a hacky refresh).  It works pretty well.

Below is the code in case anyone else needs to do something similar.

        // toggle our calendar views
        scheduler.filterCalendars = function () {
            scheduler.createUnitsView(“unit”,“calendar_id”,scheduler.filterUnitsView());
            // scheduler.update_view();
            scheduler.setCurrentView(scheduler._date, scheduler.mode);
        }
        scheduler.filterUnitsView = function () {
            return scheduler.calendars.findAll(function(s) {
              return ($('calendar_visibility’ + s.key).getValue() != null);
            });
        }
       
        var B = scheduler.is_visible_events;
        scheduler.is_visible_events=function(){
            var R =  B.apply(this, arguments);
            if (R && $('calendar_visibility’ + arguments[0].calendar_id).getValue() != null)
            {
                return true;
            }
            else
            {
                return false;
            }
        }