カーソルキーでページを選択するUserScript
トップページで、ページがたくさん並んでいる時、
tab or shift+tabでリンクのフォーカスが移動できる。
これは前後にしか行けないので、矢印キーを使って前後左右に行けるようにする。
code:script.js
(() => {
let onKeyDown = function(e){
// トップページでShiftと矢印キーが押されたときだけ
if (scrapbox.Layout === "list" && e.shiftKey && e.code.substr(0, 5) === "Arrow") {
// OK
} else {
return;
}
function getGridNumber() {
return parseInt(
document.querySelector('div.page-list').offsetWidth / document.querySelector('li.page-list-item').offsetWidth
);
};
const grid = getGridNumber();
const distance = {
ArrowUp: - grid,
ArrowLeft: - 1,
ArrowRight: 1,
ArrowDown: grid
let current = document.activeElement.parentElement;
if (! current.classList.contains("page-list-item")) {
// グリッド選択状態でなければ最初のグリッドを選択
current = document.querySelector('.page-list-item');
} else if (0 < distance) {
// 進行方向(右・下)へ移動
for (let i = 0; i < distance; i++) {
current = current.nextElementSibling;
if (current === null) {
return; // 端っこ
}
}
} else {
// 逆方向(左・上)へ移動
for (let i = 0; i > distance; i--) {
current = current.previousElementSibling;
if (current === null) {
return; // 端っこ
}
}
}
current.children0.focus(); };
document.addEventListener('keydown', onKeyDown);
})();
UserScript.icon