support for scrapbox

[ompugao]

普段から英語学習にscrapboxを利用しており、
scrapbox中のワードをマウスオーバーで辞書がひけると嬉しいです

適当な例です
https://scrapbox.io/ompugao-public/Crater_(constellation)

見て頂くとわかるのですが、一文字ずつに<span>で囲まれています。
とはいえ、本体にscrapbox用の処理を入れて頂くのはおかしいとは思います。

scrapboxにはユーザーがjavascriptでカスタマイズできる機能があるので、
mousedictionary側とうまく連携することでマウスオーバーによる辞書検索ができると捗るのですが…
なにか実現方法はございますでしょうか

[wtetsu]

なかなかごっつい構造ですね。

手元でDOMを探る部分に手を入れたところ、いちおう動くことは動きました。しかし他サイトで利用しているときの挙動が変わってしまう可能性もあるので、リリースはしばらく試用したあとになります。

[ompugao]

ありがたいです…！
リリースを首を長くして待ちながら、手元でビルドして利用させていただきます〜

[wtetsu]

@ompugao
まだpushしていないのですが、そのうちβ版として出すので、その際は動作確認にご協力いただけると助かります。

[ompugao]

了解です！重ね重ねありがとうございます！

[wtetsu]

@ompugao

Beta version
https://chrome.google.com/webstore/detail/mouse-dictionarybeta/ehebancbhejilcmjkoaiphmponbmgbeb

お試しください。

[ompugao]

ありがとうございます！試させて頂きます！！

[ompugao]

前方にスペースがない単語について辞書検索がなされないのは仕様でしょうか？

以下のような文章で、「盗む」や「conceal」にカーソルを置いても検索されませんが、「分泌する」「hide」については検索されます

[wtetsu]

この手の、本来不必要な構造で構成されているドキュメントについて、改めていくつか調査して検討しています。scrapboxに関して言うとかなりscrapbox専用の処理を入れないと完璧に動作させることはできなそうです。
つまり、汎用的な処理ひとつで、scrapboxもあれもこれも完璧に処理する、というのは無理そうという結論に至っています(いまのβ版がそうなんですが)

ので、どう解決するかは考え中です。少なくとも、今のβ版を改善して解決する、という方向性はいったん停止しています。

[torotiti]

Mouse Dictionary には助けられております。

最近になって、Scrapboxの英語を読む必要があり、この問題にぶつかって、検索でこちらに辿り着きました。
現在（2021/01/07）の最新版(1.4.6）でも上記の対応は見送られている様ですね。
完璧な対応でなくても、簡易的な対応など導入される予定はありますでしょうか？

[wtetsu]

@torotiti

ご利用ありがとうございます。

私の調べてみたところ、Scrapboxはかなり特殊なDOM構造に展開されるようで、
これを、既存の処理に影響を与えず、かつうまいこと読み取る方法が見つかっていないのが現状です。

たとえば<span>apple</span><span>pen</span>とあったときに、テキストとしてどう読み取るべきかは自明ではありません。"apple pen"なのか"applepen"なのか。Mouse Dictionaryは"apple pen"として処理しています。このやり方で、大概のサイトでうまく動くようです。

しかし、Scrapboxではspanで区切られているテキストをつなげて読み取らないと意図通りのテキストを読み取ることができません。

この2つのやり方を自動で使い分けるのは、実はなかなかの難題です。

サイトがScrapboxであることを検知してScrapbox専用の読み取り処理に切り替える、といった対処をすれば実現可能かもしれませんが、そのようなトリッキーな対処をしてしまうと今後のメンテナンスにも悪影響を与えてしまうので、避けたいと考えています。

---

なので現状は、読みたい文書をScrapboxから他のサイトにコピペして、他のサイト上でMouse Dictionaryを利用のが一番確実かと思われます。
「他のサイト」は、テキストだけ必要であれば、その辺のテキストエリアで構いません。
HTMLとして表示が必要であれば、たとえばNotionのノートなどに全コピペすれば、画像なども維持できると思います (表示はそれなりに崩れるかもしれませんが)

[torotiti]

早速のご回答、ありがとうございました！
Scrapboxの構造、かなり特殊ですよね…（その分、いろんなことができているというのもあると思うのですが）

アドバイスを元に、私の方でも運用でうまく回避できる方法がないか検討してみます。

[takker99]

きれいな解決策ではないのですが、Scrapbox Readerというthird party toolを使う手段もあります。参考までに紹介しておきます。

• e.g. https://scrapbox-reader.vercel.app/villagepump/超軽量なScrapboxクライアントを作った

[wtetsu]

@takker99
問題解決案のご提示ありがとうございます。

---

ちなみにもう一つ実現可能であろう方法として、Cross-extension messagingを使うというものがあります。

• Scrapbox上でのみ動作するChrome拡張を用意する
• この拡張はScrapboxのDOM構造をたどりテキストを取り出すことに特化している
• 取り出したテキストはCross-extension messagingでMouse Dictionaryに送る。
• (以降のテキストを受け取った以降の辞書引き～表示はMouse Dictionaryのしごと)

Mouse DictionaryにCross-extension messagingを送信している拡張の例:
Mouse Dictionary iframe support(これはiframe読み取りに特化した拡張)

このようにすれば、そのサイト特有の読み取り処理などが必要な場合でもMouse Dictionary本体に手を入れずに対応することができるはずです。ただし新たなChrome拡張をつくる必要があります。
(私がScrapboxユーザではないこともあり、私がつくる予定はいまのところありません)