ScrapboxからUlyssesへ出力する方法ーいつもていねいに

このブログ「いつもていねいに」を書いている 小田やかた です。
プロフィールはこちら、Xのアカウントはこちらです。

日々、Scrapboxにアイデアメモを保存し、それをもとにUlyssesでブログの記事を書いています。

となると、ScrapboxからUlyssesにデータを簡単に出力したいんですよね。

小田やかた

でも、ネットで探しても情報が出てこない…。

JavaScriptの知識があれば、きっと作れるのでしょうが、あいにく私にはそんな知識はありません。

でも何とか実現させたい。日常的にブログを書いているため、これが実現できれば随分効率的になります。

そこで、ネットで公開されているScrapboxのスクリプトを組み合わせたり改変したりして、何とかならないか。チャレンジすることにしました。

小田やかた

その結果、なんとかScrapboxからUlyssesにデータを出力させるスクリプトを完成させることができました。2時間かかりました…。

2パターンあります。

1つはScrapboxのページの全文をUlyssesに出力するもの。もう１つは、選択したテキストのみをUlyssesに出力するものです。

それぞれコードを書いておきますので、ScrapboxとUlyssesユーザーの方は、ぜひ、使ってください。

１　Scrapboxのページの全文をUlyssesに出力
- （１）コード
- （２）使い方
２　Scrapboxの選択したテキストをUlyssesに出力
- （１）コード
- （２）使い方
３　おわりに

１　Scrapboxのページの全文をUlyssesに出力

（１）コード

まず、Scrapboxのページの全文をUlyssesに出力するスクリプトです。

以下のコードをScrapboxのユーザーページに書いてください。

すると、Scrapboxのページメニュー（右端に表示されるメニュー）にボタンが追加されます。

code:script.js
 scrapbox.PageMenu.addMenu({
 title: 'Ulyssesへ出力',
 image:'https://gyazo.com/6f62023468275e6ee2abffc62ba62144/raw',
 onClick: () => window.open(`Ulysses://x-callback-url/new-sheet?text=${encodeURIComponent(window.scrapbox.Page.lines.map(line => line.text).join('\n'))}`)
 })

ちなみに、Scrapboxのページの全文を抽出するコードがぜんぜんわからず苦労したのですが、「scrapbox.Page.lines.map(line => line.text).join('\n'))」と書けばよかったようです。たぶん。

（２）使い方

右端のページメニューに新たに追加されたアイコンをタップすると、以下の動画のとおり、Ulyssesが起動しページの全文が出力されます。

２　Scrapboxの選択したテキストをUlyssesに出力

（１）コード

次にScrapboxのページの中の選択したテキストをUlyssesに出力するスクリプトです。

以下のコードをScrapboxのユーザーページに書いてください。

すると、Scrapboxのテキストを選択したときに表示されるポップアップメニューに「Ulysses」というメニューが追加されます。

ちなみに、ポップアップメニューは、パソコン、もしくは「JS BOX」、iPhoneアプリ「Porter」でしか表示されません。（私の環境の場合だけかもしれませんが）

code:script.js
　scrapbox.PopupMenu.addButton({
  title: 'Ulysses',
  onClick: text => {
    const encodeText = encodeURIComponent(text);
    const url = "Ulysses://x-callback-url/new-sheet?text=" + encodeText;
    window.open(url, "_blank", "width=600,height=300");
  }
})