Timeline view, sorting events

Hi,
I’m trying to sort events in the timeline view.
For a specified section, I would like to have some events in the 1rst row, other in the 2nd row, and the last in the 3rd.

I use the sort:function(a,b) {} to sort them, but something go wrong, and I don’t know why :confused:

Here is my function :

[code] sort:function(a, b){
if(a.priority == b.priority) {
if (a.start_date.valueOf() == b.start_date.valueOf()) {
if (a._timed && !b._timed) return 1;
if (!a._timed && b._timed) return -1;
return a.id > b.id ? 1 : -1;
}
return a.start_date > b.start_date ? 1 : -1;

		} 
		
	
		else if(a.priority == "1" && b.priority == "2") { return 1; }
		else if(b.priority == "1" && a.priority == "2") { return -1; }

		else if(a.priority == "1" && b.priority == "3") { return 1; }
		else if(b.priority == "1" && a.priority == "3") { return -1; }

		else if(a.priority == "2" && b.priority == "3") { return 1; }
		else if(b.priority == "2" && a.priority == "3") { return -1; }

		}
});[/code]

Sometimes (depending on hour of event I think), there are only 2 row displayed in the section, and events with different priority are on the same row.

In the part you compare priority values, conditions does not covers all possible scenarios. Why don’t you simply use ‘lesser’ or ‘greater’ for comparing numeric values:

[code]sort:function(a, b){
if(a.priority == b.priority) {
if (a.start_date.valueOf() == b.start_date.valueOf()) {
if (a._timed && !b._timed) return 1;
if (!a._timed && b._timed) return -1;
return a.id > b.id ? 1 : -1;
}
return a.start_date > b.start_date ? 1 : -1;

}

if(a.priority*1 < b.priority*1) { 
	return 1; 
}else{
	return -1;
}

}[/code]Also, please note that sort order defines only mutual position of events, i.e. which one will be displayed top-most, which right below it, etc.
This function can’t make event be displayed in 2nd row, leaving the 1st row empty

Hi,
thanks you for your answer :slight_smile:
I used the " (quote sign) to indicate that my ‘priority’ values are strings, I changed them here to simplify, but in fact, they are URL (so they are not ‘sortable’)

