MediaWiki:Common.js - 版本历史

Rin：道具页：搜索过滤 + 切换逻辑整合 (via update-page on MediaWiki MCP Server)

2026-03-28T14:06:23Z

道具页：搜索过滤 + 切换逻辑整合 (via update-page on MediaWiki MCP Server)

Rin：新增道具页 switchItem 函数 (via update-page on MediaWiki MCP Server)

2026-03-13T10:39:24Z

新增道具页 switchItem 函数 (via update-page on MediaWiki MCP Server)

←上一版本		2026年3月13日 (五) 18:39的版本
第56行：		第56行：
	var storyRect = story.getBoundingClientRect();		var storyRect = story.getBoundingClientRect();
	var timelineRect = timeline.getBoundingClientRect();		var timelineRect = timeline.getBoundingClientRect();
	~~// 小传顶部滚出视口 && 时间轴底部还在视口内~~
	if (storyRect.top < 0 && timelineRect.bottom > window.innerHeight) {		if (storyRect.top < 0 && timelineRect.bottom > window.innerHeight) {
	headerLeft.classList.add("is-sticky");		headerLeft.classList.add("is-sticky");
第73行：		第72行：
	mw.hook("wikipage.content").add(function(){		mw.hook("wikipage.content").add(function(){

	~~/* 卡片：.card_content_date-item，带 data-date-index~~
	~~故事内容：.card_date_story-content，带 data-story-index（CSS：.is-active → display:block）~~
	~~面板：#date-story-panel（CSS：.is-visible → display:block + 淡入动画）~~
	*/
	var cards = document.querySelectorAll(".card_content_date-item");		var cards = document.querySelectorAll(".card_content_date-item");
	var panel = document.getElementById("date-story-panel");		var panel = document.getElementById("date-story-panel");
第91行：		第86行：
	var index = parseInt(card.getAttribute("data-date-index"), 10);		var index = parseInt(card.getAttribute("data-date-index"), 10);

	~~// 点同一张 → 收起面板~~
	if(currentIndex === index){		if(currentIndex === index){
	panel.classList.remove("is-visible");		panel.classList.remove("is-visible");
第99行：		第93行：
	}		}

	~~// 切换卡片高亮（is-active）~~
	cards.forEach(function(c){ c.classList.remove("is-active"); });		cards.forEach(function(c){ c.classList.remove("is-active"); });
	card.classList.add("is-active");		card.classList.add("is-active");
	currentIndex = index;		currentIndex = index;

	~~// 重新触发淡入动画：先移除再加回，强制 reflow~~
	panel.classList.remove("is-visible");		panel.classList.remove("is-visible");
	void panel.offsetWidth;		void panel.offsetWidth;
	panel.classList.add("is-visible");		panel.classList.add("is-visible");

	~~// 切换故事内容（is-active）~~
	contents.forEach(function(content){		contents.forEach(function(content){
	var storyIndex = parseInt(content.getAttribute("data-story-index"), 10);		var storyIndex = parseInt(content.getAttribute("data-story-index"), 10);
第121行：		第112行：
	});		});

			});

			});

			/* 道具页：左侧列表切换右侧详情 */
			mw.hook("wikipage.content").add(function(){

			var tabs = document.querySelectorAll(".item-tab");
			var details = document.querySelectorAll(".item-detail");

			if (!tabs.length \|\| !details.length) return;

			tabs.forEach(function(tab){
			tab.addEventListener("click", function(){
			var id = tab.getAttribute("data-item");

			details.forEach(function(el){ el.style.display = "none"; });
			tabs.forEach(function(t){
			t.style.borderLeft = "2px solid transparent";
			t.style.background = "transparent";
			});

			var detail = document.getElementById("item-" + id);
			if (detail) detail.style.display = "block";
			tab.style.borderLeft = "2px solid #ff7676";
			tab.style.background = "rgba(255,150,170,0.08)";
			});
	});		});

	});		});

2026年3月12日 (四) 10:53 Rin

2026-03-12T10:53:51Z

