Use the first cell in viewport as the default for j/k navigation (#1054)

This commit is contained in:
Jonatan Kłosko 2022-03-15 11:52:29 +01:00 committed by GitHub
parent 580116ea97
commit e7835c73f2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 2 deletions

View file

@ -12,6 +12,11 @@ export function isEditableElement(element) {
);
}
export function isElementInViewport(element) {
const box = element.getBoundingClientRect();
return box.bottom >= 0 && box.top <= window.innerHeight;
}
export function clamp(n, x, y) {
return Math.min(Math.max(n, x), y);
}

View file

@ -6,6 +6,7 @@ import {
smoothlyScrollToElement,
setFavicon,
cancelEvent,
isElementInViewport,
} from "../lib/utils";
import { getAttributeOrDefault } from "../lib/attribute";
import KeyBuffer from "./key_buffer";
@ -1057,6 +1058,12 @@ function nearbyFocusableId(focusableId, offset) {
const idx = focusableIds.indexOf(focusableId);
if (idx === -1) {
const focusableElInViewport = getFocusableEls().find(isElementInViewport);
if (focusableElInViewport) {
return focusableElInViewport.getAttribute("data-focusable-id");
}
return focusableIds[0];
} else {
const siblingIdx = clamp(idx + offset, 0, focusableIds.length - 1);
@ -1083,9 +1090,12 @@ function getFocusableEl(focusableId) {
return document.querySelector(`[data-focusable-id="${focusableId}"]`);
}
function getFocusableEls() {
return Array.from(document.querySelectorAll(`[data-focusable-id]`));
}
function getFocusableIds() {
const elements = Array.from(document.querySelectorAll(`[data-focusable-id]`));
return elements.map((el) => el.getAttribute("data-focusable-id"));
return getFocusableEls().map((el) => el.getAttribute("data-focusable-id"));
}
function getSectionIdByFocusableId(focusableId) {