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

ナビゲーションに移動 検索に移動
編集の要約なし
(メインページに「最近の更新(7件)」をタイトル+差分リンク付きで表示するための完全版コード003)
編集の要約なし
タグ: モバイル編集 モバイルウェブ編集
 
(同じ利用者による、間の5版が非表示)
1行目: 1行目:
/* ここにあるすべてのJavaScriptは、すべてのページ読み込みですべての利用者に対して読み込まれます */
/* ここにあるすべてのJavaScriptは、すべてのページ読み込みですべての利用者に対して読み込まれます */
/* ============================================================
  メインページに「最近の更新(7件)」を表示するスクリプト
  - タイトル+差分リンク付き
  - localStorage による5分キャッシュ
  - API の maxage/smaxage による HTTP キャッシュ
  - MediaWiki 1.39.3 で動作確認済み
  ============================================================ */


$(function () {


    // ▼ メインページ名の判定(あなたの wiki は「メインページ」)
    const page = mw.config.get('wgPageName');
    if (page !== 'メインページ' && page !== 'Main_Page') {
        return; // メインページ以外では実行しない
    }


    // ▼ localStorage 用のキー
/******************************************************
    const key = 'recentchanges-cache';
* Timeless 対応:最近の更新ウィジェット(完全版)
    const keyTime = key + '-time';
******************************************************/
 
mw.loader.using(['mediawiki.util'], function () {


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


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


    if (cached && cachedTime && now - cachedTime < ttl) {
        if (cached && cachedTime && now - cachedTime < ttl) {
        $('#recentchanges-container').html(cached);
            container.innerHTML = cached;
        return; // API を叩かず終了
            return;
    }
        }


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


        // ▼ HTTP キャッシュ(ブラウザ・CDN)
            var html = '<ul>';
        maxage: 300,  // ブラウザキャッシュ 5分
        smaxage: 300  // CDNキャッシュ 5分
    }, function (data) {


        let 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>';
            });


        data.query.recentchanges.forEach(rc => {
            html += '</ul>';


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


         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();
});
});

案内メニュー