←上一版本		2026年3月12日 (四) 18:53的版本
第16行：		第16行：


	/* 小传折叠 */		/* 小传折叠 + 标题 sticky */
	mw.hook("wikipage.content").add(function(){		mw.hook("wikipage.content").add(function(){

	document.querySelectorAll(".card_content_story").forEach(function(story){		document.querySelectorAll(".card_content_story").forEach(function(story){

	var toggle = story.querySelector(".card_content_story-toggle");		var toggle = story.querySelector(".card_content_story-toggle");
	var timeline = story.querySelector(".card_content_story-timeline");		var timeline = story.querySelector(".card_content_story-timeline");
			var headerLeft = story.querySelector(".card_content_story-header-left");

	if(!toggle \|\| !timeline) return;		if (!toggle \|\| !timeline \|\| !headerLeft) return;

	var icon = toggle.querySelector(".story-toggle-icon");		var icon = toggle.querySelector(".story-toggle-icon");
	var text = toggle.querySelector(".story-toggle-text");		var text = toggle.querySelector(".story-toggle-text");

			/* 折叠/展开 */
	toggle.addEventListener("click", function(){		toggle.addEventListener("click", function(){

	var collapsed = toggle.getAttribute("data-collapsed") === "true";		var collapsed = toggle.getAttribute("data-collapsed") === "true";
			if (collapsed) {
	if(collapsed){		timeline.style.opacity = "1";
	~~// 展开~~
	timeline.style.opacity = "1";
	timeline.style.transform = "translateY(0)";		timeline.style.transform = "translateY(0)";
	timeline.style.maxHeight = "5000px";		timeline.style.maxHeight = "5000px";
	}else{		} else {
	~~// 折叠~~		timeline.style.opacity = "0";
	timeline.style.opacity = "0";
	timeline.style.transform = "translateY(-6px)";		timeline.style.transform = "translateY(-6px)";
	timeline.style.maxHeight = "0";		timeline.style.maxHeight = "0";
	}		}

	toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");		toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");

	icon.innerText = collapsed ? "－" : "＋";		icon.innerText = collapsed ? "－" : "＋";
	text.innerText = collapsed ? "收起" : "展开";		text.innerText = collapsed ? "收起" : "展开";
			if (!collapsed) headerLeft.classList.remove("is-sticky");
			});

	});		/* sticky 判断 */
			function updateSticky() {
			if (toggle.getAttribute("data-collapsed") === "true") {
			headerLeft.classList.remove("is-sticky");
			return;
			}
			var storyRect = story.getBoundingClientRect();
			var timelineRect = timeline.getBoundingClientRect();
			// 小传顶部滚出视口 && 时间轴底部还在视口内
			if (storyRect.top < 0 && timelineRect.bottom > window.innerHeight) {
			headerLeft.classList.add("is-sticky");
			} else {
			headerLeft.classList.remove("is-sticky");
			}
			}

			window.addEventListener("scroll", updateSticky, { passive: true });
			updateSticky();
	});		});

	});		});


	/* 邀约故事区 */		/* 邀约故事区 */

Rin：引入 CardData.js (via update-page on MediaWiki MCP Server)

2026-03-10T15:11:11Z

引入 CardData.js (via update-page on MediaWiki MCP Server)

