MediaWiki:Common.js:修订间差异
MediaWiki界面页面
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第42行: | 第42行: | ||
(function() { | (function() { | ||
'use strict'; | 'use strict'; | ||
// 1. 模式检测:如果是 Basic 模式,执行自毁清理并终止 | |||
const checkBasicMode = () => { | |||
return document.documentElement.classList.contains('skin-citizen-basic'); | |||
}; | |||
if (checkBasicMode()) { | |||
// 清理可能残留的属性 | |||
document.querySelectorAll('.citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox') | |||
.forEach(el => { | |||
el.style.removeProperty('--mouse-x'); | |||
el.style.removeProperty('--mouse-y'); | |||
}); | |||
return; | |||
} | |||
// 2. 核心选择器 | |||
const GLASS_SELECTORS = '.citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox'; | const GLASS_SELECTORS = '.citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox'; | ||
// 3. 坐标同步逻辑 | |||
const syncLight = (e) => { | const syncLight = (e) => { | ||
// 如果运行中途动态切换到了 basic,则停止同步 | |||
if (checkBasicMode()) return; | |||
const elements = document.querySelectorAll(GLASS_SELECTORS); | const elements = document.querySelectorAll(GLASS_SELECTORS); | ||
elements.forEach(el => { | elements.forEach(el => { | ||
const rect = el.getBoundingClientRect(); | const rect = el.getBoundingClientRect(); | ||
// | |||
// 性能优化判断:元素必须可见且在视口内 | |||
if (rect.width > 0 && rect.top < window.innerHeight && rect.bottom > 0) { | if (rect.width > 0 && rect.top < window.innerHeight && rect.bottom > 0) { | ||
const x = ((e.clientX - rect.left) / rect.width) * 100; | const x = ((e.clientX - rect.left) / rect.width) * 100; | ||
const y = ((e.clientY - rect.top) / rect.height) * 100; | const y = ((e.clientY - rect.top) / rect.height) * 100; | ||
if (isFinite(x) && isFinite(y)) { | if (isFinite(x) && isFinite(y)) { | ||
el.style.setProperty('--mouse-x', x.toFixed(2) + '%'); | el.style.setProperty('--mouse-x', x.toFixed(2) + '%'); | ||
| 第62行: | 第83行: | ||
}; | }; | ||
// | // 4. 搜索面板弹性动画触发器 (每 50ms 轮询检测) | ||
setInterval(() => { | setInterval(() => { | ||
if (checkBasicMode()) return; | |||
const palette = document.querySelector('.citizen-command-palette'); | const palette = document.querySelector('.citizen-command-palette'); | ||
if (palette && !palette.classList.contains('glass-show')) { | if (palette && !palette.classList.contains('glass-show')) { | ||
| 第70行: | 第92行: | ||
}, 50); | }, 50); | ||
// 5. 鼠标移动监听 (使用 requestAnimationFrame 保证丝滑) | |||
let ticking = false; | let ticking = false; | ||
document.addEventListener('mousemove', (e) => { | document.addEventListener('mousemove', (e) => { | ||
| 第80行: | 第103行: | ||
} | } | ||
}, { passive: true }); | }, { passive: true }); | ||
// 6. 额外增强:处理点击后的菜单(如“更多操作”) | |||
document.addEventListener('click', () => { | |||
// 点击后延迟一瞬间重新扫描,确保新弹出的菜单能立即获得初始坐标 | |||
setTimeout(() => { | |||
if (window.lastMouseEvent) syncLight(window.lastMouseEvent); | |||
}, 10); | |||
}); | |||
// 记录最后的鼠标位置备用 | |||
document.addEventListener('mousemove', (e) => { | |||
window.lastMouseEvent = e; | |||
}, { passive: true }); | |||
})(); | })(); | ||
2026年1月30日 (五) 20:52的版本
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
/**
* 搜索面板弹性动画逻辑
*/
(function() {
function handlePalette() {
const palette = document.querySelector('.citizen-command-palette');
if (palette) {
// 确保位置居中并触发动画类
if (!palette.classList.contains('glass-show')) {
palette.classList.add('glass-show');
}
} else {
// 当面板关闭时,移除所有带有 glass-show 的残留(虽然通常会被销毁)
const activePalettes = document.querySelectorAll('.glass-show');
activePalettes.forEach(p => p.classList.remove('glass-show'));
}
}
// 每 50ms 检查一次搜索框状态(保持和 V20 脚本逻辑一致)
setInterval(handlePalette, 50);
})();
// 在 MediaWiki:Common.js 中尝试
$(function() {
if ($('#p-navigation').length) {
var adHtml = '<div id="sidebar-ad"></div>';
$('#p-navigation').after(adHtml);
// 使用 API 获取解析后的模板内容并注入
$.get(mw.util.wikiScript('api'), {
action: 'parse',
text: '{{CitizenAd}}',
format: 'json'
}, function(data) {
$('#sidebar-ad').html(data.parse.text['*']);
});
}
});
/**
* Blockland Wiki Liquid Glass Lighting System
* 全局液态玻璃光影联动系统
*/
(function() {
'use strict';
// 1. 模式检测:如果是 Basic 模式,执行自毁清理并终止
const checkBasicMode = () => {
return document.documentElement.classList.contains('skin-citizen-basic');
};
if (checkBasicMode()) {
// 清理可能残留的属性
document.querySelectorAll('.citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox')
.forEach(el => {
el.style.removeProperty('--mouse-x');
el.style.removeProperty('--mouse-y');
});
return;
}
// 2. 核心选择器
const GLASS_SELECTORS = '.citizen-menu__card, .citizen-toc-card, .citizen-command-palette, .infobox';
// 3. 坐标同步逻辑
const syncLight = (e) => {
// 如果运行中途动态切换到了 basic,则停止同步
if (checkBasicMode()) return;
const elements = document.querySelectorAll(GLASS_SELECTORS);
elements.forEach(el => {
const rect = el.getBoundingClientRect();
// 性能优化判断:元素必须可见且在视口内
if (rect.width > 0 && rect.top < window.innerHeight && rect.bottom > 0) {
const x = ((e.clientX - rect.left) / rect.width) * 100;
const y = ((e.clientY - rect.top) / rect.height) * 100;
if (isFinite(x) && isFinite(y)) {
el.style.setProperty('--mouse-x', x.toFixed(2) + '%');
el.style.setProperty('--mouse-y', y.toFixed(2) + '%');
}
}
});
};
// 4. 搜索面板弹性动画触发器 (每 50ms 轮询检测)
setInterval(() => {
if (checkBasicMode()) return;
const palette = document.querySelector('.citizen-command-palette');
if (palette && !palette.classList.contains('glass-show')) {
palette.classList.add('glass-show');
}
}, 50);
// 5. 鼠标移动监听 (使用 requestAnimationFrame 保证丝滑)
let ticking = false;
document.addEventListener('mousemove', (e) => {
if (!ticking) {
window.requestAnimationFrame(() => {
syncLight(e);
ticking = false;
});
ticking = true;
}
}, { passive: true });
// 6. 额外增强:处理点击后的菜单(如“更多操作”)
document.addEventListener('click', () => {
// 点击后延迟一瞬间重新扫描,确保新弹出的菜单能立即获得初始坐标
setTimeout(() => {
if (window.lastMouseEvent) syncLight(window.lastMouseEvent);
}, 10);
});
// 记录最后的鼠标位置备用
document.addEventListener('mousemove', (e) => {
window.lastMouseEvent = e;
}, { passive: true });
})();