MediaWiki:Common.js:修订间差异

来自勿忘草与永远的少女
跳到导航跳到搜索
Admin留言 | 贡献
无编辑摘要
标签已被回退
Admin留言 | 贡献
无编辑摘要
 
(未显示同一用户的58个中间版本)
第26行: 第26行:
                     <a href="装备图鉴" class="nav-link">
                     <a href="装备图鉴" class="nav-link">
                         📊 装备图鉴
                         📊 装备图鉴
                    </a>
                    <a href="兑换中心" class="nav-link">
                        📊 兑换中心
                    </a>
                    <a href="羁绊详情" class="nav-link">
                        📊 羁绊详情
                     </a>
                     </a>
                     <a href="https://www.war3whj.top/war3wiki/moniqi/moniqi.html" class="nav-link">
                     <a href="https://www.war3whj.top/war3wiki/moniqi/moniqi.html" class="nav-link">
第87行: 第93行:
});
});


/* 棋子筛选器(原有的锚点筛选) */
/* ========== 棋子图鉴筛选功能(固定羁绊 + 包含匹配) ========== */
$(function() {
$(function() {
     $('a[href^="#"]').click(function(e) {
     var pageTitle = mw.config.get('wgTitle');
        e.preventDefault();
    if (pageTitle !== '棋子' && pageTitle !== '棋子图鉴') return;
        var filter = $(this).attr('href').substring(1);
 
    // ----------------------------------------------
    // 【自定义区域】请在这里填入你需要的固定羁绊列表
    // 筛选时会判断棋子的“羁绊”列是否包含这些字符串
    // ----------------------------------------------
    var FIXED_BOND_LIST = [
        "护卫", "暗杀者", "圣盾战士", "裁决使", "冰之魔女", "保镖", "重装战士", "神使者", "Geass",
        "雪下的誓言", "镜花水月", "神眼疾手", "武斗学院", "圆环之理", "救济的魔女", "叛逆的物语", "战略分析",
        "勇者", "东京食尸鬼", "坤比", "杀人冲动", "狂战士", "水之女神", "木灵使", "湖上的冰精", "叛逆小队", "游戏开发部",
        "法师", "狙神", "蓄力一击", "快枪手", "附魔师", "魔法少女", "迅击战士", "杀手", "宇智波的末裔", "六道之力",
        "我的回合抽卡", "最后的月牙天冲", "秘仪之影", "幕后花手", "中二病", "漆黑烈焰使", "世界的加护", "死亡笔记","奇迹之星",
        "我的刀盾","圣祈凝辉","锻刀匠","永远鲜红的幼月","红い血液の恶魔","姬守の死神","侠隐江湖","红月下的追猎者","被诅咒的英雄",
        "花冠谋天下","樱花庄的宠物女孩","孤高的移动堡垒","千恋万花","共赴远航","虚空权能","风纪委员会","不灭密钥","未竟的谎言",
        "涅槃重生","无间之神","梦幻崩华","闪光穿刺","刀剑神域","黑衣剑士","幽灵子弹","英雄作成","茧式源火","飞萤扑火","湖畔魔女",
        "超级新人","月读管理员","皇家骑士","银晓之舞","逆焰","一拳超人","圣剑的光辉","玉衡星","天使的心跳","即兴演出"
    ]; // 👈 按你的实际需要修改或增删


        if (filter === '全部') {
    // 等待 Cargo 表格出现
            $('.role-card').show();
    var maxAttempts = 50;
             return;
    var attempt = 0;
    var interval = setInterval(function() {
        var $table = $('table.cargoDynamicTable, table.cargoTable');
        if ($table.length > 0) {
            clearInterval(interval);
             initFilters($table);
        } else if (++attempt >= maxAttempts) {
            clearInterval(interval);
            console.warn('棋子筛选器:未找到 Cargo 表格');
         }
         }
    }, 200);
    function initFilters($table) {
        var $rows = $table.find('tbody tr');
        if ($rows.length === 0) return;
        if ($('#chess-filter-container').length) return;


         $('.role-card').each(function() {
         // 动态获取列索引
             var text = $(this).text();
        var headerCells = $table.find('thead tr th');
             if (text.includes(filter)) {
        var colMap = {};
                $(this).show();
        headerCells.each(function(index) {
             } else {
             var text = $(this).text().trim();
                $(this).hide();
             if (text === '元素')              colMap.element = index;  // ★ 只认「元素」,不匹配「弱点元素」
             }
            else if (text.includes('稀有度')) colMap.rarity  = index;
            else if (text.includes('费用')) colMap.cost = index;
             else if (text.includes('定位')) colMap.role = index;
             else if (text.includes('羁绊')) colMap.bond = index;
         });
         });
    });
        var COL_RARITY = colMap.rarity !== undefined ? colMap.rarity : 4;
});
        var COL_COST    = colMap.cost  !== undefined ? colMap.cost  : 5;
        var COL_ROLE    = colMap.role  !== undefined ? colMap.role  : 6;
        var COL_BOND    = colMap.bond  !== undefined ? colMap.bond  : 7;
        var COL_ELEMENT = colMap.element !== undefined ? colMap.element : 8;
 
        // 获取其他筛选器的唯一值(稀有度、费用、定位)保持不变
        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((a,b) => a.localeCompare(b, 'zh-CN'));
        }
        var rarityOpts = getUniqueValues(COL_RARITY);
        var costOpts  = getUniqueValues(COL_COST);
        var roleOpts  = getUniqueValues(COL_ROLE);
        var elementOpts = getUniqueValues(COL_ELEMENT);  // ★ 元素(单值)
        // 羁绊选项直接使用固定列表(已排序)
        var bondOpts = FIXED_BOND_LIST.slice().sort((a,b) => a.localeCompare(b, 'zh-CN'));


/* ========== 装备/棋子图鉴高级筛选器(TableFilter 类) ========== */
        // 构建筛选器界面
( function ( $, mw ) {
        var $filterDiv = $('<div id="chess-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>');
    'use strict';
        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:120px;"></div>');
    */
            $wrapper.append($('<label style="display:block;font-weight:bold;margin-bottom:5px;color:#2c3e50;">').text(labelText));
    class TableFilter {
            var $select = $('<select style="width:100%;padding:6px;border-radius:6px;border:1px solid #ccc;">').attr('id', id);
        /**
             $select.append($('<option value="">').text('全部'));
        * 创建一个新的 TableFilter 实例。
             optionsArray.forEach(function(val) {
        * @param {jQuery} $table - 要筛选的表格元素(jQuery 对象)。
                 $select.append($('<option>').attr('value', val).text(val));
        * @param {Object} options - 配置选项。
            });
        * @param {string[]} options.columns - 要为其创建筛选器的列索引数组(从0开始)。
            $wrapper.append($select);
        * @param {Object} options.labels - 筛选器列的显示名称。
             return $wrapper;
        * @param {number} options.headerRowIndex - 表头所在的行索引(默认为0)。
        }
        */
        constructor( $table, options ) {
             this.$table = $table;
             this.options = $.extend( {
                 columns: [],
                labels: {},
                headerRowIndex: 0
             }, options );


            // 存储每列的所有可能值
        $rowDiv.append(createSelect('⭐ 稀有度', 'filter-rarity', rarityOpts));
            this.columnValues = {};
        $rowDiv.append(createSelect('💰 费用', 'filter-cost', costOpts));
            // 存储当前的筛选状态 { 列索引: 选中的值 }
        $rowDiv.append(createSelect('⚔️ 定位', 'filter-role', roleOpts));
            this.currentFilters = {};
        $rowDiv.append(createSelect('🔗 羁绊', 'filter-bond', bondOpts));  // 使用固定羁绊列表
        $rowDiv.append(createSelect('🌀 元素',  'filter-element', elementOpts)); // ★ 元素


            this.init();
        var $btnWrapper = $('<div></div>');
         }
        var $resetBtn = $('<button id="reset-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="filter-stats" style="margin-top:10px;font-size:14px;color:#555;"></div>');
        * 初始化筛选器:构建UI,解析表格数据,绑定事件。
         $filterDiv.append($rowDiv).append($stats);
        */
        $table.before($filterDiv);
         init() {
            // 如果表格不存在或不是jQuery对象,则退出
            if ( !this.$table || !this.$table.length ) {
                return;
            }


            this.parseTableData();
        var $raritySelect = $('#filter-rarity');
            this.buildUI();
        var $costSelect = $('#filter-cost');
            this.bindEvents();
        var $roleSelect = $('#filter-role');
            this.updateStats();
        var $bondSelect = $('#filter-bond');
         }
         var $elementSelect = $('#filter-element');  // ★ 元素


         /**
         function applyFilters() {
        * 解析表格数据,获取每列的所有唯一值。
             var rarity = $raritySelect.val() || '';
        */
             var cost = $costSelect.val() || '';
        parseTableData() {
            var role = $roleSelect.val() || '';
             const self = this;
            var bond = $bondSelect.val() || '';  // 固定羁绊选中的值
             const $rows = this.$table.find( 'tr' ).slice( this.options.headerRowIndex + 1 ); // 跳过表头
            var element = $elementSelect.val() || '';   // ★ 元素


             this.options.columns.forEach( function( colIndex ) {
             var visibleCount = 0;
                 self.columnValues[ colIndex ] = new Set();
            $rows.each(function() {
                var $tds = $(this).find('td');
                var rowRarity = $tds.eq(COL_RARITY).text().trim();
                var rowCost  = $tds.eq(COL_COST).text().trim();
                var rowRole  = $tds.eq(COL_ROLE).text().trim();
                 var rowBond  = $tds.eq(COL_BOND).text().trim();  // 示例:"龙, 法师" 或 "斗士"
                var rowElement = $tds.eq(COL_ELEMENT).text().trim();   // ★ 元素


                 $rows.each( function() {
                 var match = true;
                    const $cell = $( this ).find( 'td, th' ).eq( colIndex );
                if (rarity && rowRarity !== rarity) match = false;
                    if ( $cell.length ) {
                if (cost  && rowCost  !== cost)   match = false;
                        const value = $.trim( $cell.text() );
                if (role  && rowRole  !== role)   match = false;
                        if ( value ) {
                // 【关键修改】羁绊筛选改为包含匹配(包含关系)
                            self.columnValues[ colIndex ].add( value );
                if (bond  && !rowBond.includes(bond)) match = false;
                        }
                 if (element && rowElement !== element) match = false;   // ★ 元素精确匹配
                    }
                 } );


                 // 将Set转换为数组,并按自然顺序排序
                 if (match) {
                 self.columnValues[ colIndex ] = Array.from( self.columnValues[ colIndex ] ).sort();
                    $(this).show();
             } );
                    visibleCount++;
        }
                 } else {
                    $(this).hide();
                }
             });


        /**
             $stats.text('当前显示 ' + visibleCount + ' 个棋子(共 ' + $rows.length + ' 个)');
        * 构建筛选器的UI界面。
        */
        buildUI() {
            const self = this;
             const $container = $( '<div>' ).addClass( 'equipment-filter-container' );


             this.options.columns.forEach( function( colIndex ) {
             var $noRow = $table.find('.no-results-row');
                 const $group = $( '<div>' ).addClass( 'equipment-filter-group' );
            if (visibleCount === 0) {
                const labelText = self.options.labels[ colIndex ] || '筛选';
                 if ($noRow.length === 0) {
                const $label = $( '<span>' ).addClass( 'equipment-filter-label' ).text( labelText + '' );
                    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();
            }
        }


                $group.append( $label );
        $raritySelect.on('change', applyFilters);
        $costSelect.on('change', applyFilters);
        $roleSelect.on('change', applyFilters);
        $bondSelect.on('change', applyFilters);
        $elementSelect.on('change', applyFilters);   // ★ 元素


                // 创建"全部"按钮
        $('#reset-filters').on('click', function() {
                const $allBtn = $( '<span>' )
            $raritySelect.val('');
                    .addClass( 'equipment-filter-btn active' )
            $costSelect.val('');
                    .attr( 'data-filter-col', colIndex )
            $roleSelect.val('');
                    .attr( 'data-filter-val', '' )
            $bondSelect.val('');
                    .text( '全部' );
            $elementSelect.val('');                  // ★ 元素
            applyFilters();
        });


                $group.append( $allBtn );
        applyFilters();
    }
});


                // 为每个唯一值创建按钮
/* ========== 装备图鉴筛选功能(仅类型、获取方式) ========== */
                const values = self.columnValues[ colIndex ] || [];
$(function() {
                values.forEach( function( val ) {
    // 判断是否为装备图鉴页面
                    const $btn = $( '<span>' )
    var pageTitle = mw.config.get('wgTitle');
                        .addClass( 'equipment-filter-btn' )
    if (pageTitle !== '装备图鉴') return;
                        .attr( 'data-filter-col', colIndex )
                        .attr( 'data-filter-val', val )
                        .text( val );


                    $group.append( $btn );
    // 等待 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);


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


            // 创建底部工具栏(清除按钮 + 统计信息)
        // 避免重复创建筛选器
            const $toolbar = $( '<div>' ).addClass( 'equipment-filter-group' );
        if ($('#equipment-filter-container').length) return;
            const $resetBtn = $( '<span>' ).addClass( 'equipment-filter-reset' ).text( '清除所有筛选' );
            const $stats = $( '<span>' ).addClass( 'equipment-filter-stat' );


             $toolbar.append( $resetBtn, $stats );
        // 通过表头动态获取列索引(更稳健)
             $container.append( $toolbar );
        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,类型,获取方式,合成公式)
            this.$table.before( $container );
        var COL_TYPE  = colMap.type  !== undefined ? colMap.type  : 4; // 类型
        var COL_SOURCE = colMap.source !== undefined ? colMap.source : 5; // 获取方式


            // 保存UI元素的引用
        // 从表格提取唯一值
             this.$container = $container;
        function getUniqueValues(colIndex) {
             this.$stats = $stats;
             var set = new Set();
             this.$resetBtn = $resetBtn;
             $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);
        * 绑定UI元素的事件。
        var sourceOpts = getUniqueValues(COL_SOURCE);
        */
 
         bindEvents() {
        // 构建筛选器容器
            const self = this;
         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>');


            // 筛选按钮点击事件
        // 创建下拉框的辅助函数
             this.$container.on( 'click', '.equipment-filter-btn', function() {
        function createSelect(labelText, id, optionsArray) {
                const $btn = $( this );
             var $wrapper = $('<div style="min-width:160px;"></div>');
                const col = $btn.data( 'filter-col' );
            $wrapper.append($('<label style="display:block;font-weight:bold;margin-bottom:5px;color:#2c3e50;">').text(labelText));
                 const val = $btn.data( 'filter-val' );
            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;
        }


                // 切换active类
        $rowDiv.append(createSelect('📦 类型', 'filter-type', typeOpts));
                $btn.closest( '.equipment-filter-group' ).find( '.equipment-filter-btn' ).removeClass( 'active' );
        $rowDiv.append(createSelect('🔍 获取方式', 'filter-source', sourceOpts));
                $btn.addClass( 'active' );


                // 更新筛选状态
        var $btnWrapper = $('<div></div>');
                if ( val === '' ) {
        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>');
                    delete self.currentFilters[ col ];
        $btnWrapper.append($resetBtn);
                } else {
        $rowDiv.append($btnWrapper);
                    self.currentFilters[ col ] = val;
                }


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


            // 清除筛选按钮点击事件
        // 插入到表格前
            this.$resetBtn.on( 'click', function() {
        $table.before($filterDiv);
                self.clearFilters();
            } );
        }


         /**
         // 绑定筛选逻辑
        * 应用当前的筛选条件,更新表格显示。
         var $typeSelect = $('#filter-type');
        */
        var $sourceSelect = $('#filter-source');
         applyFilters() {
            const self = this;
            const $rows = this.$table.find( 'tr' ).slice( this.options.headerRowIndex + 1 );
            let visibleCount = 0;


            $rows.each( function() {
        function applyFilters() {
                const $row = $( this );
            var type = $typeSelect.val() || '';
                let showRow = true;
            var source = $sourceSelect.val() || '';


                // 遍历当前所有的筛选条件
            var visibleCount = 0;
                $.each( self.currentFilters, function( col, val ) {
            $rows.each(function() {
                    const $cell = $row.find( 'td, th' ).eq( parseInt( col ) );
                var $tds = $(this).find('td');
                    const cellValue = $.trim( $cell.text() );
                var rowType  = $tds.eq(COL_TYPE).text().trim();
                var rowSource = $tds.eq(COL_SOURCE).text().trim();


                    if ( cellValue !== val ) {
                var match = true;
                        showRow = false;
                if (type  && rowType  !== type)   match = false;
                        return false; // 跳出 each 循环
                 if (source && rowSource !== source) match = false;
                    }
                 } );


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


             this.updateStats( visibleCount );
             $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() {
         clearFilters() {
             $typeSelect.val('');
            this.currentFilters = {};
            $sourceSelect.val('');
            this.$container.find( '.equipment-filter-btn' ).removeClass( 'active' );
            applyFilters();
             // 激活"全部"按钮
        });
            this.$container.find( '.equipment-filter-btn[data-filter-val=""]' ).addClass( 'active' );
 
        // 初始统计
        applyFilters();
    }
});


             const $rows = this.$table.find( 'tr' ).slice( this.options.headerRowIndex + 1 );
// 推荐直播间轮播切换(仅圆点版本,无箭头)
             $rows.show();
(function() {
             this.updateStats( $rows.length );
    var streams = [
        {
            name: "B站主播:我就要迟到了哎",
             desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/b/ba/%E4%B8%BB%E6%92%AD1.png",
            link: "https://live.bilibili.com/1896524667"
        },
        {
            name: "B站主播:迦尔纳_Karna",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/d/d5/%E4%B8%BB%E6%92%AD2.png",
            link: "https://live.bilibili.com/14628031"
        },
        {
            name: "B站主播:Elaina美好(地图作者)",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/9/9d/%E4%B8%BB%E6%92%AD3.png",
            link: "https://live.bilibili.com/9457306"
        },
        {
            name: "B站主播:恶魔糊",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/7/75/%E4%B8%BB%E6%92%AD4.png",
            link: "https://live.bilibili.com/25195277"
        },
                {
            name: "B站主播:苏梦瑶-official",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/1/12/%E4%B8%BB%E6%92%AD5.png",
            link: "https://live.bilibili.com/22892087"
        },
              {
            name: "B站主播:水人儿",
            desc: "点击图片跳转至直播间",
             cover: "https://www.war3whj.top/war3wiki/images/a/ab/%E4%B8%BB%E6%92%AD6.png",
             link: "https://live.bilibili.com/22363449"
         }
         }
    ];
    var AUTO_INTERVAL = 5000;
    var currentIndex = 0;
    var total = streams.length;
    var timer = null;
    var coverDiv = document.getElementById('live-cover-img');
    var nameSpan = document.getElementById('live-name');
    var descSpan = document.getElementById('live-desc');
    var dotsContainer = document.getElementById('live-dots');


        /**
    // 生成圆点
        * 更新统计信息(显示匹配行数)。
    function buildDots() {
        * @param {number} visibleCount - 当前可见的行数。
        if (!dotsContainer) return;
        */
        dotsContainer.innerHTML = '';
        updateStats( visibleCount ) {
        for (var i = 0; i < total; i++) {
            if ( this.$stats ) {
            var dot = document.createElement('span');
                const totalRows = this.$table.find( 'tr' ).length - ( this.options.headerRowIndex + 1 );
            dot.setAttribute('data-index', i);
                 this.$stats.text( `显示 ${visibleCount} / ${totalRows} 项` );
            dot.style.cssText = 'width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: all 0.2s; display: inline-block;';
            if (i === currentIndex) {
                dot.style.background = 'white';
                 dot.style.transform = 'scale(1.2)';
             }
             }
            dot.addEventListener('click', (function(idx) {
                return function() {
                    stopAutoPlay();
                    currentIndex = idx;
                    updateDisplay();
                    startAutoPlay();
                };
            })(i));
            dotsContainer.appendChild(dot);
         }
         }
     }
     }


     /**
     function updateDots() {
    * 当页面加载完成后,初始化筛选器。
         if (!dotsContainer) return;
    */
         var dots = dotsContainer.querySelectorAll('span');
    $( document ).ready( function() {
         for (var i = 0; i < dots.length; i++) {
         // 检查当前页面是否包含需要筛选的表格
            var dot = dots[i];
         const $table = $( '.equipment-filter-target' );
            if (i === currentIndex) {
         if ( !$table.length ) {
                dot.style.background = 'white';
             return;
                dot.style.transform = 'scale(1.2)';
             } else {
                dot.style.background = 'rgba(255,255,255,0.5)';
                dot.style.transform = 'scale(1)';
            }
         }
         }
    }


        // ========== 筛选器配置(请根据你的表格列顺序修改) ==========
    function updateDisplay() {
        // 棋子图鉴表格字段顺序:图片, 图片文件名, 名称, _pageName, 稀有度, 费用, 定位, 羁绊
         var data = streams[currentIndex];
         // 对应的列索引(从0开始):
        if (!data) return;
        // 0:图片  1:图片文件名  2:名称  3:_pageName  4:稀有度  5:费用  6:定位  7:羁绊
        if (coverDiv) {
        const filterConfig = {
             coverDiv.style.backgroundImage = 'url(' + data.cover + ')';
            columns: [ 4, 5, 6, 7 ], // 对稀有度(4)、费用(5)、定位(6)、羁绊(7)进行筛选
            coverDiv.setAttribute('data-link', data.link);
             labels: {
        }
                4: '稀有度',
        if (nameSpan) nameSpan.textContent = data.name;
                5: '费用',
        if (descSpan) descSpan.textContent = data.desc;
                6: '定位',
         updateDots();
                7: '羁绊'
    }
            },
            headerRowIndex: 0 // 表头在第0行
         };


         // 实例化 TableFilter
    function next() {
         new TableFilter( $table, filterConfig );
         currentIndex = (currentIndex + 1) % total;
     } );
         updateDisplay();
     }


} )( jQuery, mediaWiki );
    function prev() {
        currentIndex = (currentIndex - 1 + total) % total;
        updateDisplay();
    }
 
    function startAutoPlay() {
        if (timer) clearInterval(timer);
        timer = setInterval(next, AUTO_INTERVAL);
    }
 
    function stopAutoPlay() {
        if (timer) {
            clearInterval(timer);
            timer = null;
        }
    }
 
    function init() {
        if (!coverDiv) return;
 
        coverDiv.addEventListener('click', function() {
            var link = coverDiv.getAttribute('data-link');
            if (link) window.open(link, '_blank');
        });
 
        buildDots();
        updateDisplay();
        startAutoPlay();
 
        var container = document.getElementById('live-carousel-container');
        if (container) {
            container.addEventListener('mouseenter', stopAutoPlay);
            container.addEventListener('mouseleave', startAutoPlay);
        }
    }
 
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})();

2026年9月19日 (六) 16:59的最新版本

/* 这里的任何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="兑换中心" 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() {
    var pageTitle = mw.config.get('wgTitle');
    if (pageTitle !== '棋子' && pageTitle !== '棋子图鉴') return;

    // ----------------------------------------------
    // 【自定义区域】请在这里填入你需要的固定羁绊列表
    // 筛选时会判断棋子的“羁绊”列是否包含这些字符串
    // ----------------------------------------------
    var FIXED_BOND_LIST = [
        "护卫", "暗杀者", "圣盾战士", "裁决使", "冰之魔女", "保镖", "重装战士", "神使者", "Geass", 
        "雪下的誓言", "镜花水月", "神眼疾手", "武斗学院", "圆环之理", "救济的魔女", "叛逆的物语", "战略分析", 
        "勇者", "东京食尸鬼", "坤比", "杀人冲动", "狂战士", "水之女神", "木灵使", "湖上的冰精", "叛逆小队", "游戏开发部", 
        "法师", "狙神", "蓄力一击", "快枪手", "附魔师", "魔法少女", "迅击战士", "杀手", "宇智波的末裔", "六道之力", 
        "我的回合抽卡", "最后的月牙天冲", "秘仪之影", "幕后花手", "中二病", "漆黑烈焰使", "世界的加护", "死亡笔记","奇迹之星",
        "我的刀盾","圣祈凝辉","锻刀匠","永远鲜红的幼月","红い血液の恶魔","姬守の死神","侠隐江湖","红月下的追猎者","被诅咒的英雄",
        "花冠谋天下","樱花庄的宠物女孩","孤高的移动堡垒","千恋万花","共赴远航","虚空权能","风纪委员会","不灭密钥","未竟的谎言",
        "涅槃重生","无间之神","梦幻崩华","闪光穿刺","刀剑神域","黑衣剑士","幽灵子弹","英雄作成","茧式源火","飞萤扑火","湖畔魔女",
        "超级新人","月读管理员","皇家骑士","银晓之舞","逆焰","一拳超人","圣剑的光辉","玉衡星","天使的心跳","即兴演出"
    ];  // 👈 按你的实际需要修改或增删

    // 等待 Cargo 表格出现
    var maxAttempts = 50;
    var attempt = 0;
    var interval = setInterval(function() {
        var $table = $('table.cargoDynamicTable, table.cargoTable');
        if ($table.length > 0) {
            clearInterval(interval);
            initFilters($table);
        } else if (++attempt >= maxAttempts) {
            clearInterval(interval);
            console.warn('棋子筛选器:未找到 Cargo 表格');
        }
    }, 200);

    function initFilters($table) {
        var $rows = $table.find('tbody tr');
        if ($rows.length === 0) return;
        if ($('#chess-filter-container').length) return;

        // 动态获取列索引
        var headerCells = $table.find('thead tr th');
        var colMap = {};
        headerCells.each(function(index) {
            var text = $(this).text().trim();
            if (text === '元素')               colMap.element = index;   // ★ 只认「元素」,不匹配「弱点元素」
            else if (text.includes('稀有度'))  colMap.rarity  = index;
            else if (text.includes('费用')) colMap.cost = index;
            else if (text.includes('定位')) colMap.role = index;
            else if (text.includes('羁绊')) colMap.bond = index;
        });
        var COL_RARITY = colMap.rarity !== undefined ? colMap.rarity : 4;
        var COL_COST    = colMap.cost   !== undefined ? colMap.cost   : 5;
        var COL_ROLE    = colMap.role   !== undefined ? colMap.role   : 6;
        var COL_BOND    = colMap.bond   !== undefined ? colMap.bond   : 7;
        var COL_ELEMENT = colMap.element !== undefined ? colMap.element : 8;

        // 获取其他筛选器的唯一值(稀有度、费用、定位)保持不变
        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((a,b) => a.localeCompare(b, 'zh-CN'));
        }
        var rarityOpts = getUniqueValues(COL_RARITY);
        var costOpts   = getUniqueValues(COL_COST);
        var roleOpts   = getUniqueValues(COL_ROLE);
        var elementOpts = getUniqueValues(COL_ELEMENT);   // ★ 元素(单值)
        // 羁绊选项直接使用固定列表(已排序)
        var bondOpts = FIXED_BOND_LIST.slice().sort((a,b) => a.localeCompare(b, 'zh-CN'));

        // 构建筛选器界面
        var $filterDiv = $('<div id="chess-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:120px;"></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-rarity', rarityOpts));
        $rowDiv.append(createSelect('💰 费用', 'filter-cost', costOpts));
        $rowDiv.append(createSelect('⚔️ 定位', 'filter-role', roleOpts));
        $rowDiv.append(createSelect('🔗 羁绊', 'filter-bond', bondOpts));  // 使用固定羁绊列表
        $rowDiv.append(createSelect('🌀 元素',   'filter-element', elementOpts));  // ★ 元素

        var $btnWrapper = $('<div></div>');
        var $resetBtn = $('<button id="reset-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="filter-stats" style="margin-top:10px;font-size:14px;color:#555;"></div>');
        $filterDiv.append($rowDiv).append($stats);
        $table.before($filterDiv);

        var $raritySelect = $('#filter-rarity');
        var $costSelect = $('#filter-cost');
        var $roleSelect = $('#filter-role');
        var $bondSelect = $('#filter-bond');
        var $elementSelect = $('#filter-element');   // ★ 元素

        function applyFilters() {
            var rarity = $raritySelect.val() || '';
            var cost = $costSelect.val() || '';
            var role = $roleSelect.val() || '';
            var bond = $bondSelect.val() || '';  // 固定羁绊选中的值
            var element = $elementSelect.val() || '';   // ★ 元素

            var visibleCount = 0;
            $rows.each(function() {
                var $tds = $(this).find('td');
                var rowRarity = $tds.eq(COL_RARITY).text().trim();
                var rowCost   = $tds.eq(COL_COST).text().trim();
                var rowRole   = $tds.eq(COL_ROLE).text().trim();
                var rowBond   = $tds.eq(COL_BOND).text().trim();  // 示例:"龙, 法师" 或 "斗士"
                var rowElement = $tds.eq(COL_ELEMENT).text().trim();   // ★ 元素

                var match = true;
                if (rarity && rowRarity !== rarity) match = false;
                if (cost   && rowCost   !== cost)   match = false;
                if (role   && rowRole   !== role)   match = false;
                // 【关键修改】羁绊筛选改为包含匹配(包含关系)
                if (bond   && !rowBond.includes(bond)) match = false;
                if (element && rowElement !== element) 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();
            }
        }

        $raritySelect.on('change', applyFilters);
        $costSelect.on('change', applyFilters);
        $roleSelect.on('change', applyFilters);
        $bondSelect.on('change', applyFilters);
        $elementSelect.on('change', applyFilters);   // ★ 元素

        $('#reset-filters').on('click', function() {
            $raritySelect.val('');
            $costSelect.val('');
            $roleSelect.val('');
            $bondSelect.val('');
            $elementSelect.val('');                  // ★ 元素
            applyFilters();
        });

        applyFilters();
    }
});

/* ========== 装备图鉴筛选功能(仅类型、获取方式) ========== */
$(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();
    }
});

// 推荐直播间轮播切换(仅圆点版本,无箭头)
(function() {
    var streams = [
        {
            name: "B站主播:我就要迟到了哎",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/b/ba/%E4%B8%BB%E6%92%AD1.png",
            link: "https://live.bilibili.com/1896524667"
        },
        {
            name: "B站主播:迦尔纳_Karna",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/d/d5/%E4%B8%BB%E6%92%AD2.png",
            link: "https://live.bilibili.com/14628031"
        },
        {
            name: "B站主播:Elaina美好(地图作者)",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/9/9d/%E4%B8%BB%E6%92%AD3.png",
            link: "https://live.bilibili.com/9457306"
        },
        {
            name: "B站主播:恶魔糊",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/7/75/%E4%B8%BB%E6%92%AD4.png",
            link: "https://live.bilibili.com/25195277"
        },
                {
            name: "B站主播:苏梦瑶-official",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/1/12/%E4%B8%BB%E6%92%AD5.png",
            link: "https://live.bilibili.com/22892087"
        },
               {
            name: "B站主播:水人儿",
            desc: "点击图片跳转至直播间",
            cover: "https://www.war3whj.top/war3wiki/images/a/ab/%E4%B8%BB%E6%92%AD6.png",
            link: "https://live.bilibili.com/22363449"
        }
    ];

    var AUTO_INTERVAL = 5000;
    var currentIndex = 0;
    var total = streams.length;
    var timer = null;

    var coverDiv = document.getElementById('live-cover-img');
    var nameSpan = document.getElementById('live-name');
    var descSpan = document.getElementById('live-desc');
    var dotsContainer = document.getElementById('live-dots');

    // 生成圆点
    function buildDots() {
        if (!dotsContainer) return;
        dotsContainer.innerHTML = '';
        for (var i = 0; i < total; i++) {
            var dot = document.createElement('span');
            dot.setAttribute('data-index', i);
            dot.style.cssText = 'width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: all 0.2s; display: inline-block;';
            if (i === currentIndex) {
                dot.style.background = 'white';
                dot.style.transform = 'scale(1.2)';
            }
            dot.addEventListener('click', (function(idx) {
                return function() {
                    stopAutoPlay();
                    currentIndex = idx;
                    updateDisplay();
                    startAutoPlay();
                };
            })(i));
            dotsContainer.appendChild(dot);
        }
    }

    function updateDots() {
        if (!dotsContainer) return;
        var dots = dotsContainer.querySelectorAll('span');
        for (var i = 0; i < dots.length; i++) {
            var dot = dots[i];
            if (i === currentIndex) {
                dot.style.background = 'white';
                dot.style.transform = 'scale(1.2)';
            } else {
                dot.style.background = 'rgba(255,255,255,0.5)';
                dot.style.transform = 'scale(1)';
            }
        }
    }

    function updateDisplay() {
        var data = streams[currentIndex];
        if (!data) return;
        if (coverDiv) {
            coverDiv.style.backgroundImage = 'url(' + data.cover + ')';
            coverDiv.setAttribute('data-link', data.link);
        }
        if (nameSpan) nameSpan.textContent = data.name;
        if (descSpan) descSpan.textContent = data.desc;
        updateDots();
    }

    function next() {
        currentIndex = (currentIndex + 1) % total;
        updateDisplay();
    }

    function prev() {
        currentIndex = (currentIndex - 1 + total) % total;
        updateDisplay();
    }

    function startAutoPlay() {
        if (timer) clearInterval(timer);
        timer = setInterval(next, AUTO_INTERVAL);
    }

    function stopAutoPlay() {
        if (timer) {
            clearInterval(timer);
            timer = null;
        }
    }

    function init() {
        if (!coverDiv) return;

        coverDiv.addEventListener('click', function() {
            var link = coverDiv.getAttribute('data-link');
            if (link) window.open(link, '_blank');
        });

        buildDots();
        updateDisplay();
        startAutoPlay();

        var container = document.getElementById('live-carousel-container');
        if (container) {
            container.addEventListener('mouseenter', stopAutoPlay);
            container.addEventListener('mouseleave', startAutoPlay);
        }
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})();