←上一版本		2026年3月10日 (二) 23:11的版本
第1行：		第1行：
	/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */		/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */

			/* 引入卡片数据渲染模块 */
			mw.loader.load( '/index.php?title=MediaWiki:CardData.js&action=raw&ctype=text/javascript' );

	/* 卡面滚动 */		/* 卡面滚动 */
	window.addEventListener("scroll", () => {		window.addEventListener("scroll", () => {

Rin：统一邀约故事区 class 命名，与 CSS 保持一致（is-visible / is-active） (via update-page on MediaWiki MCP Server)

2026-03-06T10:24:04Z

统一邀约故事区 class 命名，与 CSS 保持一致（is-visible / is-active） (via update-page on MediaWiki MCP Server)

←上一版本		2026年3月6日 (五) 18:24的版本
第57行：		第57行：

	/* 卡片：.card_content_date-item，带 data-date-index		/* 卡片：.card_content_date-item，带 data-date-index
	故事内容：.card_date_story-content，带 data-story-~~index~~		故事内容：.card_date_story-content，带 data-story-index（CSS：.is-active → display:block）
	面板：#date-story-~~panel~~		面板：#date-story-panel（CSS：.is-visible → display:block + 淡入动画）
	*/		*/
	var cards = document.querySelectorAll(".card_content_date-item");		var cards = document.querySelectorAll(".card_content_date-item");
第74行：		第74行：
	var index = parseInt(card.getAttribute("data-date-index"), 10);		var index = parseInt(card.getAttribute("data-date-index"), 10);

	// 点同一张 → 收起		// 点同一张 → 收起面板
	if(currentIndex === index){		if(currentIndex === index){
	panel.classList.remove("~~card_date_story~~-~~-active~~");		panel.classList.remove("is-visible");
	card.classList.remove("~~card_content_date-item-~~-active");		card.classList.remove("is-active");
	currentIndex = -1;		currentIndex = -1;
	return;		return;
	}		}

	// ~~切换卡片高亮~~		// 切换卡片高亮（is-active）
	cards.forEach(function(c){ c.classList.remove("~~card_content_date-item-~~-active"); });		cards.forEach(function(c){ c.classList.remove("is-active"); });
	card.classList.add("~~card_content_date-item-~~-active");		card.classList.add("is-active");
	currentIndex = index;		currentIndex = index;

	// ~~重新触发淡入动画~~		// 重新触发淡入动画：先移除再加回，强制 reflow
	panel.classList.remove("~~card_date_story~~-~~-active~~");		panel.classList.remove("is-visible");
	void panel.offsetWidth; ~~// 强制 reflow，使动画重置~~		void panel.offsetWidth;
	panel.classList.add("~~card_date_story-~~-~~active~~");		panel.classList.add("is-visible");

	// ~~显示对应故事内容，隐藏其他~~		// 切换故事内容（is-active）
	contents.forEach(function(content){		contents.forEach(function(content){
	var storyIndex = parseInt(content.getAttribute("data-story-index"), 10);		var storyIndex = parseInt(content.getAttribute("data-story-index"), 10);
	~~content.style.display =~~ storyIndex === index ? "" : "~~none~~";		if(storyIndex === index){
			content.classList.add("is-active");
			} else {
			content.classList.remove("is-active");
			}
	});		});

Rin：更新邀约故事区 JS，对应 sandbox/2.0 的 data-date-index / data-story-index 结构 (via update-page on MediaWiki MCP Server)

2026-03-05T15:19:25Z

更新邀约故事区 JS，对应 sandbox/2.0 的 data-date-index / data-story-index 结构 (via update-page on MediaWiki MCP Server)

←上一版本		2026年3月5日 (四) 23:19的版本
第56行：		第56行：
	mw.hook("wikipage.content").add(function(){		mw.hook("wikipage.content").add(function(){

	var cards = document.querySelectorAll(".~~ron~~-date-~~card~~");		/* 卡片：.card_content_date-item，带 data-date-index
	var ~~panel~~ = document.~~querySelector~~(".~~ron~~-~~date-story~~");		故事内容：.card_date_story-content，带 data-story-index
			面板：#date-story-panel
			*/
			var cards = document.querySelectorAll(".card_content_date-item");
			var panel = document.getElementById("date-story-panel");
			var contents = document.querySelectorAll(".card_date_story-content");

	if(!cards.length \|\| !panel) return;		if(!cards.length \|\| !panel) return;
第63行：		第68行：
	var currentIndex = -1;		var currentIndex = -1;

	cards.forEach(function(card~~, index~~){		cards.forEach(function(card){

	card.addEventListener("click", function(){		card.addEventListener("click", function(){

			var index = parseInt(card.getAttribute("data-date-index"), 10);

	// 点同一张 → 收起		// 点同一张 → 收起
	if(currentIndex === index){		if(currentIndex === index){
	panel.classList.remove("is-active");		panel.classList.remove("card_date_story--active");
	card.classList.remove("is-active");		card.classList.remove("card_content_date-item--active");
	currentIndex = -1;		currentIndex = -1;
	return;		return;
	}		}

	// ~~切换高亮~~		// 切换卡片高亮
	cards.forEach(function(c){ c.classList.remove("is-active"); });		cards.forEach(function(c){ c.classList.remove("card_content_date-item--active"); });
	card.classList.add("is-active");		card.classList.add("card_content_date-item--active");
	currentIndex = index;		currentIndex = index;

	// ~~重新触发动画~~		// 重新触发淡入动画
	panel.classList.remove("is-active");		panel.classList.remove("card_date_story--active");
	void panel.offsetWidth; // ~~reflow~~		void panel.offsetWidth; // 强制 reflow，使动画重置
	panel.classList.add("is-active");		panel.classList.add("card_date_story--active");

	// ~~切换对应故事内容~~		// 显示对应故事内容，隐藏其他
	~~var storyId = card.getAttribute("data-story");~~		contents.forEach(function(content){
	~~panel.querySelectorAll(".ron-date-story__chapter")~~.forEach(function(~~chapter~~){		var storyIndex = parseInt(content.getAttribute("data-story-index"), 10);
	~~chapter.classList.toggle~~(~~"is-active", chapter~~.getAttribute("data-story") === ~~storyId)~~;		content.style.display = storyIndex === index ? "" : "none";
	});		});

Rin：添加邀约故事区点击交互逻辑 (via update-page on MediaWiki MCP Server)

2026-03-05T15:08:00Z

添加邀约故事区点击交互逻辑 (via update-page on MediaWiki MCP Server)

@@ 第45行： / 第45行： @@
              icon.innerText = collapsed ? "－" : "＋";
              text.innerText = collapsed ? "收起" : "展开";
          });

2026年3月4日 (三) 15:52 Rin

2026-03-04T15:52:50Z

←上一版本		2026年3月4日 (三) 23:52的版本
第29行：		第29行：
	var collapsed = toggle.getAttribute("data-collapsed") === "true";		var collapsed = toggle.getAttribute("data-collapsed") === "true";

	timeline.style.~~display~~ = ~~collapsed ?~~ "~~block~~" : "~~none~~";		if(collapsed){
			// 展开
			timeline.style.opacity = "1";
			timeline.style.transform = "translateY(0)";
			timeline.style.maxHeight = "5000px";
			}else{
			// 折叠
			timeline.style.opacity = "0";
			timeline.style.transform = "translateY(-6px)";
			timeline.style.maxHeight = "0";
			}

	toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");		toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");

	icon.innerText = collapsed ? "▴" : "▾";		icon.innerText = collapsed ? "－" : "＋";
	text.innerText = collapsed ? "折叠" : "展开";		text.innerText = collapsed ? "收起" : "展开";

	});		});

2026年3月4日 (三) 15:38 Rin

2026-03-04T15:38:45Z

←上一版本		2026年3月4日 (三) 23:38的版本
第13行：		第13行：

	/* 小传折叠 */		/* 小传折叠 */
	~~console.log("Story module loaded");~~

	mw.hook("wikipage.content").add(function(){		mw.hook("wikipage.content").add(function(){

第23行：		第21行：

	if(!toggle \|\| !timeline) return;		if(!toggle \|\| !timeline) return;

			var icon = toggle.querySelector(".story-toggle-icon");
			var text = toggle.querySelector(".story-toggle-text");

	toggle.addEventListener("click", function(){		toggle.addEventListener("click", function(){
第31行：		第32行：

	toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");		toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");
	~~toggle~~.innerText = collapsed ? "~~[ 折叠全部 ]~~" : "~~[ 展开全部 ]~~";
			icon.innerText = collapsed ? "▴" : "▾";
			text.innerText = collapsed ? "折叠" : "展开";

	});		});

2026年3月4日 (三) 15:32 Rin

2026-03-04T15:32:26Z

←上一版本		2026年3月4日 (三) 23:32的版本
第13行：		第13行：

	/* 小传折叠 */		/* 小传折叠 */
	console.log("~~Common.js 已加载~~");		console.log("Story module loaded");

	mw.hook("wikipage.content").add(function(){		mw.hook("wikipage.content").add(function(){

	~~console.log("wikipage.content 触发");~~		document.querySelectorAll(".card_content_story").forEach(function(story){

	~~var stories =~~ document.querySelectorAll(".card_content_story");
	~~console.log("找到 story 数量:", stories.length);~~

	~~stories~~.forEach(function(story){

	var toggle = story.querySelector(".card_content_story-toggle");		var toggle = story.querySelector(".card_content_story-toggle");
	var ~~texts~~ = story.~~querySelectorAll~~(".card_content_story-~~text~~");		var timeline = story.querySelector(".card_content_story-timeline");

	~~console.log("找到 toggle:", toggle);~~
	~~console.log("找到 text 数量:", texts.length~~);

	if(!toggle) return;		if(!toggle \|\| !timeline) return;

	toggle.addEventListener("click", function(){		toggle.addEventListener("click", function(){

	~~console.log("点击触发");~~

	var collapsed = toggle.getAttribute("data-collapsed") === "true";		var collapsed = toggle.getAttribute("data-collapsed") === "true";

	~~texts.forEach(function(el){~~		timeline.style.display = collapsed ? "block" : "none";
	el.style.display = collapsed ? "block" : "none";
	});

	toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");		toggle.setAttribute("data-collapsed", collapsed ? "false" : "true");

MediaWiki:Common.js - 版本历史

Rin：​道具页：搜索过滤 + 切换逻辑整合 (via update-page on MediaWiki MCP Server)

Rin：​新增道具页 switchItem 函数 (via update-page on MediaWiki MCP Server)