日記をテンプレートからつくるUserScript
UserScript
参考
UserCSSの書き換えを不要にした
code:make_diary.js
(function() {
const faLink = document.createElement('link');
faLink.rel = 'stylesheet';
document.head.appendChild(faLink);
// 必要なCSSルールを追加
const css = `
button#Templates.tool-btn:hover { text-decoration: none; }
button#Templates.tool-btn::before {
position: absolute;
content: '\\f067';
font: 900 21px/46px 'Font Awesome 5 Free';
}
button#Templates.tool-btn img { opacity: 0; }
`;
const styleEl = document.createElement('style');
styleEl.textContent = css;
document.head.appendChild(styleEl);
// 以下、既存のユーザスクリプトの処理を続ける
function addTemplateItemsToPageMenu() {
// 使用する場合はtemplateをテンプレートへのURLに変更
const templates = [
{ title: '📄 日記テンプレート', template: '/api/code/no2ca/templates/diary.js' }
];
const menuTitle = 'Templates';
// メニューを追加
scrapbox.PageMenu.addMenu({
title: menuTitle,
image: '/assets/img/logo.png',
onClick: () => {}
});
// テンプレート項目をメニューに追加
templates.forEach(({ title, template }) => {
scrapbox.PageMenu(menuTitle).addItem({
title,
onClick: () => loadTemplate(template)
});
});
}
function loadTemplate(templateUrl) {
const { Page } = scrapbox;
if (Page.lines && Page.lines.length === 1) {
const line = document.getElementById(L${Page.lines[0].id});
const lastChar = line.querySelector('span.char-index:last-of-type');
const textarea = document.getElementById('text-input');
// タイトル行をクリックしたことにする
lastChar.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
textarea.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, cancelable: true, keyCode: 35 }));
// テンプレートを読み込む
$('#text-input').load(templateUrl, (response, status) => {
if (status === "success") {
try {
textarea.value = /\.js$/.test(templateUrl) ? eval(response) : response;
textarea.dispatchEvent(new InputEvent('input', { bubbles: true, cancelable: true }));
} catch (ex) {
console.error("テンプレートの読み込みに失敗:", ex);
}
} else {
console.error("テンプレートの読み込みに失敗:", status);
}
});
}
}
// メニューを追加
addTemplateItemsToPageMenu();
})();
テンプレート