図番号キャプション記法
hogashi.icon
図キャプションとして自動で「図1, 」を挿入する記法
キャプション: [+ キャプションの中身 ]
直前の番号を参照: [+ ]
後述のソースコードを直せば "直前" でなく "直後" にもできる
様子 ↓
https://gyazo.com/8fc2c5b57da2257fc1bd3922ee480047
LaTeX の図に使う \label のような挙動
つまり[+ ] は \ref に準ずる
ここでは自動で「図1, 」などと入れているが、自動で入るのは数字のみにして、自分で「図」とか「表」とか入れてもよさそう
:before 疑似要素を使っているのでカーソル位置のレンダリングがちょっと狂ったりする
data-caption 属性というのを追加したりするのでたまに元の挙動で消える(keydown/clickで復活するけど)
何かもっと上手い方法があれば……
code:style.css
/* 図番号のつくキャプション記法 */
.deco-\+:before {
content: attr(data-caption);
}
code:script.js
// 対象のエレメントが指定のクラス名を持つか
const isClassOf = (elem, className) => {
const elemClassName = elem.getAttribute('class')
if (elemClassName) {
return elem.getAttribute('class').split(' ').some(c => c.match(new RegExp(className)))
}
return false
}
// 対象のエレメントがカーソルのある行かどうか
const isInCursorLine = elem => {
let parent = elem.parentNode
while (!isClassOf(parent, 'line')) {
parent = parent.parentNode
}
if (isClassOf(parent, 'cursor-line')) {
return true
}
return false
}
// 図のキャプションに図番号を振る
// 中身が空 [+ ] のとき、直前の図番号を参照する
const setFigureNumber = () => {
if (Array.from(cap.querySelectorAll('span')).every(s => !s.innerHTML.match(/[^\s\\+\]/))) { // ここの ${index} を ${index + 1} にすれば直後を参照する
cap.setAttribute('data-caption', ${index})
return index
}
cap.setAttribute('data-caption', 図${index + 1}, )
return index + 1;
})
}
setFigureNumber()
document.addEventListener('keydown', setFigureNumber)
document.addEventListener('click', setFigureNumber)
UserScript.icon
UserCSS.icon