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

提供:百科事典.com
ナビゲーションに移動検索に移動
編集の要約なし
(MediaWiki:Common.js に追加するコード(日本語コメント付き・完全動作版)002)
編集の要約なし
タグ: モバイル編集 モバイルウェブ編集
 
(同じ利用者による、間の6版が非表示)
2行目: 2行目:




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


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


    // ▼ メインページ名の判定(日本語版と英語版の両方に対応)
mw.loader.using(['mediawiki.util'], function () {
    const page = mw.config.get('wgPageName');
    if (page !== 'Main_Page' && page !== 'メインページ') {
        return; // メインページ以外では実行しない
    }


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


    // ▼ キャッシュの有効期限(ミリ秒)→ 5分
        var cached = localStorage.getItem(key);
    const ttl = 5 * 60 * 1000;
        var cachedTime = localStorage.getItem(keyTime);
    const now = Date.now();


    // ▼ localStorage にキャッシュがあれば利用
        if (cached && cachedTime && now - cachedTime < ttl) {
    const cached = localStorage.getItem(key);
            container.innerHTML = cached;
    const cachedTime = localStorage.getItem(keyTime);
            return;
        }


    if (cached && cachedTime && now - cachedTime < ttl) {
        $.getJSON(mw.util.wikiScript('api'), {
        $('#recentchanges-container').html(cached);
            action: 'query',
         return; // API を叩かず終了
            list: 'recentchanges',
    }
            rclimit: 7,
            rcprop: 'title|timestamp|ids',
            rcshow: '!bot',
            format: 'json'
         }, function (data) {


    // ▼ MediaWiki API を呼び出して最近の更新を取得
            var 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)
            data.query.recentchanges.forEach(function (rc) {
        maxage: 300,  // ブラウザキャッシュ 5分
                html += '<li>' +
        smaxage: 300  // CDNキャッシュ 5分
                    '<a href="/wiki/' + rc.title + '">' + rc.title + '</a>' +
    }, function (data) {
                    ' <span style="color:#666;">(' + rc.timestamp + ')</span>' +
                    '</li>';
            });


        let html = '<ul>';
            html += '</ul>';


        data.query.recentchanges.forEach(rc => {
            localStorage.setItem(key, html);
            localStorage.setItem(keyTime, now);


             // ▼ old_revid が null(新規作成)の場合は差分リンクを作らない
             container.innerHTML = html;
            let diffLink = '';
        });
            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
    // ▼ 要素が出現した瞬間に実行する関数
            html += `
    function initRecentChanges() {
                <li>
        var container = document.getElementById('recentchanges-container');
                    <a href="/wiki/${rc.title}">${rc.title}</a>
         if (!container) return;
                    &nbsp;
                    ${diffLink}
                    &nbsp;
                    (${rc.timestamp})
                </li>
            `;
         });


         html += '</ul>';
         if (container.dataset.loaded) return;
        container.dataset.loaded = "1";


         // ▼ localStorage にキャッシュ保存
         loadRecentChanges(container);
        localStorage.setItem(key, html);
    }
        localStorage.setItem(keyTime, now);


        // ▼ メインページに表示
    // ▼ Timeless は DOM を後から組み替えるので監視が必須
        $('#recentchanges-container').html(html);
    var observer = new MutationObserver(function () {
        initRecentChanges();
     });
     });
    observer.observe(document.body, { childList: true, subtree: true });
    // 初回実行
    initRecentChanges();
});
});

案内メニュー