ScrapBubble
UserScript版ScrapScripts
一つのページ上で全てのリンクをたどってページを閲覧することができる
タイトルから中身を推測できないページでも中身をさっと見ることができる
TamperMonkey版を使うと、参加していないscrapbox projectのリンクも辿れるようになる
ページの切り出しをしまくってもこれを入れておけばすぐに参照できる
使い方
1. このリンクを押して、コードが生成されるのを待ちます
App.tsだとmountがexportされないってなりませんか？自分が間違えてるのかな…
そうだった！！
直しました。ご指摘ありがとうございます
リンクを押して生成したコードをまともに読んでいないことが発覚してしまった
2. 生成されたコードを適当なコードブロックに貼り付けます
一度に貼り付けるとエラーがでるので、適当な位置で2分割して貼り付けて下さい
=> の前後など、改行を加えても問題ない場所で分割するのがおすすめですもとからある改行で分割したほうがよさそう
ここでは、
projectA というprojectの scrapbubble というページの mod.js という名前のコードブロックに貼り付けたとします3. 自分のページ/villagepump/自分のページの
script.js に以下を追記します projectA , scrapbubble , mod.js は各自の設定で書き換えて下さいsample1.jsimport { mount } from "../../projectA/scrapbubble/mod.js";
https://scrapbox.io/api/code/villagepump/ScrapBubble/sample2.ts
mount();
4. 設定完了です！ブラウザをリロードするとscriptが読み込まれます
透過的に扱いたいprojectの名前を配列で指定します
scriptを起動している現在のproject(=
scrapbox.Project.name )は自動で追加されるので、指定しなくていいですsample2.tsimport { mount } from "../../projectA/scrapbubble/mod.js";
mount({ whiteList: ["villagepump", "nishio", "shokai","takker","hub","masui","help-jp"] });
正規表現とかワイルドカード指定できると嬉しい
デフォで全project指定すればいい気が
考えてみる
利用上の注意
たくさんprojectを入れても通信負荷は発生ないはず
/takker/✅cache読み込みの制限を外してfetch読み込みを制限する (takker99/ScrapBubble)で最大3本しかfetchが走らない設計にしてある
projectsを増やしても、fetchの総量が変わるだけで叩く頻度は変わらない
だからたくさんprojectsを入れても特に問題はないはず
サムネ用
/motoso/ScrapBubbleを試すから勝手に拝借
自分のやつにあとで差し替えるかも
別プロジェクトが入ってるやつにするとなお良さそう
候補
light themeのほうがいい？
GIFでほしい
古い情報が多い
そろそろ書き換えたり切り出したりしないと
追加した機能
0.7.0
吹き出し表示した関連ページリストからscrapbox-text-bubbleを表示できる
吹き出し表示した関連ページリストから更に関連ページリストを吹き出し表示できる
逆リンクの方向にどんどん潜っていける
scrapbox-text-bubble内のリンクからscrapbox-card-bubbleを出せる
XSS対策
解析できる構文を増やした
コードブロック記法とかテーブル記法とかも表示できる
コピーもできる
code:filename.foo(bar) 以外は大体実装してあるYoutubeやlocation記法も使える
scrapbox-text-bubble内のテキストを選択できる
元のscrapbox記法をコピーすることはできない
流石に実装しないかな……
ScrapScriptsはクリックすると閉じてしまうので、テキストを選択できない
タイトル行をhoverすると逆リンクを表示する
@0.2.0の変更点
安定性の向上
自作のハリボテDOM操作コードを全部Preactに置き換えた
複数のprojectを透過的に扱う機能を実装した
public projectで書いているときに、自分のprivate projectのページをつなげることができる
TamperMonkey版を使うと、他者のprojectを自分のprojectとつなげて閲覧することができる
あるキーワードについて他者が書いたことと自分が書いたこととを同時に閲覧できる
インデントをつけるようにした
bubble以外をクリックしない限りbubbleをとじないようにした
消さないように神経質に操作する必要がなくなった
数式記法に対応した
cacheできるようにした
fetchに時間がかかっているときは読み込み中表示を出すようにした
外部projectのbubbleには、リンク元ページへのリンクを表示する
読み込み中表示を出せるようにした
まだバグや未実装の機能があるので修正＆機能追加していきたい
既知の問題
変なタイミングで消えたりちらついたりする
確かタイトルの行にhoverしてもbubbleが表示されたんですが、仕様なんでしょうか
あ、それは仕様です
scriptの開発者には早く直してもらうよう頼みたい……作ってるの自分だった
だれか共同開発してくれないかな～
@0.2.0でほぼ解消した
なんかうまく動いていない
エラーが出て表示できない
全面的にコードを見直す必要がありそう
2021-06-11 00:34:45 scrapbox-text-bubbleのみ再実装できた
これからscrapbox-card-bubbleの方も実装していくつもり
まだComponentを作っていないので、少々時間かかりそう
2021-06-11 15:46:14 実装done
改善要望
タイトルをホバーしたときに、本文のtext-bubbleは表示しないようにしてほしい
二重に表示されるだけで邪魔になると思う
card-bubbleは欲しい、リンク先の本文を読みたいので
出ないはずなんだけど、出てますか？
再現方法を教えてほしいです
無印のscreen capture
もしかしない: スクラビングバブル