Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Jul 29, 2019. It is now read-only.

Vertical Focus - Bugfix on Final Vertical Scroll Position #3508

Merged
merged 1 commit into from
Oct 1, 2017
Merged

Vertical Focus - Bugfix on Final Vertical Scroll Position #3508

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 19 additions & 13 deletions lib/timeline/Timeline.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -428,32 +428,38 @@ Timeline.prototype.focus = function(id, options) {
}
};

// Perform one last check at the end to make sure the final vertical
// position is correct
var finalVerticalCallback = function() {
// Enforces the final vertical scroll position
var setFinalVerticalPosition = function() {
var finalVerticalScroll = getItemVerticalScroll(me, item);

if(finalVerticalScroll.shouldScroll && finalVerticalScroll.itemTop != initialVerticalScroll.itemTop) {
if (finalVerticalScroll.shouldScroll && finalVerticalScroll.itemTop != initialVerticalScroll.itemTop) {
me._setScrollTop(-finalVerticalScroll.scrollOffset);
me._redraw();
me._redraw();
}
};

// Perform one last check at the end to make sure the final vertical
// position is correct
var finalVerticalCallback = function() {
// Double check we ended at the proper scroll position
setFinalVerticalPosition();

// Let the redraw settle and finalize the position.
setTimeout(setFinalVerticalPosition, 100);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Try requestFrameAnimation instead of setTimeout

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think that will accomplish what I'm trying to do here. The core issue that I noticed is the timeline resizes groups as you scroll horizontally, and if that resize happens just after the vertical scroll finishes then the "final" position the user sees is not the item that they asked to have focused. I don't have an event I can hook into for that at the moment, so the best I've got is a small delay after the vertical scroll has finished to essentially do a "double check". requestAnimationFrame would likely call this too soon, which is why I chose setTimeout. If you have a suggestion for an event or something else I could check that would be more reliable I'll gladly use that.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mmm Not really. I'll approve it for now. I'l think about it more though.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm wanting to try and do some tracing of the various events that are being emitted so I can understand where and when the recalculations come from post-focus. If I find something l'll let you know.

};

// calculate the new middle and interval for the window
var middle = (start + end) / 2;
var interval = Math.max((this.range.end - this.range.start), (end - start) * 1.1);
var interval = Math.max(this.range.end - this.range.start, (end - start) * 1.1);

var animation = (options && options.animation !== undefined) ? options.animation : true;
var animation = options && options.animation !== undefined ? options.animation : true;

if(!animation) {
if (!animation) {
// We aren't animating so set a default so that the final callback forces the vertical location
initialVerticalScroll = {shouldScroll: false, scrollOffset: -1, itemTop: -1};
initialVerticalScroll = { shouldScroll: false, scrollOffset: -1, itemTop: -1 };
}

this.range.setRange(middle - interval / 2, middle + interval / 2, { animation: animation }, finalVerticalCallback, verticalAnimationFrame);

// Let the redraw settle and finalize the position
setTimeout(finalVerticalCallback, 100);
this.range.setRange(middle - interval / 2, middle + interval / 2, { animation: animation }, finalVerticalCallback, verticalAnimationFrame);
}
};

Expand Down