ScrapCalc
Scrapboxのページ上で、JavaScriptを用いた計算や処理を行うことをできるようにするUserScript
元のソースコード：/masui/ScrapCalc
% を使えるようにソースコードを書き換えたみじんこ用雑多ページメニュー内から呼び出せるように
export function を追加したCSS
2種類あるので、どちらか好きな方を使う
style.css.deco-\% {
color: #111;
background-color: #ffddff;
padding: 0.1em 0.2em 0.1em 0.2em;
}
.scrapcalc_result {
font-style:italic;
font-weight:bold;
color: #111;
background-color:yellow;
}
inline-code-like.css.deco-\%,
.scrapcalc_result {
padding: 0 .5em;
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
font-size: 90%;
border-radius: 4px;
background-color: var(--code-bg, rgba(0, 0, 0, 0.04));
}
span.scrapcalc_result {
color: #FFFFFF;
background-color: #46b52a;
}JavaScript
script.jsfunction scrapcalc_exec(){
for(let e of document.querySelectorAll('.deco-\\%')){
let text = e.innerText;
// 全角カギカッコを配列などで使えるようにする苦しい工夫
// let expr = decodeURI(text).replaceAll('［','[').replaceAll('］',']')
let expr = text.replaceAll('［','[').replaceAll('］',']') // URIデコードしないようにした
//if(text.match(/=/)){
if(false) { // 常時計算結果を表示するようにした
(0,eval)(expr); // 何故かこれでstrictが有効でなくなる?
}
else {
let span = document.createElement('span');
span.classList.add("scrapcalc_result");
span.innerText = (0,eval)(expr);
e.parentNode.appendChild(span)
e.classList.add("scrapcalc_exp")
e.style.display = 'none';
}
}
}
function scrapcalc_reset(){
for(let e of document.querySelectorAll('.scrapcalc_result')){
e.remove();
}
for(let e of document.querySelectorAll('.scrapcalc_exp')){
e.style.display = 'inline';
}
}
export function scrapcalc_toggle() {
if(document.querySelectorAll('.scrapcalc_result').length == 0){
scrapcalc_exec();
}
else {
scrapcalc_reset();
}
}
document.addEventListener('keydown', e => {
if (e.key == 'q' && e.ctrlKey){ // Ctrl-Qで実行
scrapcalc_toggle();
}
})