diff options
author | ThibG <thib@sitedethib.com> | 2019-05-03 06:20:36 +0200 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2019-05-03 06:20:35 +0200 |
commit | 5121d9c12f39e95eaef630dd6c98b736cb76c4c0 (patch) | |
tree | 3496166b8fa1755392e008900fe80a84b7bedfb1 /app/javascript/mastodon/features/direct_timeline/components/conversations_list.js | |
parent | 05ef3462ba0af7b147a7cfa8de2735e99dc59ac5 (diff) |
When selecting a toot via keyboard, ensure it is scrolled into view (#10593)
Diffstat (limited to 'app/javascript/mastodon/features/direct_timeline/components/conversations_list.js')
-rw-r--r-- | app/javascript/mastodon/features/direct_timeline/components/conversations_list.js | 14 |
1 files changed, 10 insertions, 4 deletions
diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversations_list.js b/app/javascript/mastodon/features/direct_timeline/components/conversations_list.js index 635c03c1d..8867bbd73 100644 --- a/app/javascript/mastodon/features/direct_timeline/components/conversations_list.js +++ b/app/javascript/mastodon/features/direct_timeline/components/conversations_list.js @@ -20,18 +20,24 @@ export default class ConversationsList extends ImmutablePureComponent { handleMoveUp = id => { const elementIndex = this.getCurrentIndex(id) - 1; - this._selectChild(elementIndex); + this._selectChild(elementIndex, true); } handleMoveDown = id => { const elementIndex = this.getCurrentIndex(id) + 1; - this._selectChild(elementIndex); + this._selectChild(elementIndex, false); } - _selectChild (index) { - const element = this.node.node.querySelector(`article:nth-of-type(${index + 1}) .focusable`); + _selectChild (index, align_top) { + const container = this.node.node; + const element = container.querySelector(`article:nth-of-type(${index + 1}) .focusable`); if (element) { + if (align_top && container.scrollTop > element.offsetTop) { + element.scrollIntoView(true); + } else if (!align_top && container.scrollTop + container.clientHeight < element.offsetTop + element.offsetHeight) { + element.scrollIntoView(false); + } element.focus(); } } |