ページの見出しを作るUserScript
https://gyazo.com/c9822332ac7ecca09044c07595d4eb04
https://gyazo.com/96b176ae5891659d16d31d88eb8afb6f
簡単版
こんな感じで書ける
code:simple.js
scrapbox.PageMenu.addMenu({
title: 'シンプル見出し',
onClick: function () {
scrapbox.PageMenu('シンプル見出し').removeAllItems()
for (let line of scrapbox.Page.lines) {
if (!line.section.start) continue
scrapbox.PageMenu('シンプル見出し').addItem({
title: line.text,
onClick: () => location.hash = line.id
})
}
}
})
https://gyazo.com/259f037e71f751e7a71c776d8aa5d6d4
addMenuのonClickで見出しを再生成する為に、毎回removeAllItemsで消す
Scrapbox記法をいい感じに表示する版
https://gyazo.com/c9822332ac7ecca09044c07595d4eb04
工夫したところ
行データ内のカッコを除去する
アイコン記法があったら見出しに使う
インストール
最新のChromeなら
import '/api/code/shokai/ページの見出しを作るUserScript/script.js'
を書いて、ブラウザリロード
もしくは
これをまるごと自分のページのcode:script.jsにコピペしてから、ブラウザリロード code:script.js
(function () {
cosense.PageMenu.addMenu({
title: '見出し',
icon: 'fas fa-list',
onClick: () => {
cosense.PageMenu('見出し').removeAllItems()
for (let line of cosense.Page.lines) {
if (!line.section.start) continue
const image = line.nodes && getIconUrl(line.nodes)
const noIcon = !!image
const title = line.nodes ? renderPlainText(line.nodes, {noIcon}) : line.text
const onClick = () => location.hash = line.id
cosense.PageMenu('見出し').addItem({title, image, onClick})
}
}
})
function renderPlainText (node, options) {
if (node instanceof Array) return node.map(node => renderPlainText(node, options)).join('')
if (typeof node === 'string') return node
switch (node.type) {
case 'icon':
case 'strong-icon':
return options.noIcon ? ' ' : node.unit.page
}
return renderPlainText(node.children, options)
}
function getIconUrl (node) {
if (/icon/.test(node.type)) {
return /api/pages/${node.unit.project || cosense.Project.name}/${node.unit.page}/icon
}
if (node instanceof Array) {
return node.map(getIconUrl).find(img => img)
}
if (node.children) return getIconUrl(node.children)
return null
}
})()