This is a migrated thread and some comments may be shown as answers.

Overnight view highlight Midnight

5 Answers 68 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Jon
Top achievements
Rank 1
Jon asked on 20 Jun 2018, 11:00 AM

Hi, the latest feature to allow an overnight view is great and I have used it for shift working from 7PM to 7AM. 

Is there a way to highlight the midnight timeline and make it bolder/ different colour.. similar to the attached visual (albeit with a straighter line :) )

5 Answers, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 22 Jun 2018, 07:13 AM

Hi Jon,

The Scheduler does not expose a configuration option that would allow you to force it displaying the midnight line. Nevertheless, you could apply a CSS rule in order to make the border of the respective cell more visible. Here you could find a small sample demonstrating that. You will notice that the CSS used in this case is the following:

#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(1) > div > table > tbody > tr:nth-child(11) > th,
#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(1) > div > table > tbody > tr:nth-child(36) > th,
#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(1) > div > table > tbody > tr:nth-child(61) > th,
#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(2) > div > table > tbody > tr:nth-child(11) > td,
#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(2) > div > table > tbody > tr:nth-child(36) > td,
#scheduler > table > tbody > tr:nth-child(2) > td:nth-child(2) > div > table > tbody > tr:nth-child(61) > td {
  border-bottom: 3px solid red;
}

Note, that you will need to adjust the above rule according to your specific scenario.

Regards,

Veselin Tsvetanov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jon
Top achievements
Rank 1
answered on 22 Jun 2018, 10:29 AM

Veselin, 

Many thanks.... unfortunately, I use the scheduler in a very dynamic way. I have two dropdowns where a team and team member(s) can be selected. So dependant on these selections there would be a need for one or more lines to be highlighted. I suppose I could determine what the max number would be necessary and create the css rules. As I understand if it can't find it, it will be ignored.

I would recommend that for a future update some form of configuration is allowed as I'm sure it would be very useful.

Many Thanks

0
Veselin Tsvetanov
Telerik team
answered on 22 Jun 2018, 01:08 PM
Hi Jon,

Applying the CSS rule when the Scheduler view is dependent on dynamic values may not be the best approach. As you have suggested, you could define the CSS rule for the maximum number of resources that could be loaded. Also, you are right that the CSS selectors, which do not find the corresponding elements on the page would be simply disregarded.

As per the feature, I would suggest you to log your idea as on our Feedback portal. I believe, that many developers would find it useful. Based on the support it receives from the community, we will decide on whether to proceed with its implementation.

Regards,
Veselin Tsvetanov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jon
Top achievements
Rank 1
answered on 28 Jun 2018, 08:24 AM

Hi Veselin,

I have everything working regarding the highlighting. I've gone the route of creating a style rule for 10 recourses as this is the max members per team. Unfortunately this has all been in vein as the overnight view only seems to work in timeline views... Day, Week, WorkWeek which are the views I wanted to use will not render the events. The Demo example only has Timeline and TimelineWeek showing.

Can I get my events rendered on the Day, Week and WorkWeek Views?

0
Veselin Tsvetanov
Telerik team
answered on 02 Jul 2018, 07:41 AM
Hello Jon,

I am afraid that currently, only the Timeline view of the Scheduler offers the overnight functionality discussed. The Day, Week and WorkWeek views would always render their layout from 00:00 to 00:00. You could still render overnight events on those views. Nevertheless, such event will be split in two different days on the view.

Providing the overnight functionality for the day, week and workWeek views may be a helpful feature of the widget. Therefore, I would suggest you to log that idea on the Feedback portal too.

Regards,
Veselin Tsvetanov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Scheduler
Asked by
Jon
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Jon
Top achievements
Rank 1
Share this question
or