timeline charts buggy when tab is not on focus

[mef]

The appearing and disappearing bards from the timeline charts do not behave correctly, apparently when the tab looses focus.

Animation to be corrected, otherwise perhaps the solution is to disable them when tab looses focus, then redraw the charts on focus.

To be further investigated.

[mef]

Read also:

• d3.js transition() not working when browser is minimised
• Animations pause when browser tab is not visible

[mef]

The top hashtags / mentions also looks to be suffering from the same problem: opacity fade-in transition does not always happen when the tab is not in focus... related to #100

[mef]

@11digitlabs Would the following logic work?

• If tab is in focus then animate (transition) visualizations
• Else just update the DOM at once, without animation.

If technically feasible, it would allow to use the dashboard in the background / on the side, while working on some other window...

[mef]

bump @11digitlabs

I think your experience with "tab visibility manager" could help here.

[PanosSynetos]

Hey @mef . Sorry for disappearing. I believe that your idea could work, I'll give it a try and let you know

[PanosSynetos]

Mehdi, I'll make a branch for this issue and delete all the lines about transitions/delays and give it a try

I just did a quick one for the last 30 minutes chart, it seems to behave ok, nothing strange, except the fact that the two graphs are not syncronized

On the left is a not focused tab (while I was writing this message) and on the right is the open tab

As you can see, the per second graph is different

[PanosSynetos]

@mef can you please have a look at my commit? I found out that setting delay to 0 is the same as not having a transition at all

EDIT or maybe not... need to check more, setting to 0 didnt help, just found out, damn!

[PanosSynetos]

Just did one more commit with if/else for the transitions. It doesn look optimal, but with the chaining in d3, what else can we do?

Last commit seems to work ok

[mef]

nothing strange, except the fact that the two graphs are not syncronized

On the left is a not focused tab (while I was writing this message) and on the right is the open tab

This must just be a minor side effect, caused by the fact that the two pages have not been loaded exactly at the same time. Each starts aggregating messages per second on its own schedule. There must be the same total on each side (plus or minus the 60 seconds ago count).

[mef]

@11digitlabs I still have issues with the chart on firefox, cf screenshots:

Edit: this happens when tab is marked as active, and another window is opened on top of the browser...

[PanosSynetos]

@mef the scale has double the values? Do you see any other problems? I havent faced this issue neither on FF or Chrome

[PanosSynetos]

Reverting the changes in branch 3.0.0

[PanosSynetos]

Done

[mef]

Should be fixed, problem seemed to be with the id of records, not browser's active / inactive states...

To be more precies: the problem of bars jumping around right after appearing is solved. There is still an issue with some of the bars not getting their full height.

This latter issue is probably caused by the fact that bars have both their y position and height animated at the same time when appearing.

[mef]

animations should behave better now too :)