Background color if there are important events

Scheduler Javascript
#1

Hello,

Is it possible to change the background color of the whole day when there’s an important event on that day, so you can see this quickly?

I know that you can change the color of the day with: month_date_class, but how can I check if there are such events?

Best regards,
Michiel Klaver

#2

[code]var markers = {};
var format = scheduler.date.date_to_str("%Y-%m-%d");
scheduler.attachEvent(“onEventLoading”, function(ev){
if (ev.important)
markers[format(ev.start_date)]=true;
return true;
});

scheduler.templates.month_date_class=function(date){
if (makers[format(date)]) return “custom_css”;
}[/code]

first part of code checks if important event is exist and stores markers for related dates
second part of code - just a normal template, which uses previously stored markers.

#3

Hello,

Thanks, this is working great, the only strange thing is that it’s not working the first time, first I have to click on the day or week view button before the background is changing.
The other problem is in the unit view, then the background isn’t working correctly, can I disable this class in the unit view?

Regards,
Michiel Klaver

#4

Be sure that month_date_class was defined BEFORE loading data in scheduler.

can I disable this class in the unit view?

scheduler.templates.month_date_class=function(date){ if (scheduler._mode == "units") return ""; ... existing code ...

#5

Hello,

Thanks for the response, but I have defined it before loading the data in scheduler, but is it possible that I don’t see it because I fill the array on the event loading, so it havent been set before the data has been loaded?

The other point is working, only there was a typo:
if (scheduler._mode == “unit”) return “”;

Thanks,
Michiel Klaver

#6

it because I fill the array on the event loading

Order of events is the next

  • data loading
  • onEventLoading processing
  • rendering

So at rendering phase, all flags must be already set.
In any case you can try to use code as

scheduler.load(url, function(){ scheduler.setCurrentView(scheduler._date, scheduler._mode); });

#7

thanks, this works!