卡厄思
梦
境
菜单
首页
回到首页
WIKI工具
全站样式
全站JS
修改导航栏
测试
沙盒
可视化管理器
战斗员管理器
卡牌管理器
伙伴管理器
装备管理器
词典管理器
图鉴
战斗员
伙伴
装备
怪物卡牌
中立卡牌
词典
小工具
配队模拟器
节奏榜生成器
搜索
链入页面
相关更改
特殊页面
页面信息
最近更改
登录
MediaWiki
查看“︁Common.js”︁的源代码
←
MediaWiki:Common.js
因为以下原因,您没有权限编辑该页面:
您请求的操作仅限属于该用户组的用户执行:
用户
此页面为本wiki上的软件提供界面文本,并受到保护以防止滥用。 如欲修改所有wiki的翻译,请访问
translatewiki.net
上的MediaWiki本地化项目。
您无权编辑此JavaScript页面,因为编辑此页面可能会影响所有访问者。
您可以查看和复制此页面的源代码。
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */ if (mw.config.get('wgPageName') === 'MediaWiki:Card') { mw.loader.load('/index.php?title=MediaWiki:Card.js&action=raw&ctype=text/javascript'); } if (mw.config.get('wgPageName') === 'MediaWiki:Agent') { mw.loader.load('/index.php?title=MediaWiki:Agent.js&action=raw&ctype=text/javascript'); } if (mw.config.get('wgPageName') === 'MediaWiki:Dictionary') { mw.loader.load('/index.php?title=MediaWiki:Dictionary.js&action=raw&ctype=text/javascript'); } /* 切换标签 */ (function() { 'use strict'; function initTabSwitcher() { var tabContainers = document.querySelectorAll('.resp-tabs'); tabContainers.forEach(function(container) { var tabButtons = container.querySelectorAll('.czn-list-style'); if (tabButtons.length === 0) return; var tabContents = container.querySelectorAll('.resp-tab-content'); // 初始化 tabButtons.forEach(function(button, index) { button.classList.toggle('active', index === 0); }); if (tabContents.length > 0) { tabContents.forEach(function(content, index) { content.style.display = index === 0 ? 'block' : 'none'; }); } // 点击事件 tabButtons.forEach(function(button, index) { button.addEventListener('click', function(e) { e.preventDefault(); // 更新标签状态 tabButtons.forEach(function(btn, i) { btn.classList.toggle('active', i === index); }); // 切换内容 if (tabContents.length > 0) { tabContents.forEach(function(content, i) { content.style.display = i === index ? 'block' : 'none'; }); } }); }); }); } // 初始化 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initTabSwitcher); } else { initTabSwitcher(); } })(); /* 战斗员筛选 */ $(function() { // 初始化筛选系统 function initFilterSystem() { // 清理数据并设置属性 $('.战斗员卡片').each(function() { var $card = $(this); var rarity = ($card.attr('data-rarity') || '').trim(); var profession = ($card.attr('data-profession') || '').trim(); var attribute = ($card.attr('data-attribute') || '').trim(); $card.attr({ 'data-rarity': rarity, 'data-profession': profession, 'data-attribute': attribute }); }); // 存储当前筛选状态 var activeFilters = {}; // 筛选按钮点击事件 $('.filter-button').off('click').on('click', function(e) { e.preventDefault(); var $button = $(this); var group = String($button.data('filter-group')); var value = String($button.data('filter-value')).trim(); // 切换按钮状态 if (group === '0' && value === '0') { // 查看全部按钮 $('.filter-button').removeClass('active'); $button.addClass('active'); activeFilters = {}; } else { // 其他筛选按钮 $('.filter-button[data-filter-group="0"]').removeClass('active'); // 同组内只能选择一个 $('.filter-button[data-filter-group="' + group + '"]').removeClass('active'); if (activeFilters[group] === value) { // 如果点击已激活的按钮,则取消选择 delete activeFilters[group]; $button.removeClass('active'); } else { // 激活新的筛选 $button.addClass('active'); activeFilters[group] = value; } // 如果没有任何筛选项,激活"查看全部" if (Object.keys(activeFilters).length === 0) { $('.filter-button[data-filter-group="0"][data-filter-value="0"]').addClass('active'); } } // 应用筛选 applyFilters(); }); // 应用筛选函数 function applyFilters() { $('.战斗员卡片').each(function() { var $card = $(this); var shouldShow = true; // 检查每个激活的筛选条件 for (var group in activeFilters) { var filterValue = String(activeFilters[group]).trim(); var cardValue = ''; // 根据组号获取对应的卡片属性 switch(group) { case '1': // 稀有度 cardValue = String($card.attr('data-rarity') || '').trim(); break; case '2': // 职业 cardValue = String($card.attr('data-profession') || '').trim(); break; case '3': // 属性 cardValue = String($card.attr('data-attribute') || '').trim(); break; default: cardValue = String($card.attr('data-filter-' + group) || '').trim(); } if (cardValue !== filterValue) { shouldShow = false; break; } } // 显示或隐藏卡片 if (shouldShow) { $card.fadeIn(200); } else { $card.fadeOut(200); } }); // 更新显示数量 updateCount(); } // 更新显示数量 function updateCount() { var visibleCount = $('.战斗员卡片:visible').length; var totalCount = $('.战斗员卡片').length; if ($('#filter-count').length === 0) { $('.filter-container').prepend('<div id="filter-count"></div>'); } $('#filter-count').text('显示 ' + visibleCount + ' / ' + totalCount + ' 个战斗员'); } // 初始化筛选按钮的data属性(清理空格) $('.filter-button').each(function() { var $button = $(this); var value = String($button.data('filter-value') || '').trim(); $button.attr('data-filter-value', value); }); // 初始化时激活"查看全部"按钮 $('.filter-button[data-filter-group="0"][data-filter-value="0"]').addClass('active'); updateCount(); } // 等待页面加载完成 var checkInterval = setInterval(function() { if ($('.战斗员卡片').length > 0 && $('.filter-button').length > 0) { clearInterval(checkInterval); initFilterSystem(); } }, 500); // 10秒后停止检查 setTimeout(function() { clearInterval(checkInterval); }, 10000); }); /* 卡牌 */ (function() { // 防止重复初始化 if (window.cardSystemInitialized) return; window.cardSystemInitialized = true; // 缓存DOM元素 var overlayCache = null; var containerCache = null; // 保存当前卡牌信息,用于返回 var currentCardInfo = null; // 初始化卡牌描述滚动功能 function initCardScrolling(cardElement) { if (!cardElement.classList.contains('card-description-scrollable')) { return; // 不需要滚动 } var scrollContainer = cardElement.querySelector('.card-description-scroll'); var scrollInner = cardElement.querySelector('.card-description-scroll-inner'); var descriptionText = cardElement.querySelector('.card-description-text'); if (!scrollContainer || !scrollInner || !descriptionText) { return; } // 监听鼠标悬停事件 var isHovering = false; var scrollSpeed = 20; // 像素/秒 var scrollTimer = null; cardElement.addEventListener('mouseenter', function() { isHovering = true; startScrolling(); }); cardElement.addEventListener('mouseleave', function() { isHovering = false; stopScrolling(); }); function startScrolling() { if (scrollTimer) return; // 重置位置 scrollInner.style.transform = 'translateY(0)'; // 计算需要滚动的距离 var containerHeight = scrollContainer.offsetHeight; var contentHeight = scrollInner.offsetHeight; var scrollDistance = contentHeight - containerHeight; if (scrollDistance <= 0) return; // 不需要滚动 var startTime = Date.now(); var duration = (scrollDistance / scrollSpeed) * 1000; // 毫秒 scrollTimer = setInterval(function() { if (!isHovering) { stopScrolling(); return; } var elapsed = Date.now() - startTime; var progress = Math.min(elapsed / duration, 1); // 使用缓动函数 var easeProgress = progress < 0.5 ? 2 * progress * progress : 1 - Math.pow(-2 * progress + 2, 2) / 2; var currentScroll = -scrollDistance * easeProgress; scrollInner.style.transform = 'translateY(' + currentScroll + 'px)'; if (progress >= 1) { // 滚动到底部后暂停 setTimeout(function() { if (isHovering) { // 重置并重新开始 stopScrolling(); startScrolling(); } }, 1000); clearInterval(scrollTimer); scrollTimer = null; } }, 16); // 约60fps } function stopScrolling() { if (scrollTimer) { clearInterval(scrollTimer); scrollTimer = null; } // 重置位置 scrollInner.style.transform = 'translateY(0)'; } } // 创建遮罩层和容器 function createCardOverlay() { if (overlayCache && containerCache) { return { overlay: overlayCache, container: containerCache }; } // 创建遮罩 var overlay = document.createElement('div'); overlay.id = 'card-overlay'; overlay.style.cssText = 'display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999; overflow-y: auto;'; // 创建容器 var container = document.createElement('div'); container.id = 'card-display-container'; container.style.cssText = 'position: relative; min-height: 100vh; padding: 40px 20px; display: flex; align-items: center; justify-content: center;'; overlay.appendChild(container); document.body.appendChild(overlay); // 点击遮罩关闭 overlay.addEventListener('click', function(e) { if (e.target === overlay) { closeCardDisplay(); } }); overlayCache = overlay; containerCache = container; return { overlay: overlay, container: container }; } // 创建关闭按钮 function createCloseButton() { var closeBtn = document.createElement('div'); closeBtn.style.cssText = 'position: fixed; top: 20px; right: 20px; width: 40px; height: 40px; background: rgba(255,255,255,0.1); border: 2px solid white; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 10001; transition: all 0.3s;'; closeBtn.innerHTML = '<span style="color: white; font-size: 24px; font-weight: bold; line-height: 1;">×</span>'; closeBtn.onmouseover = function() { this.style.background = 'rgba(255,255,255,0.2)'; this.style.transform = 'scale(1.1)'; }; closeBtn.onmouseout = function() { this.style.background = 'rgba(255,255,255,0.1)'; this.style.transform = 'scale(1)'; }; closeBtn.onclick = function() { closeCardDisplay(); }; return closeBtn; } // 关闭卡牌展示 function closeCardDisplay() { var overlay = document.getElementById('card-overlay'); if (overlay) { overlay.style.display = 'none'; var container = overlay.querySelector('#card-display-container'); if (container) { container.innerHTML = ''; } } currentCardInfo = null; } // 缓存API调用结果 var apiCache = {}; // 获取卡牌HTML function fetchCardHTML(character, cardName, deckType, callback) { var cacheKey = character + '|' + cardName + '|' + (deckType || ''); if (apiCache[cacheKey]) { callback(apiCache[cacheKey]); return; } var api = new mw.Api(); var wikitext = '{{#invoke:卡牌|main|' + character + '|' + cardName + '|' + (deckType || '') + '}}'; api.parse(wikitext).done(function(html) { apiCache[cacheKey] = html; callback(html); }).fail(function() { callback('<div style="color: white;">加载失败</div>'); }); } // 放大显示卡牌 function showEnlargedCard(cardElement) { var elements = createCardOverlay(); var container = elements.container; var cardName = cardElement.dataset.cardName; var character = cardElement.dataset.character; var deckType = cardElement.dataset.deckType; var derivedCards = cardElement.dataset.derivedCards; var hasMechanism = cardElement.dataset.hasMechanism === 'true'; currentCardInfo = { element: cardElement, cardName: cardName, character: character, deckType: deckType, derivedCards: derivedCards }; container.style.cssText = 'position: relative; min-height: 100vh; padding: 40px 20px; display: flex; align-items: center; justify-content: center;'; var contentWrapper = document.createElement('div'); contentWrapper.style.cssText = 'display: flex; align-items: flex-start; gap: 0px; position: relative;'; // 处理衍生卡牌(左侧) if (derivedCards && derivedCards.trim() !== '') { var leftContainer = document.createElement('div'); leftContainer.style.cssText = 'display: flex; flex-direction: column; gap: 0px; align-items: center;'; var derivedCardsList = derivedCards.split('、'); var derivedCardWrapper = document.createElement('div'); derivedCardWrapper.style.cssText = 'width: 252px; height: 345px; display: flex; align-items: center; justify-content: center;'; var firstDerivedCard = document.createElement('div'); firstDerivedCard.id = 'derived-cards-display'; firstDerivedCard.style.cssText = 'transform: scale(1.5); transform-origin: center center;'; fetchCardHTML(character, derivedCardsList[0].trim(), '', function(html) { firstDerivedCard.innerHTML = html; var cards = firstDerivedCard.querySelectorAll('.game-card'); cards.forEach(function(card) { card.style.cursor = 'default'; card.onclick = function(e) { e.stopPropagation(); e.preventDefault(); }; initCardScrolling(card); // 初始化滚动 }); }); derivedCardWrapper.appendChild(firstDerivedCard); leftContainer.appendChild(derivedCardWrapper); if (derivedCardsList.length > 1) { var viewAllBtn = document.createElement('div'); viewAllBtn.style.cssText = 'padding: 10px 20px; background: linear-gradient(135deg, #4a90e2, #357abd); color: white; border-radius: 6px; cursor: pointer; white-space: nowrap; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); transition: transform 0.2s; margin-top: 0px;'; viewAllBtn.textContent = '查看所有衍生卡牌'; viewAllBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; viewAllBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; viewAllBtn.onclick = function() { showAllDerivedCards(character, derivedCardsList); }; leftContainer.appendChild(viewAllBtn); } contentWrapper.appendChild(leftContainer); } // 创建中间主卡牌区域 var centerContainer = document.createElement('div'); centerContainer.style.cssText = 'display: flex; flex-direction: column; align-items: center; gap: 0px;'; var mainCardContainer = document.createElement('div'); mainCardContainer.style.cssText = 'width: 336px; height: 460px; display: flex; align-items: center; justify-content: center; position: relative;'; var cardInner = document.createElement('div'); cardInner.style.cssText = 'transform: scale(2); position: relative;'; var enlargedCard = cardElement.cloneNode(true); enlargedCard.style.width = '168px'; enlargedCard.style.height = '230px'; enlargedCard.style.cursor = 'default'; enlargedCard.style.position = 'relative'; enlargedCard.style.display = 'block'; enlargedCard.onclick = null; // 初始化克隆卡牌的滚动功能 initCardScrolling(enlargedCard); cardInner.appendChild(enlargedCard); mainCardContainer.appendChild(cardInner); centerContainer.appendChild(mainCardContainer); // 创建按钮容器 var buttonsContainer = document.createElement('div'); buttonsContainer.style.cssText = 'display: flex; gap: 15px; white-space: nowrap;'; checkCardVariants(character, cardName, function(variants) { if (variants.lingguang) { var lingguangBtn = document.createElement('div'); lingguangBtn.style.cssText = 'padding: 10px 30px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border-radius: 6px; cursor: pointer; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); transition: transform 0.2s; white-space: nowrap; min-width: 120px; text-align: center;'; lingguangBtn.textContent = '灵光一闪'; lingguangBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; lingguangBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; lingguangBtn.onclick = function() { showVariantCards(character, cardName, '灵光一闪'); }; buttonsContainer.appendChild(lingguangBtn); } if (variants.shenguang) { var shenguangBtn = document.createElement('div'); shenguangBtn.style.cssText = 'padding: 10px 30px; background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); color: white; border-radius: 6px; cursor: pointer; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); transition: transform 0.2s; white-space: nowrap; min-width: 120px; text-align: center;'; shenguangBtn.textContent = '神之一闪'; shenguangBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; shenguangBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; shenguangBtn.onclick = function() { showVariantCards(character, cardName, '神之一闪'); }; buttonsContainer.appendChild(shenguangBtn); } if (buttonsContainer.children.length > 0) { centerContainer.appendChild(buttonsContainer); } }); contentWrapper.appendChild(centerContainer); // 添加右侧机制说明 if (hasMechanism) { var mechanismContainer = cardElement.nextElementSibling; if (mechanismContainer && mechanismContainer.classList.contains('mechanism-container')) { var mechanismDisplay = document.createElement('div'); mechanismDisplay.style.cssText = 'display: flex; flex-direction: column; gap: 0px; max-width: 320px; min-width: 280px;'; mechanismDisplay.innerHTML = mechanismContainer.innerHTML; mechanismDisplay.style.display = 'flex'; contentWrapper.appendChild(mechanismDisplay); } } container.innerHTML = ''; container.appendChild(contentWrapper); container.appendChild(createCloseButton()); elements.overlay.style.display = 'block'; } // 显示所有衍生卡牌 function showAllDerivedCards(character, derivedCardsList) { var overlay = document.getElementById('card-overlay'); var container = document.getElementById('card-display-container'); container.innerHTML = ''; container.style.cssText = 'position: relative; padding: 40px; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;'; var title = document.createElement('div'); title.style.cssText = 'color: white; font-size: 28px; font-weight: bold; margin-bottom: 30px; text-align: center;'; title.textContent = '衍生卡牌'; container.appendChild(title); var cardsContainer = document.createElement('div'); cardsContainer.style.cssText = 'display: flex; flex-wrap: wrap; gap: 30px; justify-content: center; max-width: 1400px; transform: scale(1.5); transform-origin: center center; padding: 40px;'; var uniqueCards = [...new Set(derivedCardsList.map(function(name) { return name.trim(); }))]; var loadedCount = 0; uniqueCards.forEach(function(cardName) { fetchCardHTML(character, cardName, '', function(html) { var cardWrapper = document.createElement('div'); cardWrapper.innerHTML = html; var cards = cardWrapper.querySelectorAll('.game-card'); cards.forEach(function(card) { card.style.cursor = 'default'; card.onclick = function(e) { e.stopPropagation(); e.preventDefault(); }; // 初始化滚动功能 initCardScrolling(card); var derivedCards = card.dataset.derivedCards; if (derivedCards && derivedCards.trim() !== '') { var buttonContainer = document.createElement('div'); buttonContainer.style.cssText = 'display: flex; flex-direction: column; align-items: center; gap: 10px;'; var cardContainer = document.createElement('div'); cardContainer.appendChild(card.cloneNode(true)); buttonContainer.appendChild(cardContainer); var viewDerivedBtn = document.createElement('div'); viewDerivedBtn.style.cssText = 'padding: 8px 15px; background: linear-gradient(135deg, #4a90e2, #357abd); color: white; border-radius: 6px; cursor: pointer; white-space: nowrap; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); transition: transform 0.2s; font-size: 12px;'; viewDerivedBtn.textContent = '查看衍生卡牌'; viewDerivedBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; viewDerivedBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; viewDerivedBtn.onclick = function(e) { e.stopPropagation(); showAllDerivedCards(character, derivedCards.split('、')); }; buttonContainer.appendChild(viewDerivedBtn); // 重新初始化克隆卡牌的滚动 var clonedCard = cardContainer.querySelector('.game-card'); if (clonedCard) { initCardScrolling(clonedCard); } cardsContainer.appendChild(buttonContainer); } else { cardsContainer.appendChild(card); } }); loadedCount++; }); }); container.appendChild(cardsContainer); var backBtn = document.createElement('div'); backBtn.style.cssText = 'position: fixed; top: 20px; left: 20px; padding: 10px 20px; background: linear-gradient(135deg, #4a90e2, #357abd); color: white; border-radius: 6px; cursor: pointer; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); z-index: 10001; transition: transform 0.2s;'; backBtn.textContent = '← 返回'; backBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; backBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; backBtn.onclick = function() { if (currentCardInfo && currentCardInfo.element) { showEnlargedCard(currentCardInfo.element); } }; container.appendChild(backBtn); container.appendChild(createCloseButton()); } // 检查卡牌变体 function checkCardVariants(character, cardName, callback) { var variants = { lingguang: false, shenguang: false }; var checkCount = 0; var totalChecks = 2; function checkComplete() { checkCount++; if (checkCount === totalChecks) { callback(variants); } } fetchCardHTML(character, cardName, '灵光一闪', function(html) { if (html && !html.includes('找不到卡组')) { variants.lingguang = true; } checkComplete(); }); fetchCardHTML(character, cardName, '神之一闪', function(html) { if (html && !html.includes('找不到卡组')) { variants.shenguang = true; } checkComplete(); }); } // 显示变体卡牌 function showVariantCards(character, cardName, variantType) { var overlay = document.getElementById('card-overlay'); var container = document.getElementById('card-display-container'); container.style.cssText = 'position: relative; padding: 40px; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;'; container.innerHTML = ''; var title = document.createElement('div'); title.style.cssText = 'color: white; font-size: 28px; font-weight: bold; margin-bottom: 30px; text-align: center; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;'; title.textContent = cardName + ' - ' + variantType; container.appendChild(title); var cardsContainer = document.createElement('div'); cardsContainer.style.cssText = 'display: flex; flex-wrap: nowrap; gap: 0px; justify-content: center; max-width: 1400px; overflow-x: auto; padding: 40px; transform: scale(1.5); transform-origin: center center;'; fetchCardHTML(character, cardName, variantType, function(html) { var tempContainer = document.createElement('div'); tempContainer.innerHTML = html; var cards = tempContainer.querySelectorAll('.game-card'); cards.forEach(function(card, index) { card.style.cursor = 'default'; card.onclick = null; card.style.flexShrink = '0'; // 初始化滚动功能 initCardScrolling(card); var derivedCards = card.getAttribute('data-derived-cards'); var hasDerivedCards = false; if (derivedCards !== null && derivedCards !== undefined) { var trimmedValue = String(derivedCards).trim(); if (trimmedValue.length > 0 && trimmedValue !== 'undefined' && trimmedValue !== 'null' && trimmedValue !== 'false' && trimmedValue !== '0') { hasDerivedCards = true; } } if (hasDerivedCards) { var cardWrapper = document.createElement('div'); cardWrapper.style.cssText = 'display: flex; flex-direction: column; align-items: center; gap: 10px; flex-shrink: 0;'; var cardClone = card.cloneNode(true); cardClone.style.cursor = 'default'; cardClone.onclick = null; // 重新初始化克隆卡牌的滚动 initCardScrolling(cardClone); cardWrapper.appendChild(cardClone); var viewDerivedBtn = document.createElement('div'); viewDerivedBtn.style.cssText = 'padding: 8px 15px; background: linear-gradient(135deg, #4a90e2, #357abd); color: white; border-radius: 6px; cursor: pointer; white-space: nowrap; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); transition: transform 0.2s; font-size: 12px;'; viewDerivedBtn.textContent = '查看衍生卡牌'; viewDerivedBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; viewDerivedBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; viewDerivedBtn.setAttribute('data-derived-list', derivedCards); viewDerivedBtn.onclick = function(e) { e.stopPropagation(); var derivedList = this.getAttribute('data-derived-list'); showAllDerivedCards(character, derivedList.split('、')); }; cardWrapper.appendChild(viewDerivedBtn); cardsContainer.appendChild(cardWrapper); } else { cardsContainer.appendChild(card); } }); }); container.appendChild(cardsContainer); var backBtn = document.createElement('div'); backBtn.style.cssText = 'position: fixed; top: 20px; left: 20px; padding: 10px 20px; background: linear-gradient(135deg, #4a90e2, #357abd); color: white; border-radius: 6px; cursor: pointer; font-weight: bold; box-shadow: 0 2px 8px rgba(0,0,0,0.3); z-index: 10001; transition: transform 0.2s;'; backBtn.textContent = '← 返回'; backBtn.onmouseover = function() { this.style.transform = 'scale(1.05)'; }; backBtn.onmouseout = function() { this.style.transform = 'scale(1)'; }; backBtn.onclick = function() { if (currentCardInfo && currentCardInfo.element) { showEnlargedCard(currentCardInfo.element); } }; container.appendChild(backBtn); container.appendChild(createCloseButton()); } // 初始化卡牌点击事件 function initCardClickEvents() { document.addEventListener('click', function(e) { var card = e.target.closest('.game-card'); if (card && !card.closest('#card-overlay')) { e.preventDefault(); showEnlargedCard(card); } }); // 初始化页面上现有的卡牌 document.querySelectorAll('.game-card').forEach(function(card) { initCardScrolling(card); }); } // 页面加载完成后初始化 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', function() { initCardClickEvents(); }); } else { initCardClickEvents(); } })(); /* 角色立绘切换 */ $(document).ready(function() { // 使用事件委托来确保动态内容也能响应 $(document).on('click', '.character-switch-btn', function() { // 如果点击的是已经激活的按钮,不执行任何操作 if ($(this).hasClass('active')) { return; } var targetType = $(this).attr('data-target'); var container = $(this).closest('#character-container'); var imageWrapper = container.find('.character-image-wrapper'); var allImages = imageWrapper.find('.character-image'); // 先将所有图片淡出 allImages.each(function() { $(this).css('opacity', '0'); }); // 延迟后切换显示状态 setTimeout(function() { allImages.each(function() { $(this).css('display', 'none'); }); // 显示目标图片 imageWrapper.find('[data-image-type="' + targetType + '"]').each(function() { $(this).css('display', 'block'); // 强制重绘 $(this)[0].offsetHeight; $(this).css('opacity', '1'); }); }, 300); // 更新按钮样式 container.find('.character-switch-btn').each(function() { $(this).removeClass('active'); $(this).css({ 'background': 'rgba(0,0,0,0.5)', 'cursor': 'pointer' }); }); // 设置当前按钮为激活状态 $(this).addClass('active'); $(this).css({ 'background': 'rgba(70, 130, 255, 0.8)', 'cursor': 'default' }); }); // 鼠标悬停效果(仅对非激活按钮有效) $(document).on('mouseenter', '.character-switch-btn:not(.active)', function() { $(this).css('background', 'rgba(70, 130, 255, 0.5)'); }); $(document).on('mouseleave', '.character-switch-btn:not(.active)', function() { $(this).css('background', 'rgba(0,0,0,0.5)'); }); }); /* 轮播图 */ $(function() { $('.carousel-container').each(function() { var $container = $(this); var $wrapper = $container.find('.carousel-wrapper'); var $slides = $container.find('.carousel-slide'); var $titleItems = $container.find('.carousel-title-item'); var slideCount = $slides.length; var currentSlide = 0; var autoPlayInterval; var isTransitioning = false; // 切换到指定幻灯片 function goToSlide(index) { if (isTransitioning) return; if (index < 0) index = slideCount - 1; if (index >= slideCount) index = 0; isTransitioning = true; currentSlide = index; $wrapper.css('transform', 'translateX(-' + (index * 100) + '%)'); // 更新标题状态 $titleItems.each(function(i) { var $item = $(this); var $text = $item.find('.title-text'); var $indicator = $item.find('.title-indicator'); if (i === index) { $item.addClass('active'); $text.css('opacity', '1').css('font-weight', 'bold'); $indicator.css('background', '#ff6600'); } else { $item.removeClass('active'); $text.css('opacity', '0.7').css('font-weight', 'normal'); $indicator.css('background', 'transparent'); } }); setTimeout(function() { isTransitioning = false; }, 500); } // 下一张 function nextSlide() { goToSlide(currentSlide + 1); } // 上一张 function prevSlide() { goToSlide(currentSlide - 1); } // 自动播放 function startAutoPlay() { autoPlayInterval = setInterval(nextSlide, 10000); } // 停止自动播放 function stopAutoPlay() { clearInterval(autoPlayInterval); } // 绑定左右切换按钮事件(处理图片点击) $container.find('.carousel-next').click(function(e) { e.preventDefault(); e.stopPropagation(); stopAutoPlay(); nextSlide(); startAutoPlay(); }); $container.find('.carousel-prev').click(function(e) { e.preventDefault(); e.stopPropagation(); stopAutoPlay(); prevSlide(); startAutoPlay(); }); // 防止按钮内的图片链接跳转 $container.find('.carousel-btn img, .carousel-btn a').click(function(e) { e.preventDefault(); return false; }); // 绑定标题点击事件 $titleItems.click(function() { var slideIndex = parseInt($(this).attr('data-slide')); stopAutoPlay(); goToSlide(slideIndex); startAutoPlay(); }); // 鼠标悬停在容器时暂停 $container.hover( function() { stopAutoPlay(); }, function() { startAutoPlay(); } ); // 触摸滑动支持(移动设备) var touchStartX = 0; var touchEndX = 0; $container.on('touchstart', function(e) { touchStartX = e.originalEvent.changedTouches[0].screenX; }); $container.on('touchend', function(e) { touchEndX = e.originalEvent.changedTouches[0].screenX; handleSwipe(); }); function handleSwipe() { if (touchEndX < touchStartX - 50) { stopAutoPlay(); nextSlide(); startAutoPlay(); } if (touchEndX > touchStartX + 50) { stopAutoPlay(); prevSlide(); startAutoPlay(); } } // 键盘控制 $(document).keydown(function(e) { if ($container.is(':hover')) { if (e.keyCode === 37) { // 左箭头 stopAutoPlay(); prevSlide(); startAutoPlay(); } else if (e.keyCode === 39) { // 右箭头 stopAutoPlay(); nextSlide(); startAutoPlay(); } } }); // 启动自动播放 if (slideCount > 1) { startAutoPlay(); } }); }); /* 悬浮目录 */ $(document).ready(function() { // 只在有目录的页面上执行 if ($('.toc').length > 0) { // 创建侧边目录 var $sidebar = $('<div id="toc-sidebar"><div id="toc-sidebar-trigger">展开目录</div><div id="toc-sidebar-content"></div></div>'); $('body').append($sidebar); // 提取并修复目录内容 var tocUl = $('<ul></ul>'); // 避免重复的目录项 var processedItems = new Set(); // 从原始目录构建新目录 $('.toc ul li').each(function() { var $link = $(this).find('a').first(); var href = $link.attr('href'); var $number = $link.find('.tocnumber').first(); var $text = $link.find('.toctext').first(); // 创建唯一标识符,避免重复添加 var itemId = $number.text() + '-' + $text.text(); if (!processedItems.has(itemId)) { processedItems.add(itemId); // 创建新的目录项 var $li = $('<li></li>'); var $newLink = $('
').attr('href', href); // 如果有编号,则添加编号 if ($number.length) { $newLink.append($('<span class="tocnumber"></span>').text($number.text())); $newLink.append(' '); } $newLink.append($('<span class="toctext"></span>').text($text.text())); $li.append($newLink); tocUl.append($li); } }); $('#toc-sidebar-content').append(tocUl); // 点击展开/折叠事件处理 $('#toc-sidebar-trigger').click(function() { $('#toc-sidebar').toggleClass('expanded'); // 根据展开/折叠状态更改按钮文字 if ($('#toc-sidebar').hasClass('expanded')) { $('#toc-sidebar-trigger').text('隐藏目录'); } else { $('#toc-sidebar-trigger').text('展开目录'); } }); } }); /* 卡牌悬浮 */ $(function() { // 初始化所有卡牌悬浮 function initCardHoverElements() { $('.card-hover-container').each(function() { var $container = $(this); // 只初始化尚未处理的元素 if ($container.data('initialized')) return; $container.data('initialized', true); // 获取卡牌数据 var character = $container.data('character'); var cardName = $container.data('card'); var deckType = $container.data('deck') || ''; var index = $container.data('index') || 0; var $popup = $container.find('.card-popup'); // 预加载卡牌数据 $container.on('mouseenter', function() { // 如果卡牌数据已经加载过,直接显示 if ($popup.data('loaded')) { // 调整位置到右下方 positionCardPopup($container); return; } // 加载卡牌数据 var params = { action: 'parse', text: '{{#invoke:卡牌|main|' + character + '|' + cardName + '|' + deckType + '|' + index + '}}', prop: 'text', disablelimitreport: true, format: 'json' }; $.ajax({ url: mw.util.wikiScript('api'), data: params, dataType: 'json', success: function(data) { if (data && data.parse && data.parse.text) { var cardHtml = data.parse.text['*']; $popup.html(cardHtml).data('loaded', true); // 调整位置到右下方 positionCardPopup($container); } }, error: function() { $popup.html('<div style="color: #721c24;">无法加载卡牌数据</div>').data('loaded', true); } }); }); }); } // 调整卡牌弹出位置到右下方 function positionCardPopup($container) { var $popupContainer = $container.find('.card-popup-container'); var containerWidth = $container.width(); var windowWidth = $(window).width(); var containerOffset = $container.offset(); var rightSpace = windowWidth - containerOffset.left - containerWidth; // 重置位置 $popupContainer.css({ 'left': 'auto', 'right': 'auto', 'top': '100%', 'margin-top': '5px' }); // 如果右侧空间足够,放在右下方 if (rightSpace >= 168) { // 卡牌宽度大约168px $popupContainer.css({ 'left': '0', }); } // 如果右侧空间不够,但左侧空间足够,放在左下方 else if (containerOffset.left >= 168) { $popupContainer.css({ 'right': '0', }); } // 如果两侧都不够,尝试居中并确保完全可见 else { var leftPosition = Math.max(0, Math.min(containerOffset.left - (168/2), windowWidth - 168)); $popupContainer.css({ 'left': (leftPosition - containerOffset.left) + 'px' }); } } // 初次加载页面时初始化 $(document).ready(function() { initCardHoverElements(); }); // 使用 MutationObserver 监听 DOM 变化,处理动态加载的内容 if (window.MutationObserver) { var observer = new MutationObserver(function(mutations) { var shouldInit = false; mutations.forEach(function(mutation) { if (mutation.addedNodes && mutation.addedNodes.length) { shouldInit = true; } }); if (shouldInit) { initCardHoverElements(); } }); observer.observe(document.body, { childList: true, subtree: true }); } }); // 词典 tooltip 系统 (function() { var tooltipContainer = null; var currentTerm = null; var hideTimeout = null; // 初始化 $(function() { // 创建全局 tooltip 容器 tooltipContainer = $('<div class="dictionary-tooltip-container"></div>'); $('body').append(tooltipContainer); // 鼠标进入词条 $(document).on('mouseenter', '.dictionary-term', function(e) { var $term = $(this); currentTerm = $term; // 清除隐藏定时器 if (hideTimeout) { clearTimeout(hideTimeout); hideTimeout = null; } // 获取 tooltip 内容 var content = $term.attr('data-tooltip-content'); if (!content) return; // 设置内容 tooltipContainer.html(content); // 计算位置 updateTooltipPosition($term); // 显示 tooltip tooltipContainer.addClass('active'); }); // 鼠标离开词条 $(document).on('mouseleave', '.dictionary-term', function() { hideTimeout = setTimeout(function() { tooltipContainer.removeClass('active'); currentTerm = null; }, 100); }); // 鼠标进入 tooltip(防止快速隐藏) tooltipContainer.on('mouseenter', function() { if (hideTimeout) { clearTimeout(hideTimeout); hideTimeout = null; } }); // 鼠标离开 tooltip tooltipContainer.on('mouseleave', function() { hideTimeout = setTimeout(function() { tooltipContainer.removeClass('active'); currentTerm = null; }, 100); }); // 窗口滚动时更新位置 $(window).on('scroll resize', function() { if (currentTerm && tooltipContainer.hasClass('active')) { updateTooltipPosition(currentTerm); } }); }); // 更新 tooltip 位置 function updateTooltipPosition($term) { var rect = $term[0].getBoundingClientRect(); var scrollTop = $(window).scrollTop(); var scrollLeft = $(window).scrollLeft(); // 基本位置:词条下方 var top = rect.bottom + scrollTop + 2; var left = rect.left + scrollLeft; // 获取 tooltip 尺寸 var tooltipWidth = 250; // 固定宽度 var tooltipHeight = tooltipContainer.outerHeight(); // 获取窗口尺寸 var windowWidth = $(window).width(); var windowHeight = $(window).height(); // 检查右边界 if (left + tooltipWidth > windowWidth + scrollLeft) { left = Math.max(scrollLeft, rect.right + scrollLeft - tooltipWidth); } // 检查下边界 if (rect.bottom + tooltipHeight > windowHeight) { // 如果下方空间不足,显示在上方 if (rect.top - tooltipHeight > 0) { top = rect.top + scrollTop - tooltipHeight - 2; } } // 设置位置 tooltipContainer.css({ top: top + 'px', left: left + 'px' }); } })(); // 卡牌描述滚动控制 (function() { 'use strict'; function initCardScroll() { console.log('初始化卡牌滚动...'); var cards = document.querySelectorAll('.game-card.card-description-scrollable'); console.log('找到需要滚动的卡牌数量:', cards.length); cards.forEach(function(card, index) { var scrollContainer = card.querySelector('.card-description-scroll'); var scrollInner = card.querySelector('.card-description-scroll-inner'); var scrollText = card.querySelector('.card-description-text'); if (!scrollContainer || !scrollInner || !scrollText) { console.log('卡牌 ' + index + ' 缺少必要元素'); return; } // 强制触发重绘 scrollInner.style.display = 'none'; scrollInner.offsetHeight; // 触发重排 scrollInner.style.display = 'block'; console.log('卡牌 ' + index + ' 初始化完成'); }); } // 延迟初始化,确保DOM完全加载 function delayedInit() { setTimeout(initCardScroll, 100); setTimeout(initCardScroll, 500); setTimeout(initCardScroll, 1000); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', delayedInit); } else { delayedInit(); } })();
返回
MediaWiki:Common.js
。