MediaWiki:Common.js
提供: 小樽のじかん事典
注意: 保存後、変更を確認するにはブラウザーのキャッシュを消去する必要がある場合があります。
- Firefox / Safari: Shift を押しながら 再読み込み をクリックするか、Ctrl-F5 または Ctrl-R を押してください (Mac では ⌘-R)
- Google Chrome: Ctrl-Shift-R を押してください (Mac では ⌘-Shift-R)
- Microsoft Edge: Ctrl を押しながら 最新の情報に更新 をクリックするか、Ctrl-F5 を押してください。
/* 全ページで読み込むJavaScript:コメント欄を下部に移動し、投稿者名入力を反映 */
mw.loader.using('mediawiki.util', function () {
/* ===== 表示名入力欄を追加 ===== */
function addNameField() {
const form = document.querySelector('.comment-form');
if (!form || form.querySelector('.comment-name-input')) return;
const wrapper = document.createElement('div');
wrapper.className = 'comment-name-input';
const input = document.createElement('input');
input.type = 'text';
input.placeholder = '投稿者名(省略可)';
input.style.width = '200px';
wrapper.appendChild(input);
form.prepend(wrapper);
}
/* ===== 送信時:本文に名前を埋め込む ===== */
function hookSubmit() {
const form = document.querySelector('.comment-form');
if (!form) return;
const textarea = form.querySelector('textarea');
const input = form.querySelector('.comment-name-input input');
const button = form.querySelector('button[type="submit"]');
if (!textarea || !input || !button) return;
button.addEventListener('click', function () {
let name = input.value.trim();
if (!name) name = '名無しさん';
if (!textarea.value.startsWith('【')) {
textarea.value = `【${name}】` + textarea.value;
}
});
}
/* ===== 表示時:名前を取り出して表示 ===== */
function applyDisplayNames() {
document.querySelectorAll('.comment').forEach(function (comment) {
if (comment.querySelector('.comment-display-name')) return;
const body = comment.querySelector('.comment-body, .comment-text');
if (!body) return;
const text = body.innerHTML;
const match = text.match(/^【(.+?)】/);
let name = '名無しさん';
if (match) {
name = match[1];
body.innerHTML = body.innerHTML.replace(/^【.+?】/, '');
}
const header = comment.querySelector('.comment-header') || comment;
const nameElem = document.createElement('div');
nameElem.className = 'comment-display-name';
nameElem.textContent = name;
header.prepend(nameElem);
});
}
/* ===== コメント追加後も再適用 ===== */
document.addEventListener('click', function () {
setTimeout(applyDisplayNames, 500);
});
/* ===== 初期実行 ===== */
addNameField();
hookSubmit();
applyDisplayNames();
});
/* ===== コメント欄をページ下部に移動 ===== */
document.addEventListener('DOMContentLoaded', function () {
const commentsContainer = document.querySelector('#mw-comments-container');
if (commentsContainer) {
document.body.appendChild(commentsContainer);
}
});