Timeline view not aligned properly

[Nicholas]

Hi

I'm using Scheduler Q1 2008 415.

I'm trying to get the timeline view setup with resources donw the left hand side.  However, the resources don't line up with the main scheduler view.

Example of problem

How can I resolve this.

Thanks

Nick

[Alex Gyoshev]

Hello Nick,

There are two known workarounds for your problem:

• do not allow the name of the resource to wrap on multiple lines; this can be achieved using the following CSS:
  

  div.RadScheduler .rsMonthView .rsHoursTable .rsMainHeader,
  div.RadScheduler .rsMonthView .rsHoursTable .rsMainHeader div,
  div.RadScheduler .rsTimelineView .rsHoursTable .rsMainHeader,
  div.RadScheduler .rsTimelineView .rsHoursTable .rsMainHeader div
  {
      overflow:hidden;
     white-space:nowrap;
      text-overflow: ellipsis;
  }

  
  You could also find it useful to be able to adjust the width of the column that holds the resources' names, which can be done like this (feel free to change the value to whatever you like):
  

  div.RadScheduler .rsColumnHeaderFirstCell div,
  div.RadScheduler .rsColumnHeaderSpacerCell div,
  div.RadScheduler .rsColumnHeaderLastSpacerCell div,
  div.RadScheduler .rsHoursTable th,
  div.RadScheduler .rsHoursTable th div,
  div.RadScheduler .rsMonthView .rsHoursTable .rsMainHeader,
  div.RadScheduler .rsMonthView .rsHoursTable .rsMainHeader div,
  div.RadScheduler .rsAllDayFirstCell div
  {
      width: 150px;
  }

• increase the height of the appointment containers; the necessary style change is as following (the value of 40px could be changed to suit your needs):
  

  * html div.RadScheduler .rsAllDayCell
  {
      height: 40px;
      _height: auto;
  }
  
  * html div.RadScheduler .rsAllDayCell .rsWrap
  {
      height: 100%;
      _height: 40px;
  }
  
  div.RadScheduler .rsAllDayCell .rsWrap,
  div.RadScheduler .rsColumnHeaderFirstCell,
  div.RadScheduler .rsAllDayFirstCell,
  div.RadScheduler .rsHoursTable th
  {
      height: 40px;
  }

Greetings, Alex
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Adam]

Hello. I too am having alignment issues with Timeline view. I waited on the reply to Nick's original inquiry to submit this, but unfortunately the suggestions do not apply to me as my resource labels are NOT wrapping.

As best I can tell, if the appointment data meets the following conditions:

1. an appoinment longer than one time slot and whose end time is beyond the end of the visible grid (right arrow icon displayed in rightmost column)

AND

2. another single-slot appoinment (in the same resource group) in one of the timeslots also occupied by the mutli-slot appoinment.

THEN the layout is thrown off. Specifically, the blank row that seems to be rendered as the last row in each resource group (presumably to allow space to insert new appointments) is displayed as the first row of the next resource group, and all subsequent rows are off by one with the last row of the grid extending one row below the bottom of the last resource name cell.

While I originally discovered this issue in my own code which uses a read-only timeline, I have repro'd the issue on your demo located here:

http://www.telerik.com/DEMOS/ASPNET/Prometheus/Scheduler/Examples/TimelineView/DefaultCS.aspx

To repro using your demo:

1. Insert an appointment that extends beyond the end of the currently visible grid (must use the advanced form to specify an endtime beyond the end of the current grid).
2. Insert another single-slot appointment in any of the cells already occupied by multi-slot appoinment just inserted in #1 above.

a) Is there a workaround for this?

Some additional layout questions:

b) How can I eliminate that extra blank row in each resource group? My timeline is ReadOnly which makes that row useless and I want to conserve vertical real estate used by each resource group.

c) OverflowBehavior=Scroll seems to give me strange results in TimelineView. I get an unneeded AND inactive (disabled, greyed out) vertical scroll bar much longer than the scheduler itself (extending well below the bottom of the scheduler grid), and NO horizontal scroll bar for the timeline in spite of the fact that the timeline is much wider than the browser window.

c) Even with OverflowBehavior=Expand and my timeline is much wider than the browser window, the BROWSER does NOT render a horizontal scroll bar. Why???? How can I fix this? This puts the right side of my timeline off screen with no way to get to it!?!

Please advise. Thank you very much.

Adam

[Alex Gyoshev]

Hi Adam,

Thank you for your feedback.

The first issue that you encountered (and provided a very detailed explanation on how to reproduce it) has been fixed. Please download the newly released SP1 release and the problem should disappear.

Regarding your other issues:

>> b) How can I eliminate that extra blank row in each resource group? My timeline is ReadOnly which makes that row useless and I want to conserve vertical real estate used by each resource group.

Unfortunately, the hiding of these cells isn't possible with the current version of RadScheduler. We have, however, discussed your idea and will probably include it with one of the upcoming releases, probably with Q2.

>> c) OverflowBehavior=Scroll seems to give me strange results in TimelineView. I get an unneeded AND inactive (disabled, greyed out) vertical scroll bar much longer than the scheduler itself (extending well below the bottom of the scheduler grid), and NO horizontal scroll bar for the timeline in spite of the fact that the timeline is much wider than the browser window.

Currently, RadScheduler does not support vertical scrolling; the OverflowBehavior property, therefore, determines only the behavior when the RadScheduler isn't high enough to handle all of its contents.

>> d) Even with OverflowBehavior=Expand and my timeline is much wider than the browser window, the BROWSER does NOT render a horizontal scroll bar. Why???? How can I fix this? This puts the right side of my timeline off screen with no way to get to it!?!

We couldn't reproduce the problem at our side. Could you please open a support ticket and attach a sample solution that demonstrates it, or at least a live url where we can observe it?

Sincerely yours,
Alex
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Adam]

Thank you for your prior responses.

I initially thought that the SP1 release addressed my layout issues as you had suggested.

However, I am now trying to use the Scheduler inside of a DNN module and I now see similar layout issues with the vertial alignment of resource groups with the appointments in those groups.

I have uploaded an example of the rendered output here:

http://64.87.4.22/telerik/Default.aspx.htm

In Firefox the alignment is off enough to matter, and in IE it's even worse (not even close).

Please advise.

Thank you,
Adam

[Alex Gyoshev]

Hi Adam,

The problem is caused by an invalid doctype which causes IE to render the page in quirks mode. We will perform additional tests to develop a work-around, yet the usage of a valid one will allow you to get better results and cross-browser compatibility, and thus, is strongly advised.

Greetings,
Alex
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Adam]

FYI, I have tried setting the doctype to XHTML Strict using the DNN-provided mechanism. This did resolve some other issues I have encountered (like misplaced ToolTip positioning), but does NOT resolve this issue for me.

This issue has been incorporated into my support ticket #140758.