I use the calendars in our scheduler-pro-project to mark weekends. I set up the isWorking property to false.
But we want to be able to insert events on weekends. So I switched this property to true. Now the weekends are no longer marked. There is no special style anymore. I also can't style with the cls-property. Is the cls-property only used when isWorking set to false?
calendars : [
{
id : 'weekends',
name : 'Weekends',
intervals : [
{
recurrentStartDate : 'on Sat at 0:00',
recurrentEndDate : 'on Mon at 0:00',
isWorking : false,
cls: 'tt-scheduler-weekend'
} as CalendarIntervalModel
]
}
]
// has no effect...
.tt-scheduler-weekend {
color: red;
}
How to mark weekends and use them as working time?
Attachments
scheduler-weekend-style.PNG (14.01 KiB) Viewed 275 times
What I don't understand is why there is the option to set the param "isWorking" to "true". But which removes the the complete interval. I would assume that I still see the grey area from "recurrentStartDate" to "recurrentEndDate". Or are there still some classes in the dom by which I could manually style the weekends?
Timeranges is way more that I want. I just want to have the subtle indicator for the weekends in the grind and header like when using "isWorking=false"
isWorking flag has been added to make easier add intervals to calendar. Sometimes easier to add working intervals and set the rest of time as non working, sometimes easier to add non-working intervals and have all not specified time as working.
The UI is implemented to grey out only non working intervals after it calculated in current calendar, it doesn't grey out all intervals that added into calendar's intervals array.
If you want only visual effect there is a https://bryntum.com/products/schedulerpro/docs/api/Scheduler/feature/TimeRanges feature exists for this purposes. You can disable header, apply required styling and add recurrency.
Just as @mightym explains, I don't understand the behaviour either. At least my CSS class could be taken so that I can define a style myself for the weekends.