Video Sync with Time Line Events on Click

[Michael]

New to using WPF and Telerik, but I have been tasked with trying to find a way to sync Telerik with a video playback.

Our customer has a video of a training sessions and he wants to put that into this program we have for After Action Reviews or AAR.

In this AAR program we have a Telerik Time line that shows at which point in the training certain events took place, and then the specific metrics of that event. Now they want to implement this video into the program so every time they goto the AAR there is a video of the training next to the Telerik Timeline.

What I need to figure out:

* How can I sync up the video and the Telerik timeline, so that if they click to look at a certain event, the Video jumps to the corresponding spot in the video. Or if they move the video slider to say 3min mark, the Telerik timeline ALSO moves to that exact spot.

Thanks

[Petar Marchev]

Hello Michael,

From what I understand you need to find out when a user clicks on an item and do some calculations from there on.

One way to go is to attach a handler to the MouseDown event of the timeline. In the handler you can perform a check to find out whether an item was clicked. This check should be relatively easy, you need to get the DataContext of the e.OriginalSource. If the data context is a TimelineDataItem, this means an item was clicked and you can get the information you need from it:

private void RadTimeline_MouseDown(object sender, MouseButtonEventArgs e)
{
 var source = e.OriginalSource as FrameworkElement;
 if (source == null)
 {
  return;
 }

 var item = source.DataContext as TimelineDataItem;
 if (item == null)
 {
  return;
 }

 var start = item.Start;
}

Another way to go is to use the selection abilities of the timeline (IsSelectionEnabled, SelectionMode). You can attach a handler of the SelectionChanged and get the information you need from the newly selected item.

Both approaches allow you to find the information you would require about an item. Now you can set the video slider.

The other way is even easier. You need to attach a handler to the event that specifies that the user has changed the position of the video slider. In the handler you need to find the start position. You can then decide what you need to do - one way is to set the visible period start and end properties of the timeline.

Let us know if you need more information.

Regards,
Petar Marchev
Telerik