小技チョコレート

ちょっとした小技を紹介するだけのブログです。

Dynalistからプレーンテキスト形式でエクスポートした内容をScrapbox記法に置換するUserScript

Dynalistからプレーンテキスト形式でエクスポートした内容をScrapbox記法に置換するUserScriptを作ったので、コードと使い方を書いておきます。

スクリプトのコードは更新されることがあります(更新履歴)。


〈目次〉


機能

概要

Dynalistからプレーンテキスト形式でエクスポートし、Scrapboxにペーストしてあるテキストを、マウスで選択してボタンを1回クリックすると、選択範囲に含まれているMarkdownや、Dynalistの独自記法をScrapbox記法に置換します。Dynalistにおける階層も再現されます。

f:id:ichbin:20191113164731p:plain
(Dynalistのコンテンツ)

f:id:ichbin:20191113165124p:plain
(DynalistのコンテンツをScrapboxにペーストし、範囲選択して“Dynalist"ボタンを押す)

f:id:ichbin:20191113170228p:plain
Scrapbox記法に置換された状態)

置換できるもの/できないもののリスト

全てのMarkdownやDynalistの独自記法を完全にScrapbox記法へ置換できるわけではなく、置換できないものも存在します。置換できるもの/できないものの詳しいリストは下記のとおりです。

