PCのブラウザでアルファポリス小説を読む人向けのキーボードでページめくりできるスクリプト

PCのブラウザで小説を読む人向けのキーボードでページめくりできるスクリプト

アルファポリスで小説を読むとき、前の話や次の話を見るには画面の先頭や末尾までスクロールしてクリックする必要があります。

これをいつでもワンキーでできるようにする魔法をこれから紹介します。

① Google Chrome や Firefox などのブラウザをお使いの方は、まず最初にスクリプト実行できる拡張機能を選んで有効にしてください。
JavaScript を inject 実行できる拡張機能ならなんでもよいです。
Chrome では Script Injector や Script Runner Pro など、Firefox なら run-a-script や Injector などといったものが無数にあります。
使いやすく信頼できるものを選んでください。

② 次に以下のスクリプトをコピペして必要なサイトで自動で読み込むように設定してください。

ページめくりスクリプト
///////////////////////////////////////////////////ここから
(() => {
  "use strict";
  const list = [
    { url: 'kakuyomu.jp/works/',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'query',
      link: 'link[rel="prev"]',
    },
    { url: 'kakuyomu.jp/works/',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'query',
      link: 'link[rel="prev"]',
    },
    { url: 'kakuyomu.jp/works/',
      code: 'ArrowRight',
      modifiers: '',
      type: 'query',
      link: 'link[rel="next"]',
    },
    { url: 'kakuyomu.jp/works/',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'query',
      link: 'link[rel="next"]',
    },
    { url: 'kakuyomu.jp/works/',
      code: 'Enter',
      modifiers: '',
      type: 'a',
      link: '続きから読む',
    },
    { url: 'kakuyomu.jp/works/',
      code: 'NumpadEnter',
      modifiers: '',
      type: 'a',
      link: '続きから読む',
    },
    { url: 'https://kakuyomu.jp/my/antenna/works',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'a',
      link: '前へ',
    },
    { url: 'https://kakuyomu.jp/my/antenna/works',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'a',
      link: '前へ',
    },
    { url: 'https://kakuyomu.jp/my/antenna/works',
      code: 'ArrowRight',
      modifiers: '',
      type: 'a',
      link: '次へ',
    },
    { url: 'https://kakuyomu.jp/my/antenna/works',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'a',
      link: '次へ',
    },
    { url: 'kakuyomu.jp/',
      code: 'BracketLeft',
      modifiers: '',
      type: 'url',
      link: 'https://kakuyomu.jp/my',
    },
    { url: 'kakuyomu.jp/',
      code: 'Numpad3',
      modifiers: '',
      type: 'url',
      link: 'https://kakuyomu.jp/my',
    },
    { url: 'kakuyomu.jp/',
      code: 'BracketRight',
      modifiers: '',
      type: 'url',
      link: 'https://kakuyomu.jp/my/antenna/works',
    },
    { url: 'kakuyomu.jp/',
      code: 'Numpad2',
      modifiers: '',
      type: 'url',
      link: 'https://kakuyomu.jp/my/antenna/works',
    },
    { url: 'syosetu.com/',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'query',
      link: 'a.c-pager__item--before',
    },
    { url: 'syosetu.com/',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'query',
      link: 'a.c-pager__item--before',
    },
    { url: 'syosetu.com/',
      code: 'ArrowRight',
      modifiers: '',
      type: 'query',
      link: 'a.c-pager__item--next',
    },
    { url: 'syosetu.com/',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'query',
      link: 'a.c-pager__item--next',
    },
    { url: 'syosetu.com/favnovelmain',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'query',
      link: 'a.c-up-pager__item[title*="前"]',
    },
    { url: 'syosetu.com/favnovelmain',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'query',
      link: 'a.c-up-pager__item[title*="前"]',
    },
    { url: 'syosetu.com/favnovelmain',
      code: 'ArrowRight',
      modifiers: '',
      type: 'query',
      link: 'a.c-up-pager__item[title*="次"]',
    },
    { url: 'syosetu.com/favnovelmain',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'query',
      link: 'a.c-up-pager__item[title*="次"]',
    },
    { url: 'syosetu.com/impression/',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'query',
      link: 'a[title="前のページ"]',
    },
    { url: 'syosetu.com/impression/',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'query',
      link: 'a[title="前のページ"]',
    },
    { url: 'syosetu.com/impression/',
      code: 'ArrowRight',
      modifiers: '',
      type: 'query',
      link: 'a[title="次のページ"]',
    },
    { url: 'syosetu.com/impression/',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'query',
      link: 'a[title="次のページ"]',
    },
    { url: 'syosetu.com/impression/',
      code: 'ArrowLeft',
      modifiers: '+',
      type: 'dec',
      re: '\/no\/(\\d+)\/.*',
      str: '/no/$$/',
    },
    { url: 'syosetu.com/impression/',
      code: 'NumpadSubtract',
      modifiers: '+',
      type: 'dec',
      re: '\/no\/(\\d+)\/.*',
      str: '/no/$$/',
    },
    { url: 'syosetu.com/impression/',
      code: 'ArrowRight',
      modifiers: '+',
      type: 'inc',
      re: '\/no\/(\\d+)\/.*',
      str: '/no/$$/',
    },
    { url: 'syosetu.com/impression/',
      code: 'NumpadAdd',
      modifiers: '+',
      type: 'inc',
      re: '\/no\/(\\d+)\/.*',
      str: '/no/$$/',
    },
    { url: 'syosetu.com/',
      code: 'Enter',
      modifiers: '',
      type: 'query',
      link: 'div.p-novel__bookmarker-no > a',
    },
    { url: 'syosetu.com/',
      code: 'NumpadEnter',
      modifiers: '',
      type: 'query',
      link: 'div.p-novel__bookmarker-no > a',
    },
    { url: 'syosetu.com/',
      code: 'Enter',
      modifiers: '',
      type: 'queryclick',
      link: 'input[name*="siori_url"]',
    },
    { url: 'syosetu.com/',
      code: 'NumpadEnter',
      modifiers: '',
      type: 'queryclick',
      link: 'input[name*="siori_url"]',
    },
    { url: 'syosetu.com/',
      code: 'BracketLeft',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/user/top/',
    },
    { url: 'syosetu.com/',
      code: 'Numpad3',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/user/top/',
    },
    { url: 'syosetu.com/',
      code: 'BracketLeft',
      modifiers: '+',
      type: 'url',
      link: 'https://syosetu.com/xuser/top/',
    },
    { url: 'syosetu.com/',
      code: 'Numpad6',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/xuser/top/',
    },
    { url: 'syosetu.com/',
      code: 'BracketRight',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/favnovelmain/list/',
    },
    { url: 'syosetu.com/',
      code: 'Numpad2',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/favnovelmain/list/',
    },
    { url: 'syosetu.com/',
      code: 'BracketRight',
      modifiers: '+',
      type: 'url',
      link: 'https://syosetu.com/favnovelmain18/list/',
    },
    { url: 'syosetu.com/',
      code: 'Numpad5',
      modifiers: '',
      type: 'url',
      link: 'https://syosetu.com/favnovelmain18/list/',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'ArrowLeft',
      modifiers: '',
      type: 'a',
      link: '前の話',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'NumpadSubtract',
      modifiers: '',
      type: 'a',
      link: '前の話',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'ArrowRight',
      modifiers: '',
      type: 'a',
      link: '次の話',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'NumpadAdd',
      modifiers: '',
      type: 'a',
      link: '次の話',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'Enter',
      modifiers: '',
      type: 'a',
      link: '続きから読む',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'NumpadEnter',
      modifiers: '',
      type: 'a',
      link: '続きから読む',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'Enter',
      modifiers: '',
      type: 'queryclick',
      link: 'span.bookmark.enabled',
    },
    { url: 'www.alphapolis.co.jp/novel/',
      code: 'NumpadEnter',
      modifiers: '',
      type: 'queryclick',
      link: 'span.bookmark.enabled',
    },
    { url: 'www.alphapolis.co.jp/',
      code: 'BracketLeft',
      modifiers: '',
      type: 'url',
      link: 'https://www.alphapolis.co.jp/mypage/content',
    },
    { url: 'www.alphapolis.co.jp/',
      code: 'Numpad3',
      modifiers: '',
      type: 'url',
      link: 'https://www.alphapolis.co.jp/mypage/content',
    },
    { url: 'www.alphapolis.co.jp/',
      code: 'BracketRight',
      modifiers: '',
      type: 'url',
      link: 'https://www.alphapolis.co.jp/mypage/favorite',
    },
    { url: 'www.alphapolis.co.jp/',
      code: 'Numpad2',
      modifiers: '',
      type: 'url',
      link: 'https://www.alphapolis.co.jp/mypage/favorite',
    },
  ];
  const excludeList = [
    ['kakuyomu.jp/my/works/', 'new'],
    ['kakuyomu.jp/my/works/', 'edit'],
    ['kakuyomu.jp/my/works/', 'episodes'],
    ['syosetu.com/user', 'input'],
    ['www.alphapolis.co.jp/mypage/novel/save'],
    ['x.com'],
  ];
  function eKeyHandler(e) {
    switch (e.target.tagName.toLowerCase()) {
    case 'input':
    case 'textarea':
    case 'select':
      // disable while input
      return;
    }
    let url = location.href;
    for (let i=excludeList.length-1; i>=0; i--) {
      let l = excludeList[i];
      let r = true;
      for (let j=l.length-1; j>=0; j--) {
        if (!url.includes(l[j])) { r = false; break; }
      }
      if (r) return;
    }
    if (e.code == 'Escape') {
      let msg = document.getElementById('_msgFrame');
      if (msg != null) {
        document.body.removeChild(msg);
      }
      return;
    }
    let found = false;
    for (let i=list.length-1; i>=0; i--) {
      let l = list[i];
      if (url.includes(l.url)
       && l.code == e.code
       && l.modifiers.includes('+') == e.shiftKey
       && l.modifiers.includes('^') == e.ctrlKey
       && l.modifiers.includes('!') == e.altKey
       && l.modifiers.includes('#') == e.metaKey) {
        switch (l.type) {
        case 'a': // search <a> with content matched in innerHTML and jump
          {
            let els = document.getElementsByTagName('a');
            for (let j=els.length-1; j>=0; j--) {
              if (els[j].innerHTML.includes(l.link)) {
                location.href = els[j].href;
                return;
              }
            }
          }
          break;
        case 'aclick': // search <a> with content matched in innerHTML and click
          {
            let els = document.getElementsByTagName('a');
            for (let j=els.length-1; j>=0; j--) {
              if (els[j].innerHTML.includes(l.link)) {
                els[j].click();
                return;
              }
            }
          }
          break;
        case 'query': // search by query and jump
          {
            let el = document.querySelector(l.link);
            if (el) {
              location.href = el.href;
              return;
            }
          }
          break;
        case 'queryclick': // search by query and click
          {
            let el = document.querySelector(l.link);
            if (el) {
              el.click();
              return;
            }
          }
          break;
        case 'url': // jump to url
          location.href = l.link;
          return;
        case 'inc': // increase number
          location.href = url.replace(new RegExp(l.re), (match, p1) => l.str.replace('$$', Number(p1) + 1));
          return;
        case 'dec': // decrease number
          location.href = url.replace(new RegExp(l.re), (match, p1) => l.str.replace('$$', Number(p1) - 1));
          return;
        }
        found = true;
      }
    }
    if (found) {
      let msg = document.getElementById('_msgFrame');
      if (msg == null) {
        let tmp = document.createElement('div');
        tmp.id = '_msgFrame';
        tmp.style.display = 'flex';
        tmp.style.justifyContent = 'center';
        tmp.style.alignItems = 'center';
        tmp.style.position = 'fixed';
        tmp.style.top = '60px';
        tmp.style.right = '60px';
        tmp.style.width = '400px';
        tmp.style.height = '100px';
        tmp.style.pointerEvents = 'none';
        tmp.style.backgroundColor = '#fffa';
        tmp.style.color = 'red';
        tmp.style.fontSize = '72px';
        tmp.innerText = 'Not Found';
        document.body.appendChild(tmp);
      }
    }
  }
  document.addEventListener("keydown", eKeyHandler, false);
})();
///////////////////////////////////////////////////ここまで

操作方法
・カーソルキー左、またはテンキーのマイナス⇒前の話を表示
・カーソルキー右、またはテンキーのプラス⇒次の話を表示
・表紙でEnterキー、またはテンキーのEnterキー⇒現在読んでいるページを表示
・各話でEnterキー、またはテンキーのEnterキー⇒しおりを挟む
・＠キー、またはテンキーの3⇒小説・漫画の投稿を表示
・[キー、またはテンキーの2⇒お気に入りを表示
・操作が失敗したとき「Not Found」と表示する
・Escキーで「Not Found」を消す

カクヨム、なろう（感想欄含む）、アルファポリスに対応しています。
JavaScript がわかる人はキーをカスタマイズするなどして自分の使いやすいように改造してください。

ご質問があればお気軽にどうぞ。