MediaWiki:Common.js

来自勿忘草与永远的少女
Admin留言 | 贡献2026年5月10日 (日) 08:18的版本
跳到导航跳到搜索

注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的变更的影响。

  • Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5Ctrl-R(Mac为⌘-R
  • Google Chrome:Ctrl-Shift-R(Mac为⌘-Shift-R
  • Internet Explorer或Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
  • Opera:Ctrl-F5
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
$(function() {
    // 检查是否已存在导航栏,避免重复添加
    if ($('.fixed-top-nav').length === 0) {
        
        // 导航栏 HTML 结构
        var navHtml = `
            <div class="fixed-top-nav">
                <a href="首页" class="nav-logo">
                    <img src="/wikibg/logo.jpg" alt="网站Logo">
                    <span>万华镜</span>
                </a>
                <div class="nav-links">
                    <a href="首页" class="nav-link">
                        📚 首页
                    </a>
                    <a href="游戏攻略" class="nav-link">
                        📖 游戏攻略
                    </a>
                    <a href="棋子" class="nav-link">
                        ⚔️ 棋子图鉴
                    </a>
                    <a href="天赋图鉴" class="nav-link">
                        🗺️ 天赋图鉴
                    </a>
                    <a href="装备图鉴" class="nav-link">
                        📊 装备图鉴
                    </a>
                    <a href="https://www.war3whj.top/war3wiki/moniqi/moniqi.html" class="nav-link">
                        📊 阵容模拟器
                    </a>
                </div>
            </div>
        `;
        
        // 将导航栏插入到 body 开头
        $('body').prepend(navHtml);
        
        // 滚动时添加效果(可选)
        $(window).scroll(function() {
            if ($(window).scrollTop() > 50) {
                $('.fixed-top-nav').addClass('scrolled');
            } else {
                $('.fixed-top-nav').removeClass('scrolled');
            }
        });
    }
});


$(function() {
    // 确保页脚固定在底部
    var footer = $('#footer, .mw-footer');
    
    if (footer.length > 0) {
        // 设置底部内边距避免内容被遮挡
        var footerHeight = footer.outerHeight();
        $('body').css('padding-bottom', footerHeight + 20 + 'px');
        
        // 窗口大小改变时重新计算
        $(window).resize(function() {
            var newHeight = footer.outerHeight();
            $('body').css('padding-bottom', newHeight + 20 + 'px');
        });
    }
});

$(function() {
    // 为角色卡片添加悬停效果(可选,纯CSS已有,这里作为备用)
    $('.character-card').hover(
        function() { $(this).addClass('hover'); },
        function() { $(this).removeClass('hover'); }
    );
    
    // 动态计算右侧边栏高度(可选,用于对齐)
    function adjustSidebarHeight() {
        var leftHeight = $('.custom-homepage .left-column').outerHeight();
        var rightHeight = $('.custom-homepage .right-column').outerHeight();
        if (rightHeight < leftHeight && $(window).width() > 768) {
            $('.custom-homepage .right-column').css('min-height', leftHeight);
        }
    }
    
    // 延迟执行,等待图片加载完成
    setTimeout(adjustSidebarHeight, 500);
    $(window).resize(adjustSidebarHeight);
});

// 羁绊筛选器
(function() {
  // 固定的羁绊列表(按你游戏的实际值改)
  const BOND_LIST = ['全部', '法师', '圣盾战士', '死亡笔记', '世界的加护', '圆环之理', '冰之魔女'];
  
  function initChessFilter() {
    var container = document.getElementById('chess-table');
    if (!container) return;
    
    // 找到 Cargo 生成的表格
    var table = container.querySelector('table.cargoDynamicTable');
    if (!table) return;
    
    // 找到表头中“羁绊”那一列的 select
    var headerCells = table.querySelectorAll('thead th');
    var targetSelect = null;
    var bondColumnIndex = -1;
    
    headerCells.forEach(function(th, idx) {
      var select = th.querySelector('select');
      // Cargo 会在 th 上加 data-field 属性,可以用这个匹配
      if (select && th.getAttribute('data-field') === '羁绊') {
        targetSelect = select;
        bondColumnIndex = idx;
      }
    });
    
    if (!targetSelect || bondColumnIndex === -1) return;
    
    // 1) 替换下拉选项为固定羁绊
    targetSelect.innerHTML = '';
    BOND_LIST.forEach(function(bond) {
      var opt = document.createElement('option');
      opt.value = bond;
      opt.textContent = bond;
      targetSelect.appendChild(opt);
    });
    targetSelect.value = '全部'; // 默认选中“全部”
    
    // 2) 解除 Cargo 原有的筛选事件,绑上我们自己的筛选逻辑
    targetSelect.onchange = null; // 干掉原有事件(如果它是通过属性绑定的)
    // 为防止 Cargo 使用的是 addEventListener,我们克隆节点替换
    var newSelect = targetSelect.cloneNode(true);
    targetSelect.parentNode.replaceChild(newSelect, targetSelect);
    
    // 重新获取新 select 引用
    targetSelect = newSelect;
    
    // 获取所有数据行
    var tbody = table.querySelector('tbody');
    var rows = tbody.querySelectorAll('tr');
    
    // 筛选函数
    function filterBond() {
      var selected = targetSelect.value;
      rows.forEach(function(row) {
        var cells = row.querySelectorAll('td');
        if (cells.length <= bondColumnIndex) return;
        var bondCell = cells[bondColumnIndex];
        var bondText = bondCell.textContent.trim();
        
        if (selected === '全部') {
          row.style.display = '';
          return;
        }
        
        // 将单元格内的羁绊按逗号、顿号拆开,判断是否包含所选羁绊
        var bonds = bondText.split(/[,,、]/).map(function(s) { return s.trim(); });
        if (bonds.indexOf(selected) !== -1) {
          row.style.display = '';
        } else {
          row.style.display = 'none';
        }
      });
    }
    
    targetSelect.addEventListener('change', filterBond);
    // 如果需要,可以立即执行一次确保初始状态(默认“全部”不必)
  }
  
  // 页面加载后执行
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initChessFilter);
  } else {
    initChessFilter();
  }
})();


