選択範囲に似ているリンクを入力補完するUserScript

機能

ページ中の文字を選択すると、選択した文字に近いリンクが表示される

defaultで5個まで表示される。

一番下に、表示されなかったリンクの個数がでる

https://gyazo.com/7f054fd41e9c006c9f6c9cd2b0b6f905

表示されたリンクを押すと、そのリンクで選択範囲が置き換わる

https://gyazo.com/f6e9f2523064121350fdb36e84e60b18

右クリックメニューやCtrl+クリックで、リンク先ページを新しいタブで開いたり、リンクをコピーしたり、ドラッグアンドドロップでリンクを挿入できたりもする

https://gyazo.com/fae419ef2172c791cc0cd7694b7d799c

注意

コードブロック中、ページタイトル、テーブル記法のタイトルでは起動しない

複数行選択しているときも起動しない

使い方

簡単な方法

カスタマイズ

table:css変数

default

--select-suggest-font-family "Open Sans", Helvetica, Arial, "Hiragino Sans", sans-serif

これを使って、各自でショートカットなどを実装する

動機

これと同じ不満を持っていた

どこから引用したか書き忘れてた

井戸端に置いたページにソースがある

体調が悪くて他のことができそうになかった

もっと最近に作ったscriptだと思ってた

バグ

Firefoxでのみ発生している

Firefoxの問題かも

候補更新時に、選択状態をresetしない

最初と最後しか検索結果が更新されないようになっちゃった

実装したいこと

文字入力補完のスクショも撮る

popupmenuが表示されているときでも補完を有効にする

simple.tsに実装する

popup menuの(先頭|末尾)候補を選択しているときに次候補へ移動しようとしたら、このuserscriptの補完候補へ移動できるようにする

✅ショートカットキーの導入

選択・確定操作を外部から操作できるようにする

ショートカットキーの設定はユーザーに任せる

Promiseを使って吐き出す

workerを使う

モチベ

✅外部projectのリンクも補完できるようになる

ソース取得先を変えればいいだけ

実装

検索結果のやりとり

やってもいいんじゃない？

中断処理なしなら、補完候補を選んでいる途中にアイテムが変わって誤クリックする確率が減る

たぶん500ms以内で計算し終わるなら、中断処理なしでも動く

Workerに移行する前の前準備

Worker内でIndexed DBから直接データを読み込んで検索するようにする

タブごとにDBからデータを構築せずに済む

export不要

これは難しい

すべてのsourceを一つに合体してしまっている

メモリを節約する

タブがアクティブでないときは、リンクデータを解放する

アクティブになるたびにDBから読み出す？

同じ現象発生しているんだよなあ……

そっちのほうがテストもしやすい

❌補完ソースのデータ形式

現在

{...; projects: string[]; }[]

ヒットしたリンクの統計データをprojectごとに計算するのが難しい

検索と同時にカウントすれば、あまり難しくないかも

案

Map<string/* project name */, Link[]>

projectごとに絞り込む処理が高速になる

検索するリンク数が増える

重複しているリンクを、project数回検索しなければならなくなる

重複しているリンク数なんて、たかが知れている

project一つ一つを、独立したsourceとみなす

code:mod.tsx

code:worker.ts

code:advanced.ts