小技チョコレート

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

Scrapbox用UserScriptの作成例

ScrapboxにUserScriptを導入する手順については、こちらのリンク先をご覧ください。


〈目次〉


Scrapboxのページ右上にある「PageMenu」に、前のページへ戻るボタンを設置する

用途

Scrapbox用のiOSアプリであるPorter for Scrpboxにおいて、画面の左端からスワイプして「前のページ」へ戻ろうとすると「Pinboard」が開いてしまって戻れない、という問題に対処する用途で作ったものです。
Porter for Scrpbox以外の環境でも勿論使えます。

使い方

Porter for Scrpboxやモバイル版ウェブブラウザでScrapboxのページを開いた際には、画面の右上に<の形のアイコンが表示されますが、それをタップすると、「前のページ」へ戻るボタンが現れます。それをタップすることで前のページへ戻れます。*1

注意点

  • ボタンのアイコンとして使用するための画像ファイルが必要です(例えばこちらのようなもの)。
  • Porter for Scrpbox(やブラウザなど)を起動した時点で最初に表示されたページにおいては動作せず、そこから1回以上ページ遷移をした後で動作します。
  • このUserScriptを設置して"Load new UserScript"をクリックした直後の状態においても、やはり動作せず、そこから1回以上ページ遷移をした後で初めて動作します。

コード

ページの先頭まで一気にスクロールするボタンを作る

クリックするとページの先頭まで一気にスクロールするボタンを、各ページの右上にあるメニューの中に作ります。
ボタンのアイコンとして使用する画像ファイルが必要です(例えばこちらのようなもの)。

code:script.js
 scrapbox.PageMenu.addMenu({
     title: '先頭',
     image:'',  // 'と'の間にアイコン用の画像のURLを記入する。空のままでは動作しない。
     onClick: () => {
         $("html,body").animate({scrollTop:$('.app').offset().top});
     }
 })

※参考にしたページ:長いScrapboxのページを画面下までスクロールさせたい - 倉下忠憲の発想工房

選択範囲の改行を消す

code:script.js
 scrapbox.PopupMenu.addButton({
    title: '改行消',  //"改行消"はポップアップするボタンの名前。変更可能です。
    onClick: text =>{
    text=text.split(/\n/).map(line => line.replace('/\\n/g','')).join('')
   return text;
    }
 })

選択範囲の先頭に#を付ける

code:script.js
    scrapbox.PopupMenu.addButton({
        title: '#追加',  //"#追加"はポップアップするボタンの名前。変更可能です。
        onClick: text =>{
        text=text.split(/\n/).map(line => line.replace(/^/g,'#')).join('\n')
        return text;
        }
    })

選択範囲内のハッシュタグの直前にスペースがないとき、半角スペースを1個入れる

マウスで選択した範囲内で、次のような置換をします。

  • hoge#fugahoge #fuga
  • hoge#fugahoge #fuga(全角シャープは半角シャープにする)

コード

code:script.js
 scrapbox.PopupMenu.addButton({
    title: '#',  //「#」はポッアップするボタンの名前。変更可能です。
    onClick: text =>{
    //# or #の直前にスペースがないとき、半角スペースを入れ、かつ全角#は半角#に置換する
    text=text.split(/\n/).map(line => line.replace(/([^\s])[##]/g,'$1 #')).join('\n')
    return text;
    }
 })

範囲選択したところをコード記法にする

code:script.js
 scrapbox.PopupMenu.addButton({
    title: 'code',
    onClick: text =>{
    text=text.split(/\n/).map(line => line.replace(/(.+)/g,'`$1`')).join('\n')
   return text;
    }
 })

範囲選択したところを数式にする

code:script.js
 scrapbox.PopupMenu.addButton({
    title: '数式',
    onClick: text =>{
    text=text.split(/\n/).map(line => line.replace(/(.+)/g,'\[\$ $1\]')).join('\n')
   return text;
    }
 })

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

別の記事で紹介しています。

GoogleフォトからScrapboxに貼り付けた画像のURLを整形し、画像が見えるようにする

別の記事で紹介しています。


*1:Scrapboxのプロジェクトのトップページを開いているときは、アイコンは表示されません(Scrapboxの仕様です)。