Timeline - Horizontal - Reverse Chronological order from the Oldest to Newest (Left to Right)

[Vinicius]

I would like to sort the timeline through the date field, in descending order, meaning that the first item to be displayed is the most recent date.
I used this way:
sort: {
    field: "EventDate", dir: "desc"
}
 
This works, but I wouldn't want the timeline to be displayed as it is now, with the most recent date being the first item from Left to Right (from newest to oldest). See Sreenshot_1.png
Because this creates a feeling that as I go forward in the timeline, instead of going "forward" in time, I am going backwards. It should be the opposite, when I click on "previous", I navigate backwards in the timeline, I go to an older date and not a newer date.

Given this, I would like to know if there is any way to order the horizontal timeline items descending with a visual behavior where the first item to be displayed is the one most to the right of the timeline (most recent). And when navigating "backwards", clicking on "Previous" I navigate to the oldest items chronologically.

I even tried to force this behavior by ordering ascending and using the open() method as below:
    let timeline = $("#timeline").data().kendoTimeline;
    let firstEvent = timeline.element.find(".k-timeline-track-item:last-child");
    timeline.open(firstEvent);
    timeline.redraw();

But this method generates strange behavior on small screens like mobile devices. When triggering open(), the "Previous" navigation button is disabled and therefore the horizontal timeline is left unnavigated. See Screenshot_2.png

[Georgi Denchev]

Hello, Vinicius,

Thank you for the provided details.

Based on the description of the problem, the correct approach would be to use the open method and navigate to the last event of the timeline(like you have done), without applying any type of sorting to the data. 

I was able to reproduce the problem with the smaller screen and I can confirm that this is indeed a bug. I have logged an item in our Feedback Portal in your name:

https://feedback.telerik.com/kendo-jquery-ui/1532326-timeline-horizontal-calling-open-method-on-a-small-screen-disables-the-navigation-arrows 

As a workaround for now, you can set a min-width to the Timeline element in order to make sure at least 2 items are available at any given time.

Dojo example:

https://dojo.telerik.com/@gdenchev/OVUHAjaY 

Best Regards,
Georgi Denchev
Progress Telerik