As I only have 3 URL possible (let says “http://case1.com”, “http://case2.com” and “http://case3.com” ) , I thought that with 6 elseif cases ( + equality ) , it will be OK ? Did I miss one case ?

I’ll try to change my system to add a integer (instead of strings) to be compared, to test it.

Concerning the “mutual positions” it’s not an issue if the second row go in the 1rst row, if there is no 1rst row. But, maybe my intial issue is related to this ?

Sorry, it’s my mistake, it really gives six combinations.
Probably the more readable and maintainable way for specifying the order of urls (in case you’ll have to add fourth or fifth url at some point) would be to assign some ‘weight’ value to each url, and use these values for sorting. E.g.:

[code]function weight(url){
var weights = {
“url1”:3,
“url2”:2,
“url3”:1
};
if(!weights[url]){
alert("unknown url "+ url);
}
return weights[url];
}

sort = function(a, b){
if(weight(a.url) == weight(b.url)) {
if (a.start_date.valueOf() == b.start_date.valueOf()) {
if (a._timed && !b._timed) return 1;
if (!a._timed && b._timed) return -1;
return a.id > b.id ? 1 : -1;
}
return a.start_date.valueOf() > b.start_date.valueOf() ? 1 : -1;

}else{
	return weight(a.url) > weight(b.url) ? 1 : -1;
}

}[/code]

Regarding the original issue,

Can you clarify what exactly do you mean? For example, in this demo
docs.dhtmlx.com/scheduler/sample … lines.html

Events in ‘David Miller’ section are expected to be displayed in the same row, even if they would have different sorting order.
Order could be applied only for stacked events, like first three tasks in ‘James Smith’ section.
Is this a scenario you describe?

Thanks for your exemple to add ‘weight’ to values :wink:

In fact, I want to have a mecanism of sub-sections (and ATM, I emulated it with the sort function (as I didn’t found anything else))

I’ll open my ‘test environment’ (home web-server) this evening, in order you see what I want (and see all source-code, if needed)

Sorry, I wasn’t able to reproduce the issue, as all data that I want to be displayed are grabbed dynamically form other sources.
I’ll try to take a snapshot of these data, when the bug will occurs. (data may/will change every hours)

Ok, I got a buggy data :

Here are the data : potato.renaud-goud.fr/includes/events.php
And here the webpage : potato.renaud-goud.fr/day.php

For exemple, these 2 events are doing shit :

{ start_date: "2014-05-17 10:00:00", end_date: "2014-05-17 14:00:00", text:"Le PindéJeuner sur Dark Souls II", section_id:"gamingroom" , caster:"Pinde" , url:"http://www.gamingroom.tv/JeuxVideo" , fullscreenurl:"http://www.dailymotion.com/swf/video/x11k3lm?autoplay=1&hidePopoutButton=1"}

{ start_date: "2014-05-17 06:38:00", end_date: "2014-05-17 11:27:00", text:"[Rediff] Road to Diamond 1 ! Ep1", section_id:"gamingroom" , caster:"Chutlus" , url:"http://www.gamingroom.tv/LeagueofLegends" , fullscreenurl:"http://www.dailymotion.com/swf/video/x1lkmfd?autoplay=1&hidePopoutButton=1"}

PS : I remove all other sections, for the debug process :wink:

I try to clean the data (remove entry that are not related to the issue, order by start-date :

[ { start_date: "2014-05-18 10:00:00", end_date: "2014-05-18 14:00:00", text:"Le PindéJeuner sur Dark Souls II", section_id:"gamingroom" , caster:"Pinde" , url:"http://www.gamingroom.tv/JeuxVideo" , fullscreenurl:"http://www.dailymotion.com/swf/video/x11k3lm?autoplay=1&hidePopoutButton=1"}, { start_date: "2014-05-18 11:12:00", end_date: "2014-05-18 12:59:00", text:"[Rediff] PvP entre amis", section_id:"gamingroom" , caster:"Fukano" , url:"http://www.gamingroom.tv/Minecraft" , fullscreenurl:"http://www.dailymotion.com/swf/video/x1lkmd2?autoplay=1&hidePopoutButton=1"}, { start_date: "2014-05-18 11:28:00", end_date: "2014-05-18 13:59:00", text:"[Rediff] League of Noobs", section_id:"gamingroom" , caster:"Zedrikx_" , url:"http://www.gamingroom.tv/LeagueofLegends" , fullscreenurl:"http://www.dailymotion.com/swf/video/x1lkmfd?autoplay=1&hidePopoutButton=1"}, { start_date: "2014-05-18 20:00:00", end_date: "2014-05-18 22:00:00", text:"Dedey en multi sur EuroTruck Simulator 2", section_id:"gamingroom" , caster:"MrElvilia" , url:"http://www.gamingroom.tv/JeuxVideo" , fullscreenurl:"http://www.dailymotion.com/swf/video/x11k3lm?autoplay=1&hidePopoutButton=1"} ]
And there is still the bug :confused:

Hi,
it’s hard to tell for sure, but probably the sorting function is causing the problem.
At least if I reinitialize timeline from a console without specifying sort function, events do not overlap:[code]scheduler.createTimelineView({
name: “timeline”,
x_unit: “minute”,
x_date: “%H:%i”,
x_step: 60,
x_size: 24,
x_start: 6,
x_length: 2,
y_unit: init_sections(),
y_property: “section_id”,
render:“bar”,
section_autoheight: false,
dy:40,
dx:60

});

scheduler.setCurrentView(new Date(2014, 4, 18));[/code]
Try to rewrite sort function in a more readable way, and probably the issue will be fixed. Currently due to the amount of if-else with different order of ‘a’ and ‘b’ parameters, it’s hard to tell what function will return in every particular case. Maybe there is a combination of inputs when function behaves incorrectly

I switch to a better sort (with a real index), but there is still the issue :confused:

The datas : potato.renaud-goud.fr/includes/events.php
The scheduler : potato.renaud-goud.fr/day.php
The sort function :

sort:function(a, b){ if(a.idTV == b.idTV) { if (a.start_date.valueOf() == b.start_date.valueOf()) { if (a._timed && !b._timed) return 1; if (!a._timed && b._timed) return -1; return a.id > b.id ? 1 : -1; } return a.start_date.valueOf() > b.start_date.valueOf() ? 1 : -1; }else{ return a.idTV*1 > b.idTV*1 ? 1 : -1; } }

(date to 2014-05-31 if you need to reproduce)

I still got the issue, randomly
Here is an exemple (date and data are permanant, for debugging purpose):
Calendar : potato.renaud-goud.fr/day.php
Datas : potato.renaud-goud.fr/includes/events2.php
So, there are 4 events to display, but the Timeline put the 4th one over the 2nd one, makeing the 2nd one invisible whereas they got different idTV

Sort function :

sort:function(a, b){ if(a.idTV == b.idTV) { } return 0; //a.start_date.valueOf() > b.start_date.valueOf() ? 1 : -1; }else{ return a.idTV*1 > b.idTV*1 ? 1 : -1; } }

Hi! We have just bought a commercial license and have a similar problem. The goal is to sort by ‘order’ if within same timespan.
My main question is why is never event 02 and 05 compared?
See the output from this logging
sort: function (a, b) {
console.log('a: ’ + a.order + ’ - ’ + 'b: ’ + b.order);

booking.js:860 a: 2 - b: 3
booking.js:860 a: 3 - b: 4
booking.js:860 a: 4 - b: 5
booking.js:860 a: 5 - b: 1
booking.js:860 a: 4 - b: 1
booking.js:860 a: 3 - b: 1
booking.js:860 a: 2 - b: 1
booking.js:860 a: 2 - b: 3
booking.js:860 a: 3 - b: 4
booking.js:860 a: 4 - b: 5
booking.js:860 a: 5 - b: 1
booking.js:860 a: 4 - b: 1
booking.js:860 a: 3 - b: 1
booking.js:860 a: 2 - b: 1
booking.js:860 a: 2 - b: 3
booking.js:860 a: 3 - b: 4
booking.js:860 a: 4 - b: 5
booking.js:860 a: 5 - b: 1
booking.js:860 a: 4 - b: 1
booking.js:860 a: 3 - b: 1
booking.js:860 a: 2 - b: 1

Look at the attached image how it looks here.
As long as they are never compared my sorting logic will never be used.

It is always event number 2 and higher in “column 2” which overlap neighbor event in “column 1” in stead of pushing them down and squeeze between

Hope for some help in understanding this. Thanks!

Regards,
Oddvin


For reference I paste the entire sorting function:
sort: function (a, b) {
console.log('a: ’ + a.order + ’ - ’ + 'b: ’ + b.order);

        var aa = new Date(a.start_date);
        var bb = new Date(b.start_date);

        var as = a.start_date.valueOf();    // event a start_date
        var ae = a.end_date.valueOf();      // event a end_date
        var ao = parseInt(a.order);         // event a order
        var bs = b.start_date.valueOf();    // event b start_date
        var be = b.end_date.valueOf();      // event b end_date
        var bo = parseInt(b.order);         // event b order

        if (aa.setHours(0, 0, 0, 0) == bb.setHours(0, 0, 0, 0)) {       // on same day
            if (
                (as > be && as < be && ao > bo) ||          // Don't ask :wink:
                (bs > as && bs < ae && bo > ao) ||
                (as == bs || ae == be) ||
                (as < bs && ae > bs && ao < bo) ||
                (bs < as && be > as && bo < ao) ||
                (as < bs && ae > be) ||
                (bs < as && be > ae) ||
                (as < bs && ae < be && ae > bs) ||
                (bs < as && be < ae && be > as)
                ) {
                return ao > bo ? 1 : -1;
            }
        }
        return as > bs ? 1 : -1;
    }
});


Hi,

My main question is why is never event 02 and 05 compared?

This is up to the sorting algorithm that is used for array.sort in browser, not all of them compare everything-to-everything.
What timeline does, is sorts an array or events providing your function as a compare function
developer.mozilla.org/en-US/doc … Array/sort
What happens in there and in which order elements are compared is out of our control.

The problem may occur, if your compare function is not transitive - by transitivity here i mean that
if:
a > b
and:
b > c
then following should be also true:
a > c

some detailed explanation here cs.stackexchange.com/questions/1 … -algorithm

Although, from the look of function is hard to tell whether this or something else is causing the issue