置換できるもの
  • リンク
    • [リンクテキスト](URL)[リンクテキスト URL]
    • [](URL)[URL]
  • 画像
    • ![リンクテキスト](URL)[リンクテキスト URL]
    • ![](URL)[URL]
  • 強調を太字へ置換(**hoge**[* hoge]
  • イタリック(__hoge__[/ hoge]
  • 取り消し線(~~hoge~~[- hoge]
  • 日時記法
    • !(2019-09-08)2019-09-08
    • !(2019-09-08 10:00)2019-09-08 10:00
  • ハッシュタグ用の@#へ置換(@hoge#hoge
  • 数式($$E=mc^2$$[$ E=mc^2]
  • 余分なインデント(Dynalistでは階層が1段下がるごとにインデントが4個ずつ付くので、これをインデント1個ずつに置換)*1

なお、Dynalistのコード記法(`hoge`)および、#を用いたハッシュタグ#hoge)は、Scrapboxでもそれらと同一の書き方をしますので、本記事のUserScriptを導入しなくても、Scrapboxで再現されます。

置換できないもの
  • Scrapboxのページタイトルに含まれているMarkdownや、同じくページタイトルに含まれているDynalistの独自記法(ただし、ちょっとした工夫を加えれば解決します)。
    • Dynalistからエクスポートしたテキストの1行目がこれに相当します。
  • Dynalistにおいて見出し(H1, H2, H3)の状態にある項目(Ctrl+Shift+Hを押した行)は、Dynalistではフォントサイズが大きくなっていますが、そのサイズ変更は再現されません。
  • カラーラベル(Dynalistで特定の行にのみ使用している背景色)は再現されません。
  • Dynalistでチェック(Check off)した項目(hogeのように表示されているもの=Ctrl+Enterを押した行)そのものは消さずに引き継ぐことができますが、この項目のフォントカラーの変更(色が薄くなっていること)と、同項目に付けられている取り消し線は再現されません。
    • Dynalistのcheckbox(行頭に付けることができるチェック機能)にチェックを入れた項目も、これに該当します。
    • それらの取り消し線をScrapboxで再現するには別の方法を利用して下さい。
  • Dynalistのcheckbox(行頭に付けることができるチェック機能)は再現されません。
  • Dynalistの1項目(1行)の内部で改行してある場合(Ctrl+Shift+Enterを押してある場合)は、その項目における改行以降の部分には、階層の深さが引き継がれません。他の項目の階層は正しく再現されます。
  • Dynalistのnoteに記入したものは、Dynalistにおけるスタイル(小さいフォントで各項目の下側に付いている状態)がScrapboxに引き継がれず、独立の1項目(1行)に置き換えられます。

その他の、仕様上どうしても実現できないことなどを「既知の問題点」の節にまとめています。細かいことなので、詳しく知りたい場合はお読み下さい。

他のツールとの機能比較も参考にしてください。

scrapbox.io

導入のしかた

こちらのヘルプに書かれている手順で、ScrapboxのUserScriptをEnableにします。

次に、Scrapboxの「自分のページ」を開き、code:script.jsと記入します。その下の行にdy2sc.jsのコード(下記の画像の赤枠部分、全体で約30行)をペーストします。

f:id:ichbin:20190916081939p:plain
dy2sc.jsのコード

そしてブラウザをリロードし、Scrapboxの上部に表示される“Load new UserScript”をクリックします。

f:id:ichbin:20190911235056p:plain

ペーストした部分はこのようになっているはずです(行頭のインデントの数は、この画像のとおりでなくても構いません)。

f:id:ichbin:20191105064533p:plain

これで完了です。

使い方

Dynalistにこのような内容があるとき、これをScrapbox記法に置換する、という例を示します。

f:id:ichbin:20191117120621p:plain
(この例では1行の中にMarkdownやDynalistの独自記法が1つずつあるだけですが、複数個ある場合も正しく置換できます。)

Dynalistからエクスポートしたい内容の、最上位の行の行頭にマウスポインタを合わせると、「≡」の形のアイコンが表示されるので、それをクリック。

f:id:ichbin:20191113164922p:plain

すると、メニューが開くので、その中の“Export...”をクリック。

f:id:ichbin:20191113165009p:plain

このような画面が開きます。

f:id:ichbin:20191113165540p:plain

中央上部の“Plain text”をマウスで選択し、下の方にある“Indentation style”のところで“Spaces”を選択しておきます(通常は何もしなくても“Spaces”が選択されていると思います)。

そして“Copy to clipboard”のボタンを押すか、もしくは、中央の入力欄の内容を選択した状態でCtrl+cなどと操作して、この入力欄の内容をクリップボードにコピーします。

それをScrapboxの新規ページや既存のページに貼り付けます。

f:id:ichbin:20191113165057p:plain
(エクスポートしたテキストをそのまま貼り付けた状態)

エクスポートしたテキストのうち、ページタイトルを除いた部分をマウスで選択します。
すると、“Dynalist”という名前のボタンが表示されます。

f:id:ichbin:20191113165124p:plain
(ページタイトルより下側をマウスで選択した状態)

“Dynalist"のボタンを押すと、このように置換されます。

f:id:ichbin:20191113170228p:plain
(数式記法のところで行頭のマーカー(・)が見えなくなっているのはScrapboxの仕様です)

ページタイトルを置換対象に含める方法

上掲のとおり、Scrapboxのページタイトル部分は、このUserScriptでの置換対象に含めることができません。

f:id:ichbin:20191113165612p:plain
(ページタイトルまで選択範囲に含めると、置換操作のための“Dynalist”ボタンが出ない)

この問題は、次のような小さな工夫で解決します。

DynalistからエクスポートしたテキストをScrapboxに貼り付ける際に、Scrapboxページの1行目(すなわちページタイトルの位置)に貼り付けるのではなく、2行目以降の位置に貼り付けます。そうすれば、全体をUserScriptの置換対象に含めることができます。置換が終わった後で、本来ページタイトルになるべきだった行を、ページタイトルの位置まで上げてやれば完了です。

f:id:ichbin:20191113171831p:plain
(ページタイトルよりも下の行に貼り付ければ、全体が置換対象に入る)

〈Dynalistに存在しているが画面上で見えていないもの〉をエクスポート対象から除外する方法

Dynalistにおいて「存在はしているけれども画面上で見えていないもの」を、エクスポート対象に含めないようにすることができます。詳細は別の記事をご覧ください。

カスタマイズ

ボタンの名前を変える

こちらの画像にあるように、置換対象の範囲をマウスで選択したときに表示されるボタンの名前は、デフォルトでは“Dynalist"ですが、この名前は変更できます。

f:id:ichbin:20191113173126p:plain

変更するには、スクリプトのコードの2行目のtitle: 'Dynalist',のところを書き換えます。

書き終えたら必ずブラウザをリロードし、Scrapboxのページ上部に現れる"Load new UserScript"をクリックしておきます。

置換対象を増やす

デフォルトで置換できるもののほかに、置換対象を加えたい場合は、スクリプトのコードの末尾のほうにあるreturn text;よりも上の行に、コードを書き加えます(既存の置換機能に影響を与えないようにするためには、return text;の直前の行に書き加えるほうがよい)。

コードの基本的な形はtext=text.split(/\n/).map(line => line.replace(/置換前/g,'置換後')).join('\n')です。「置換前」の部分はJavaScriptでの正規表現の書き方に従って書きます。「置換後」の部分の書き方はdy2sc.jsのコードを参考にしてください。

書き終えたら必ずブラウザをリロードし、Scrapboxのページ上部に現れる"Load new UserScript"をクリックしておきます。

置換対象を減らす

デフォルトで置換できるもののなかに、置換したくないものがある場合は、スクリプトのコードの中でそれに対応している行の行頭に//と書き加えます。

書き終えたら必ずブラウザをリロードし、Scrapboxのページ上部に現れる"Load new UserScript"をクリックしておきます。

既知の問題点

  • 次のような場合は、その箇所では正しい置換結果になりません。
    • Markdown入れ子になっている場合(**__hoge__**~~**hoge **~~など)
    • Dynalistの数式記法($$〜$$)で式に]を含む場合(例:$$[a + b]$$*2
    • 数式記法($$〜$$)で半角の$が3個以上連続している場合
      • 数式の左端や右端に$がある場合($aとかa+$のような数式)がこれに該当します。
      • 1行の中で数式記法が連続しているだけの場合は、問題ありません。
        • $$a+b$$$$x-y$$[$ a+b][$ x-y]と正しく置換される。
  • Dynalistで行頭に半角スペースがあると、Scrapboxにおいて階層が正しく再現されません。行頭の半角スペースがインデントとして解釈されてしまうためです。

f:id:ichbin:20190910182404p:plain
(1行目は行頭に半角スペースがある)

おわりに

不具合のご報告やご要望、改良のアイデアなどがありましたら、本記事のコメント欄か筆者のTwitterメールGithubなどへお知らせ下さい。

免責事項

本記事で紹介したUserScriptの使用やその不具合等により生じたいかなる損害に関しましても、筆者は一切の責任を負いません。

*1:インデントを4個のままにすると、Scrapboxにおいては箇条書きの階層が深くなりすぎます。

*2:これはScrapboxの仕様によるものです。