monorail
/
mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

When selecting a toot via keyboard, ensure it is scrolled into view 

Fixes detailed status column
This commit is contained in:
Thibaut Girka 2019-04-29 20:10:44 +02:00 committed by ThibG
parent 3e095cab83
commit d4c95e6a8a
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
app/javascript/flavours/glitch/features/status/index.js
View File

@ -344,15 +344,15 @@ export default class Status extends ImmutablePureComponent {
const { status, ancestorsIds, descendantsIds } = this.props; const { status, ancestorsIds, descendantsIds } = this.props;
if (id === status.get('id')) { if (id === status.get('id')) {
this._selectChild(ancestorsIds.size - 1); this._selectChild(ancestorsIds.size - 1, true);
} else { } else {
let index = ancestorsIds.indexOf(id); let index = ancestorsIds.indexOf(id);
if (index === -1) { if (index === -1) {
index = descendantsIds.indexOf(id); index = descendantsIds.indexOf(id);
this._selectChild(ancestorsIds.size + index); this._selectChild(ancestorsIds.size + index, true);
} else { } else {
this._selectChild(index - 1); this._selectChild(index - 1, true);
} }
} }
} }
@ -361,23 +361,29 @@ export default class Status extends ImmutablePureComponent {
const { status, ancestorsIds, descendantsIds } = this.props; const { status, ancestorsIds, descendantsIds } = this.props;
if (id === status.get('id')) { if (id === status.get('id')) {
this._selectChild(ancestorsIds.size + 1); this._selectChild(ancestorsIds.size + 1, false);
} else { } else {
let index = ancestorsIds.indexOf(id); let index = ancestorsIds.indexOf(id);
if (index === -1) { if (index === -1) {
index = descendantsIds.indexOf(id); index = descendantsIds.indexOf(id);
this._selectChild(ancestorsIds.size + index + 2); this._selectChild(ancestorsIds.size + index + 2, false);
} else { } else {
this._selectChild(index + 1); this._selectChild(index + 1, false);
} }
} }
} }
_selectChild (index) { _selectChild (index, align_top) {
const element = this.node.querySelectorAll('.focusable')[index]; const container = this.node;
const element = container.querySelectorAll('.focusable')[index];
if (element) { 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(); element.focus();
} }
} }