/* ========== 装备图鉴筛选功能(仅类型、获取方式) ========== */
$(function() {
    // 判断是否为装备图鉴页面
    var pageTitle = mw.config.get('wgTitle');
    if (pageTitle !== '装备图鉴') return;

    // 等待 Cargo 表格出现(最多等待 5 秒)
    var maxAttempts = 50;
    var attempt = 0;
    var interval = setInterval(function() {
        var $table = $('table.cargoDynamicTable, table.cargoTable');
        if ($table.length > 0) {
            clearInterval(interval);
            initEquipmentFilters($table);
        } else if (++attempt >= maxAttempts) {
            clearInterval(interval);
            console.warn('装备图鉴筛选器:未找到 Cargo 表格');
        }
    }, 200);

    function initEquipmentFilters($table) {
        var $rows = $table.find('tbody tr');
        if ($rows.length === 0) return;

        // 避免重复创建筛选器
        if ($('#equipment-filter-container').length) return;

        // 通过表头动态获取列索引(更稳健)
        var headerCells = $table.find('thead tr th');
        var colMap = {};
        headerCells.each(function(index) {
            var text = $(this).text().trim();
            if (text.includes('类型')) colMap.type = index;
            else if (text.includes('获取方式')) colMap.source = index;
        });

        // 回退到固定索引(根据您的 fields 顺序:图片,图片文件名,名称,_pageName,类型,获取方式,合成公式)
        var COL_TYPE   = colMap.type   !== undefined ? colMap.type   : 4; // 类型
        var COL_SOURCE = colMap.source !== undefined ? colMap.source : 5; // 获取方式

        // 从表格提取唯一值
        function getUniqueValues(colIndex) {
            var set = new Set();
            $rows.each(function() {
                var text = $(this).find('td').eq(colIndex).text().trim();
                if (text) set.add(text);
            });
            return Array.from(set).sort(function(a, b) {
                return a.localeCompare(b, 'zh-CN');
            });
        }

        var typeOpts   = getUniqueValues(COL_TYPE);
        var sourceOpts = getUniqueValues(COL_SOURCE);

        // 构建筛选器容器
        var $filterDiv = $('<div id="equipment-filter-container" style="margin:20px 0;padding:15px;background:rgba(255,255,255,0.9);border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,0.1);"></div>');
        var $rowDiv = $('<div style="display:flex;flex-wrap:wrap;gap:15px;align-items:flex-end;"></div>');

        // 创建下拉框的辅助函数
        function createSelect(labelText, id, optionsArray) {
            var $wrapper = $('<div style="min-width:160px;"></div>');
            $wrapper.append($('<label style="display:block;font-weight:bold;margin-bottom:5px;color:#2c3e50;">').text(labelText));
            var $select = $('<select style="width:100%;padding:6px;border-radius:6px;border:1px solid #ccc;">').attr('id', id);
            $select.append($('<option value="">').text('全部'));
            optionsArray.forEach(function(val) {
                $select.append($('<option>').attr('value', val).text(val));
            });
            $wrapper.append($select);
            return $wrapper;
        }

        $rowDiv.append(createSelect('📦 类型', 'filter-type', typeOpts));
        $rowDiv.append(createSelect('🔍 获取方式', 'filter-source', sourceOpts));

        var $btnWrapper = $('<div></div>');
        var $resetBtn = $('<button id="reset-equipment-filters" style="padding:6px 20px;background:#2c3e50;color:#fff;border:none;border-radius:20px;cursor:pointer;font-weight:bold;">重置筛选</button>');
        $btnWrapper.append($resetBtn);
        $rowDiv.append($btnWrapper);

        var $stats = $('<div id="equipment-filter-stats" style="margin-top:10px;font-size:14px;color:#555;"></div>');
        $filterDiv.append($rowDiv).append($stats);

        // 插入到表格前
        $table.before($filterDiv);

        // 绑定筛选逻辑
        var $typeSelect = $('#filter-type');
        var $sourceSelect = $('#filter-source');

        function applyFilters() {
            var type = $typeSelect.val() || '';
            var source = $sourceSelect.val() || '';

            var visibleCount = 0;
            $rows.each(function() {
                var $tds = $(this).find('td');
                var rowType   = $tds.eq(COL_TYPE).text().trim();
                var rowSource = $tds.eq(COL_SOURCE).text().trim();

                var match = true;
                if (type   && rowType   !== type)   match = false;
                if (source && rowSource !== source) match = false;

                if (match) {
                    $(this).show();
                    visibleCount++;
                } else {
                    $(this).hide();
                }
            });

            $stats.text('当前显示 ' + visibleCount + ' 件装备(共 ' + $rows.length + ' 件)');

            // 无结果时添加提示行
            var $noRow = $table.find('.no-results-row');
            if (visibleCount === 0) {
                if ($noRow.length === 0) {
                    var colSpan = $table.find('thead tr th').length;
                    $table.find('tbody').append(
                        $('<tr class="no-results-row">').append(
                            $('<td>').attr('colspan', colSpan).css({
                                'text-align': 'center',
                                'padding': '20px',
                                'color': '#999'
                            }).text('没有符合条件的装备')
                        )
                    );
                }
            } else {
                $noRow.remove();
            }
        }

        $typeSelect.on('change', applyFilters);
        $sourceSelect.on('change', applyFilters);
        $('#reset-equipment-filters').on('click', function() {
            $typeSelect.val('');
            $sourceSelect.val('');
            applyFilters();
        });

        // 初始统计
        applyFilters();
    }
});