fix focus() being called too often

This commit is contained in:
Nolan Lawson 2018-03-21 00:53:52 -07:00
parent 60dd2ecff2
commit 7053230ac0
5 changed files with 25 additions and 3 deletions

View File

@ -42,7 +42,8 @@
export default {
oncreate() {
let focusSelector = this.get('focusSelector')
if (this.refs.node && focusSelector) {
if (this.refs.node && focusSelector &&
this.store.getForCurrentTimeline('shouldRestoreFocus')) {
restoreFocus(this.refs.node, focusSelector)
}
},

View File

@ -113,7 +113,8 @@
registerClickDelegate(delegateKey, (e) => this.onClickOrKeydown(e))
}
let focusSelector = this.get('focusSelector')
if (this.refs.node && focusSelector) {
if (this.refs.node && focusSelector &&
this.store.getForCurrentTimeline('shouldRestoreFocus')) {
restoreFocus(this.refs.node, focusSelector)
}
},

View File

@ -177,6 +177,16 @@
},
onScrollTopChanged(scrollTop) {
this.set({scrollTop: scrollTop})
if (!this.get('observedOnScrollTopChanged')) {
// ignore the first scroll top change, e.g.
// because we forced a scroll top change
this.set({observedOnScrollTopChanged: true})
} else {
// after that, don't allow statuses/notifications to call focus()
// after we've already started scrolling. that causes scrolling to
// jump around
this.store.setForCurrentTimeline({shouldRestoreFocus: false})
}
},
onScrollToBottom() {
if (!this.store.get('initialized') ||
@ -233,7 +243,10 @@
},
setupFocus() {
this.onPushState = this.onPushState.bind(this)
this.store.setForCurrentTimeline({ignoreBlurEvents: false})
this.store.setForCurrentTimeline({
ignoreBlurEvents: false,
shouldRestoreFocus: true
})
window.addEventListener('pushState', this.onPushState)
},
teardownFocus() {

View File

@ -18,6 +18,7 @@ export function timelineComputations (store) {
computeForTimeline(store, 'showHeader', false)
computeForTimeline(store, 'shouldShowHeader', false)
computeForTimeline(store, 'timelineItemIdsAreStale', false)
computeForTimeline(store, 'shouldRestoreFocus', false)
store.compute('firstTimelineItemId', ['timelineItemIds'], (timelineItemIds) => {
return timelineItemIds && timelineItemIds[0]

View File

@ -20,6 +20,12 @@ export function timelineMixins (Store) {
return root && root[instanceName] && root[instanceName][timelineName]
}
Store.prototype.getForCurrentTimeline = function (key) {
let instanceName = this.get('currentInstance')
let timelineName = this.get('currentTimeline')
return this.getForTimeline(instanceName, timelineName, key)
}
Store.prototype.getAllTimelineData = function (instanceName, key) {
let root = this.get(`timelineData_${key}`) || {}
return root[instanceName] || {}