#daiizメモ

Scrapboxに夢中

最近の取り組み

Scrapbox上で動くChrome拡張機能をつくっている.

カスタム機能をUserScriptで書いて共有しようと考えていたけれど,僕がコードを更新したときに他のユーザさんが毎回コピペし直さないといけないのは大変なので,Chrome拡張機能として提供することで常に最新コードに保てるようにした.また,機能ごとに毎回公開していては管理が難しいので,たくさんの機能を詰め込んだ1個の拡張機能として配布して,利用者側で機能の発動をコントロールできる仕組みを作った.この設定コードはプロジェクトごとにUserScriptとして書いてもらう.

$('body').attr('data-daiiz-rel-bubble', 'off');  // 関連ページを吹き出し表示する
$('body').attr('data-daiiz-text-bubble', 'on');  // リンク先ページのテキストを表示する
$('body').attr('data-daiiz-icon-button', 'on');  // アイコンをボタンにする
$('body').attr('data-daiiz-gyazo-text-bubble', 'daiiz');  // GyazoプレビューページでScrapboxのページを読む

拡張機能側で chrome://flags のような Settings ページを作っても良かったけれど,機能のON/OFFを切り替えるためだけにScrapboxを離れたくなかったのでこれが最適だと辿り着いた.ガッツリ書きたい気分のときはOFFにしたほうがよい機能もあるので,Scrapboxのプロジェクトを離れずにすぐに設定を更新できることは快適で良い.設定をUserScriptに書いてもらうことによって,公開プロジェクトであれば僕もその内容を見れるので,使われていて嬉しいとか,どの機能がOFFにされているかを把握できて改良のきっかけになったりする.

搭載機能の1つに「Scrapboxのアイコンをボタンとして使う」機能があって,最近はこの仕組みを使ったicon-buttonの開発にハマっている.

いまは学期末のシーズンなのでレポート課題が盛り上がっている.論文までは難しいだろうけども,ちょっとしたレポートをScrapboxで書けたら気持ちが良いはずなので,ScrapboxのコンテンツをTeXに変換するicon-buttonを作り,変換後のTeXコードに埋め込まれているGyazo画像のうち手元にないものを一括ダウンロードしてPDFの生成までやってくれるtex-button機能を作った.

一行が長いとカーソル移動が重たくなったり,別名リンク記法による見た目の文字数と編集文字数のズレが蓄積されて編集しづらくなってくることがあるので, 無理に一行に書かずに,行を分けて書いても段落を変えずに (改行せずに) 変換されるようにした.箇条書きは深さを保ったまま \itemize として変換される.画像のキャプションも若干無理がある感じもするけれど指定できる. Scrapboxで書いたレポートをただの下書きとして終わらせずに立派なScrapboxコンテンツとして活用したかったので,リンク,ハッシュタグやアイコンが含まれていてもうまい具合に無視して変換する.Scrapboxらしい編集スタイルを維持しながらフォーマルな文書を作る体験ができます.是非お試しください!

https://i.gyazo.com/d1232e177bf4b4a1590f6ace730ff638.gif