利用者:Yuukin0248/idDisplay.js

お知らせ: 保存した後、ブラウザのキャッシュをクリアしてページを再読み込みする必要があります。

多くの Windows や Linux のブラウザ

Ctrl を押しながら F5 を押す。

Mac における Safari

⇧ Shift を押しながら、更新ボタンをクリックする。

Mac における Chrome や Firefox

⌘ Cmd と ⇧ Shift を押しながら R を押す。

/**
 * idDisplay.js
 * ArticleID (ページID) と RevisionID (版ID) を左下に固定表示
 */

$.when($.ready, mw.loader.using(['mediawiki.util', 'oojs-ui'])).then(function () {
  // 存在しないページや版、特別ページは0を返す
  const articleId = mw.config.get('wgArticleId');
  const revisionId = mw.config.get('wgRevisionId') || mw.config.get('wgCurRevisionId');

  if (revisionId || articleId) {
    // ID表示の基本要素
    const div = $('<div class="custom-id-display"></div>')
      .appendTo('#content')
      .css({
        position: 'fixed',
        left: '0',
        bottom: '0',
        padding: '5px',
        'z-index': 1,
        'background-color': 'white',
        'font-size': '13px',
      })
      .on({
        // 0.5秒以上ホバーするとボタンを表示する
        mouseenter: function () {
          const t = setTimeout(() => {
            hideButton.toggle(true);
            $(this).data('timeout', null);
          }, 500);
          $(this).data('timeout', t);
        },
        // ホバー状態が解除された場合はボタンを非表示。ホバー開始から0.5秒以内ならタイマーもクリア
        mouseleave: function () {
          hideButton.toggle(false);
          const data = $(this).data('timeout');
          if (!data) return;
          clearTimeout(data);
          $(this).data('timeout', null);
        },
      });
    const elemList = [];

    // ID表示を消すためのボタン
    const hideButton = new OO.ui.IconWidget({
      icon: 'close',
      title: 'ID表示を閉じる',
    }).toggle(false);
    hideButton.$element.css({ position: 'absolute', top: 0, right: 0 }).on('click', () => div.hide());

    elemList.push(hideButton.$element);
    if (articleId) elemList.push(`<span class="custom-article-id">ArticleID: ${articleId}</span>`);
    if (articleId && revisionId) elemList.push('<br>');
    if (revisionId) elemList.push(`<span class="custom-revision-id">RevisionID: ${revisionId}</span>`);
    div.append(elemList);
  }
});