When changing the nonWorkingDays property of a calendar after initialization I encountered some unintended behavior (see attached video and follow my list of findings).
In the video i have watches for some relevant properties:
- calendar.views[0] is a resource view, which in term has several dayViews as subviews. In the video this view is called "Gruppiert nach Kanal" and starts from 0:41 m
- calendar.views[1] is a dayresource view. IN the video this is called "Gruppiert nach Tag" and goes from 0:00m - 0:43m
Now, when I set a day as nonWorkingDay during runtime, I made the following observations:
- setting the value on a calendar doesn't update the views reegistered on that calendar (see 0:17 m)
- after manually setting the value on all views, the dayresourceview updates correctly as intended (see m 0:22)
- when doing the same action however, the resourceview does NOT update correctly (see from 0:41 m)
- only the first subview of that resourceview reacts to the changes, and even though the allDayEvents updates it nonWorkingDays correctly, the dayHeaders of that view do not render correctly (see from 1:35 m)
Here is the initial configuration, as well as the code I use to update the nonWorking days, called by the menu. I hope this information is sufficient to help me out / fix a potential bug.
....
resource: {
title: "Gruppiert nach Kanal",
view: {
type: "dayview",
syncCalendarDate: false,
range: rangeInDays + "d",
allDayEvents: {
fullWeek: false,
},
minEventHeight: "0px",
},
listeners: {
layoutUpdate: "up.onViewLayout",
show({ source: Widget }) {
const { hourHeightSlider } = calendar.widgetMap;
Widget.views?.forEach(subView => {
subView.zoomTo?.(hourHeightSlider.value);
});
}
},
},
dayresource: {
title: "Gruppiert nach Tag",
minEventHeight: "0px",
syncCalendarDate: false,
range: rangeInDays + "d",
listeners: {
layoutUpdate: "up.onViewLayout",
show({ source: Widget }) {
if (calendar) {
const { hourHeightSlider } = calendar.widgetMap;
Widget.zoomTo?.(hourHeightSlider.value);
}
}
},
},
....
onToggleDay({ item, checked }) {
var toggledDayIndex;
switch (item.initialConfig.text) {
case "Montag":
toggledDayIndex = 1;
break;
case "Dienstag":
toggledDayIndex = 2;
break;
case "Mittwoch":
toggledDayIndex = 3;
break;
case "Donnerstag":
toggledDayIndex = 4;
break;
case "Freitag":
toggledDayIndex = 5;
break;
case "Samstag":
toggledDayIndex = 6;
break;
case "Sonntag":
toggledDayIndex = 0;
break;
default:
}
calendar.nonWorkingDays[toggledDayIndex] = !checked;
calendar.views.forEach(v => {
v.nonWorkingDays = calendar.nonWorkingDays;
});
},
...