MediaWiki:Timeless.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

mw.loader.using(['mediawiki.api']).then(function () {
    var category = "CategoryName"; // Change this
    var sidebar = $("#mw-related-navigation"); // Timeless sidebar container

    // Create a new sidebar-style block using Timeless' default classes
    var $menu = $("<nav>").addClass("mw-portlet").attr("id", "custom-category-menu");
    var $heading = $("<h3>").addClass("mw-portlet-heading").text("Pages in " + category);
    var $list = $("<ul>").addClass("mw-portlet-body");

    // Fetch category members from the API
    new mw.Api().get({
        action: "query",
        list: "categorymembers",
        cmtitle: "Category:" + category,
        cmlimit: 10,
        format: "json"
    }).done(function (data) {
        if (data.query && data.query.categorymembers.length > 0) {
            data.query.categorymembers.forEach(function (page) {
                $list.append($("<li>").append($("<a>").attr("href", mw.util.getUrl(page.title)).text(page.title)));
            });

            $menu.append($heading).append($list);
            sidebar.append($menu); // Append the menu inside Timeless' sidebar
        }
    });
});