Month view with

Scheduler Javascript
#1

Two questions about a Month view:

  • I need a Month view where the multi-day events are showed not along the day but on a time-equivalent portion. Default: imgur.com/N3yhpkb . In the default view the two events seems overlayed, but the first ends at the same our that the second event starts.

  • Is it possible to show single day events like multi-day event? With background color, etc…

Thx

#2

Hi,

  1. Currently this is not supported. You can try to redefine the function that calculates the position of the month event,
    github.com/DHTMLX/scheduler/blo … r.js#L4496

However, it may take a decent amount of coding in order to make it work correctly in call cases, especially with drag and drop.

  1. Yes, try following css:

.dhx_cal_event_clear{ padding:2px 6px; border-radius:0; border: 1px solid transparent; background-color: #5B9BE0; color:white; }

#3

Thx for the answer!

  1. Thx for the tip! In my case I want it in a readonly calendar, so there isn’t drag and drop. I accomplished that adding this lines of code before the return of scheduler._get_event_bar_pos:

var t2s = scheduler.date.date_to_str("%H"); var t2s2 = scheduler.date.date_to_str("%H:%i"); start_hour = parseInt(t2s(ev.start_date)); end_hour = parseInt(t2s(ev.end_date)); if (end_hour == 0 || t2s2(ev.end_date) == "23:59") end_hour = 24; totalx = x2 - x; x = x + parseInt(totalx * start_hour/24); x2 = x2 - parseInt(totalx * (24-end_hour)/24);

  1. Thx! It worked, but I tunned it a little bit to preserve the same aspect of the multi-day events:

.dhx_cal_event_clear { padding:0px 6px; border-radius:0; border: 1px solid transparent; background-color: #5B9BE0; color:white; font-size: 12px; height: 17px; line-height: 17px; }

I’ve one more related question. Is it possible to hide the start time from the single-day event’s text?

#4

Found:

scheduler.attachEvent("onTemplatesReady", function(){ scheduler.templates.event_bar_date = function(start,end,event){ return ""; }; });

#5

Our solution for 1) wasn’t working ok, we’ve modified it:

var t2s2 = scheduler.date.date_to_str("%H:%i"); horaInici = parseInt(t2s(ev.start_date)); if (horaFi == 0 || t2s2(ev.end_date) == "23:59") horaFi = 24; else horaFi = parseInt(t2s(ev.end_date)); diaInici = new Date(ev.start_date.getFullYear(), ev.start_date.getMonth(), ev.start_date.getDate()); diaFi = new Date(ev.end_date.getFullYear(), ev.end_date.getMonth(), ev.end_date.getDate()); dies = 1 + Math.floor(((diaFi).getTime()-(diaInici).getTime())/(1000*60*60*24)); if (ev.start_date.getWeek() != ev.end_date.getWeek()) dies--; hores = dies*24; // Si és d'un dia, 24h. 2 dies, 48h, etc... totalx = x2 - x; if (ev.start_date.getWeek() == ev.end_date.getWeek() || xOriginal != 0) x = x + parseInt(totalx * horaInici/hores); if (ev.start_date.getWeek() == ev.end_date.getWeek() || xOriginal == 0) x2 = x2 - parseInt(totalx * (24-horaFi)/hores); totalx = x2 - x; if (totalx < 15) x2 = x2 + 15 - totalx; // No pot ser més petit de 15

But it is’nt a clean/good solution.

Are there plans to integrate this functionality into the DHTMLX Scheduler?

Thx

#6

Unfortunately, we do not have such plans.
Such customization does not seem to be requested often, so currently we do not plan to include it into the package.