Intersoft Community - WebScheduler - Timeline view - setting the selected dates start time

Timeline view - setting the selected dates start time

neilmc — Wed, 28 Oct 2009 11:10:19 GMT

Thanks very much guys for all of your help on this, I think i've got something that's working for me now thanks to your suggestions. I was struggling with the scollIntoView function as well in the timeline view but the using the scrollLeft on the div does the trick.

The code below works for me in the OnAfterRenderView event without the need for the delay call, not sure why that should be? The only difference between the script i'm using is that i'm selecting the hour cell directly rather than selecting the first hour cell and mulitplying up (but either approach works for me).

function WebScheduler1_OnAfterRenderView(controlId, viewMode) {
            if (viewMode == "Timeline") {
                // Get default hour
                var now = new Date();
                var hour = now.getHours();
                if (hour > 2) {
                    hour = hour - 2 
                };
                
                // Get web schedule object
                var ws = ISGetObject("WebScheduler1");
                // Set selected hour
                ws.ViewSettings.SelectedDate.setHours(hour);
                // Get web schedule table frame
                var frm = ws.GetSchedulerTableFrame();
                
                // Get the scrollable div
                var sdiv = frm.children[0].children[1].children[0].children[0].children[0].children[1].children[1].children[0];
                // Select hour cell
                var cell = frm.rows[1].children[0].children[0].children[0].rows[0].children[1].children[0].children[0].children[1].rows[1].cells[hour];
                
                // Scroll
                if (sdiv != null && cell != null) {
                    sdiv.scrollLeft = cell.offsetLeft;
                }
            }
        }

Thanks again for your help with this

Neil

Timeline view - setting the selected dates start time

David — Wed, 28 Oct 2009 10:22:25 GMT

So that is what I was missing. So now wanting to do the same thing, I tried playing around with moving the Timeline view around. Not as easy, but I found that this works for me:

function WebScheduler1_OnAfterRenderView(controlId, viewMode) {
   var ws = ISGetObject("WebScheduler1");
   ws.ViewSettings.SelectedDate.setHours(8);
   var frm = ws.GetSchedulerTableFrame();

   if (viewMode == "Day" || viewMode == "Week") {
       var row = frm.rows[2].children[0].children[0].children[0].rows[16];
       row.scrollIntoView();
   } else if (viewMode == "Timeline") {
       window.setTimeout("scrollview()", 10);
   }
}
function scrollview() {
   var ws = ISGetObject("WebScheduler1");
   var frm = ws.GetSchedulerTableFrame();
   
   //this is the scrollable div
   var sdiv = frm.children[0].children[1].children[0].children[0].children[0].children[1].children[1].children[0];
  
   //grab the first cell in the table
   var cel = frm.children[0].children[1].children[0].children[0].children[0].children[1].children[1].children[0].children[0].children[1].children[0].cells[0];
  
   //based on the first cells width, multiply by the number of hours to scroll to the right (assuming the first cell is t0000)
   sdiv.scrollLeft = (cel.offsetWidth * 8);
}

I found I could not use the same scollIntoView function for some reason. And I also found I had to delay setting the scrollLeft as it would not work right in the OnAfterRender... I would like to know if there is a better way to do this of course. The only bad part about this it is scrolls every time the user changes their view. If they change to Week and back to Timeline, they are no longer at the same point they were before. Some changes to this could correct for that though.

Timeline view - setting the selected dates start time

Glayaar — Tue, 27 Oct 2009 06:21:43 GMT

David workaround works, however for the initial load you will need to set the ViewSettings SelectedDate time to the hour you wish to show first, for example:

ws.ViewSettings.SelectedDate.setHours(8);

So the new snippet, based on David's code, will be:

function WebScheduler1_OnAfterRenderView(controlId, viewMode) {
    if (viewMode == "Day" || viewMode == "Week") {
        var ws = ISGetObject("WebScheduler1");
        ws.ViewSettings.SelectedDate.setHours(8);
        var frm = ws.GetSchedulerTableFrame();
        var row = frm.rows[2].children[0].children[0].children[0].rows[17];
        row.scrollIntoView();
    }
}

Timeline view - setting the selected dates start time

David — Fri, 23 Oct 2009 16:49:11 GMT

Here is what I did for the Day and Week view, but it does not work on the initial load - only after the user switches view or you/they click the same view button again...

function WebScheduler1_OnAfterRenderView(controlId, viewMode) {
   if (viewMode == "Day" || viewMode == "Week") {
      var ws = ISGetObject("WebScheduler1");
      var frm = ws.GetSchedulerTableFrame();
      var row = frm.rows[2].children[0].children[0].children[0].rows[16];
      row.scrollIntoView();
   }
}

It took a bit of trial and error and exploring a watch variable to figure out the path, but the rows element at the end is split into 48 parts (one for each half hour). So 16 is 8:00 AM which is what I wanted at the top. There may be an easier way to do it and I would like to know what it is, but that works for me in my case. I would also like to know how to make it work on the initial load. It seems as if the control is not displayed yet and therefore the scrollIntoView call does not take effect.

Good Luck,
David

Timeline view - setting the selected dates start time

neilmc — Thu, 22 Oct 2009 10:55:03 GMT

Hi,

I'm using the webscheduler in timeline dayhourly view, I have the full 24 hour period showing by setting the start and end times to be "t0000" and "t2300".

What i need to happen is for the display to start at (or scroll to) a specified hour of a day but i can't see a way of doing this. For example i'd like to specify that the view could default to say: 2009-10-22 @13:00, therefore 13:00 column would be first in the timeline, followed by the remaining hours of that day, then all subsequent days should show the full 24 hours.

I've tried using the SelectedDate property but the hour/minute portion is ignored.

Any suggestions greatly appreaciated!

Thanks