PageMenuの基本のキを理解する
概要
よってこのページの内容も初心者がざっくりわかればいいというスタンス
細かいことはその都度知っていけばよいのじゃ
ということでいざUserScriptにチャレンジ！
参考
PageMenuのボタンをクリックで何かを発動する場合
script.jsscrapbox.PageMenu.addMenu({
title: '適当な名前', // 必須 要素のidになるけど日本語も可
image: 'https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png', // 必須 ちなみにこの画像はScrapboxのブランドアイコン
onClick: () => {
// 処理を書く
alert('Hello, Scrapbox!');
},
});
PageMenuの中にアイテムを入れる場合①
script.jsconst myPageMenu = '適当な名前'; // 複数回使うので変数にしておくと吉 変数名は適当に
scrapbox.PageMenu.addMenu({
title: myPageMenu, // 必須
image: 'https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png', // 必須
// onClickは省略
});
scrapbox.PageMenu(myPageMenu).addItem({
title: '', // 必須
image: 'https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png', // 省略可
onClick: () => { // 必須
// 処理を書く
alert('Hello, Scrapbox!');
},
});
scrapbox.PageMenu(myPageMenu).addItem({
// 2個目以降も同様に
// addItemした分だけPageMenuの中に追加される
});
scrapbox.PageMenu(myPageMenu).addSeparator(); // ちなみに適当なところでaddSeparator()を挟めば仕切りを作れる これは中身のない一文だけのコード
PageMenuの中にアイテムを入れる場合②
script.jsconst myPageMenu = '適当な名前';
scrapbox.PageMenu.addMenu({
title: myPageMenu, // 必須
image: 'https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png', // 必須
onClick: () => { // 今度はonClickを使う
// この中でaddItemする
// 普段はこの形では使わないけどアイテムをリセットする必要がある場合などはこの中でaddItemすることになるよというメモ
scrapbox.PageMenu(myPageMenu).removeAllItems(); // 一度アイテムをリセットする
scrapbox.PageMenu(myPageMenu).addItem({
title: '', // 必須
image: 'https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png', // 省略可
onClick: () => { // 必須
// 処理を書く
alert('Hello, Scrapbox!');
},
});
},
});
onClick 内に書くのは別に何かをどうこうするものでなくてもいい（謎の日本語）
上記のようにalertを出すだけでもいい
window.open('https://scrapbox.io/自分のプロジェクト名/'+encodeURIComponent('適当なページタイトル')); と書いておけばクリックで「適当なページタイトル」がタイトルのページをすぐ作れる
もちろんその部分を var title = window.prompt() とかでその都度入力するようにもできる
他にもPageMenuに関するメソッド（ addMenu() とか addItem() とかのこと）は色々あるけどそれらを把握しなくても色々できるのでこれ以上のことは必要になったら覚えればよいということにする