「MediaWiki:Common.js」の版間の差分

提供:百科事典.com
ナビゲーションに移動 検索に移動
(完全修正版(日本語メインページ対応・差分リンク安全化・日本語コメント付き)002)
編集の要約なし
タグ: モバイル編集 モバイルウェブ編集
 
(同じ利用者による、間の7版が非表示)
3行目: 3行目:




/******************************************************
* Timeless 対応:最近の更新ウィジェット(完全版)
******************************************************/


/* ============================================================
mw.loader.using(['mediawiki.util'], function () {
  メインページに「最近の更新(7件)」を表示するスクリプト
  - タイトル+差分リンク付き
  - localStorage による5分キャッシュ
  - API の maxage/smaxage による HTTP キャッシュ
  - MediaWiki 1.39.3 で動作確認済み
  ============================================================ */


$(function () {
    // ▼ 最近の更新を読み込む関数
    function loadRecentChanges(container) {
        var key = 'recentchanges-cache';
        var keyTime = key + '-time';
        var ttl = 5 * 60 * 1000; // 5分キャッシュ
        var now = Date.now();


    // ▼ メインページ名の判定(日本語版と英語版の両方に対応)
        var cached = localStorage.getItem(key);
    const page = mw.config.get('wgPageName');
        var cachedTime = localStorage.getItem(keyTime);
    if (page !== 'Main_Page' && page !== 'メインページ') {
        return; // メインページ以外では実行しない
    }


    // ▼ localStorage 用のキー
        if (cached && cachedTime && now - cachedTime < ttl) {
    const key = 'recentchanges-cache';
            container.innerHTML = cached;
    const keyTime = key + '-time';
            return;
        }


    // ▼ キャッシュの有効期限(ミリ秒)→ 5分
        $.getJSON(mw.util.wikiScript('api'), {
    const ttl = 5 * 60 * 1000;
            action: 'query',
    const now = Date.now();
            list: 'recentchanges',
            rclimit: 7,
            rcprop: 'title|timestamp|ids',
            rcshow: '!bot',
            format: 'json'
        }, function (data) {


    // ▼ localStorage にキャッシュがあれば利用
            var html = '<ul>';
    const cached = localStorage.getItem(key);
    const cachedTime = localStorage.getItem(keyTime);


    if (cached && cachedTime && now - cachedTime < ttl) {
            data.query.recentchanges.forEach(function (rc) {
        $('#recentchanges-container').html(cached);
                html += '<li>' +
        return; // API を叩かず終了
                    '<a href="/wiki/' + rc.title + '">' + rc.title + '</a>' +
    }
                    ' <span style="color:#666;">(' + rc.timestamp + ')</span>' +
                    '</li>';
            });


    // ▼ MediaWiki API を呼び出して最近の更新を取得
            html += '</ul>';
    $.getJSON(mw.util.wikiScript('api'), {
        action: 'query',
        list: 'recentchanges',
        rclimit: 7,                    // 取得件数
        rcprop: 'title|timestamp|ids',  // タイトル・時刻・差分ID
        rcshow: '!bot',                // Bot 編集を除外(不要なら削除)
        format: 'json',


        // ▼ HTTP キャッシュ(ブラウザ・CDN)
            localStorage.setItem(key, html);
        maxage: 300,   // ブラウザキャッシュ 5分
            localStorage.setItem(keyTime, now);
        smaxage: 300  // CDNキャッシュ 5分
    }, function (data) {


         let html = '<ul>';
            container.innerHTML = html;
         });
    }


         data.query.recentchanges.forEach(rc => {
    // ▼ 要素が出現した瞬間に実行する関数
    function initRecentChanges() {
         var container = document.getElementById('recentchanges-container');
        if (!container) return;


            // ▼ old_revid が null(新規作成)の場合は差分リンクを作らない
        if (container.dataset.loaded) return;
            let diffLink = '';
        container.dataset.loaded = "1";
            if (rc.old_revid && rc.revid) {
                const diffUrl = mw.util.getUrl(rc.title, {
                    diff: rc.revid,
                    oldid: rc.old_revid
                });
                diffLink = `<a href="${diffUrl}">差分</a>`;
            } else {
                diffLink = '(新規)';
            }


            // ▼ リスト項目の HTML
        loadRecentChanges(container);
            html += `
    }
                <li>
                    <a href="/wiki/${rc.title}">${rc.title}</a>
                    &nbsp;
                    ${diffLink}
                    &nbsp;
                    (${rc.timestamp})
                </li>
            `;
        });


         html += '</ul>';
    // ▼ Timeless は DOM を後から組み替えるので監視が必須
    var observer = new MutationObserver(function () {
         initRecentChanges();
    });


        // ▼ localStorage にキャッシュ保存
    observer.observe(document.body, { childList: true, subtree: true });
        localStorage.setItem(key, html);
        localStorage.setItem(keyTime, now);


        // ▼ メインページに表示
    // 初回実行
        $('#recentchanges-container').html(html);
    initRecentChanges();
    });
});
});

2026年2月23日 (月) 05:25時点における最新版

/* ここにあるすべてのJavaScriptは、すべてのページ読み込みですべての利用者に対して読み込まれます */



/******************************************************
 * Timeless 対応:最近の更新ウィジェット(完全版)
 ******************************************************/

mw.loader.using(['mediawiki.util'], function () {

    // ▼ 最近の更新を読み込む関数
    function loadRecentChanges(container) {
        var key = 'recentchanges-cache';
        var keyTime = key + '-time';
        var ttl = 5 * 60 * 1000; // 5分キャッシュ
        var now = Date.now();

        var cached = localStorage.getItem(key);
        var cachedTime = localStorage.getItem(keyTime);

        if (cached && cachedTime && now - cachedTime < ttl) {
            container.innerHTML = cached;
            return;
        }

        $.getJSON(mw.util.wikiScript('api'), {
            action: 'query',
            list: 'recentchanges',
            rclimit: 7,
            rcprop: 'title|timestamp|ids',
            rcshow: '!bot',
            format: 'json'
        }, function (data) {

            var html = '<ul>';

            data.query.recentchanges.forEach(function (rc) {
                html += '<li>' +
                    '<a href="/wiki/' + rc.title + '">' + rc.title + '</a>' +
                    ' <span style="color:#666;">(' + rc.timestamp + ')</span>' +
                    '</li>';
            });

            html += '</ul>';

            localStorage.setItem(key, html);
            localStorage.setItem(keyTime, now);

            container.innerHTML = html;
        });
    }

    // ▼ 要素が出現した瞬間に実行する関数
    function initRecentChanges() {
        var container = document.getElementById('recentchanges-container');
        if (!container) return;

        if (container.dataset.loaded) return;
        container.dataset.loaded = "1";

        loadRecentChanges(container);
    }

    // ▼ Timeless は DOM を後から組み替えるので監視が必須
    var observer = new MutationObserver(function () {
        initRecentChanges();
    });

    observer.observe(document.body, { childList: true, subtree: true });

    // 初回実行
    initRecentChanges();
});