用户:Hehua/filepreview.js - 版本历史

Hehua：[IPE-NEXT] Quick edit

2026-07-23T07:07:26Z

[IPE-NEXT] Quick edit

←上一版本		2026年7月23日 (四) 07:07的版本
第19行：		第19行：
	var CONFIG = {		var CONFIG = {
	delay: 400,		delay: 400,
	~~thumbWidth: 220,~~
	maxPopupWidth: 480,		maxPopupWidth: 480,
	maxPopupHeight: 540		maxPopupHeight: 540
第108行：		第107行：
	tllimit: 50,		tllimit: 50,
	iiprop: 'url\|size\|user\|comment\|timestamp\|extmetadata',		iiprop: 'url\|size\|user\|comment\|timestamp\|extmetadata',
	~~iiurlwidth: CONFIG.thumbWidth,~~
	format: 'json'		format: 'json'
	});		});
第124行：		第122行：
	var ii = page.imageinfo && page.imageinfo[0];		var ii = page.imageinfo && page.imageinfo[0];
	if (ii) {		if (ii) {
	~~if (ii.thumburl) {~~
	~~parts.push('<div style="text-align:center;margin-bottom:8px;"><a href="' + esc(ii.url) + '" target="_blank">' +~~
	~~'<img src="' + esc(ii.thumburl) + '" alt="" style="max-width:100%;border:1px solid #eaecf0;border-radius:3px;"></a></div>');~~
	}
	var meta = [];		var meta = [];
	if (ii.width && ii.height) meta.push(ii.width + '\u00d7' + ii.height + ' (' + fmtBytes(ii.size) + ')');		if (ii.width && ii.height) meta.push(ii.width + '\u00d7' + ii.height + ' (' + fmtBytes(ii.size) + ')');

Hehua：[IPE-NEXT] Quick edit

2026-07-23T07:04:54Z

[IPE-NEXT] Quick edit

显示更改

Hehua：[IPE-NEXT] Quick edit

2026-07-23T07:01:10Z

[IPE-NEXT] Quick edit

←上一版本		2026年7月23日 (四) 07:01的版本
第84行：		第84行：
	}		}
	var fileNSNames = getFileNSNames();		var fileNSNames = getFileNSNames();
	var fileNSRe = new RegExp('^(' + fileNSNames.map(function(n) { return n.replace(/[.*+?^${}()\|[\]\\]/g, '\\$&'); }).join('\|') + '):', 'i');		var fileNSRe = new RegExp('^(' + fileNSNames.map(function(n) { return n.replace(/[.*+?^${}()\|[\]\\]/g, '\\$&'); }).join('\|') + '):(.+)$', 'i');

	/* ---------- api + render ---------- */		/* ---------- api + render ---------- */

Hehua：[IPE-NEXT] Quick edit

2026-07-23T06:59:07Z

[IPE-NEXT] Quick edit

←上一版本		2026年7月23日 (四) 06:59的版本
第186行：		第186行：
	clearTimeout(state.hideTimer);		clearTimeout(state.hideTimer);
	var title = getFileTitle(link);		var title = getFileTitle(link);
	if (!title) return;		if (!title) {
			console.log('[FilePreview] 无法提取标题, title属性:', link.getAttribute('title'));
			return;
			}
			console.log('[FilePreview] 请求:', title);
	var x = e.clientX, y = e.clientY;		var x = e.clientX, y = e.clientY;
	state.fetchTimer = setTimeout(function () {		state.fetchTimer = setTimeout(function () {
	showPopup(link, x, y, '<div style="color:#888;">\u52a0\u8f7d\u4e2d\u2026 ' + esc(title) + '</div>');		showPopup(link, x, y, '<div style="color:#888;">\u52a0\u8f7d\u4e2d\u2026 ' + esc(title) + '</div>');
	fetchData(title).then(function (d) { render(d, link, x, y); })		fetchData(title).then(function (d) {
	.catch(function (err) { showPopup(link, x, y, '<div style="color:#c00;">\u5931\~~u8d25~~: ' + esc(String(err)) + '</div>'); });		console.log('[FilePreview] API返回:', JSON.stringify(d).slice(0, 300));
			render(d, link, x, y);
			}).catch(function (err) {
			console.log('[FilePreview] API错误:', err);
			showPopup(link, x, y, '<div style="color:#c00;">\u5931\u8d95: ' + esc(String(err)) + '</div>');
			});
	}, CONFIG.delay);		}, CONFIG.delay);
	});		});

2026年7月23日 (四) 06:54 Hehua

2026-07-23T06:54:42Z

←上一版本		2026年7月23日 (四) 06:54的版本
第73行：		第73行：
	if (state.popup) state.popup.style.display = 'none';		if (state.popup) state.popup.style.display = 'none';
	}		}

			/* ---------- localized namespace ---------- */
			function getFileNSNames() {
			var names = ['File', 'Image'];
			var fmt = mw.config.get('wgFormattedNamespaces') \|\| {};
			if (fmt[6] && names.indexOf(fmt[6]) === -1) names.push(fmt[6]);
			var aliases = mw.config.get('wgNamespaceAliases') \|\| {};
			for (var a in aliases) { if (aliases[a] === 6 && names.indexOf(a) === -1) names.push(a); }
			return names;
			}
			var fileNSNames = getFileNSNames();
			var fileNSRe = new RegExp('^(' + fileNSNames.map(function(n) { return n.replace(/[.*+?^${}()\|[\]\\]/g, '\\$&'); }).join('\|') + '):', 'i');

	/* ---------- api + render ---------- */		/* ---------- api + render ---------- */
第84行：		第96行：
	function getFileTitle(link) {		function getFileTitle(link) {
	var t = link.getAttribute('title') \|\| '';		var t = link.getAttribute('title') \|\| '';
	var m = t.match(~~/^(File\|Image):(.+)$/i~~);		var m = t.match(fileNSRe);
	if (m) return ~~m[1] +~~ ':' + m[2];		if (m) return 'File:' + m[2];
	var h = link.getAttribute('href') \|\| '';		var h = link.getAttribute('href') \|\| '';
	m = h.match(/[?&]title=(File\|Image):([^&]+)/);		m = h.match(/[?&]title=(File\|Image):([^&]+)/);
	if (m) return ~~m[1] +~~ ':' + decodeURIComponent(m[2].replace(/\+/g, ' '));		if (m) return 'File:' + decodeURIComponent(m[2].replace(/\+/g, ' '));
	return null;		return null;
			}
			function isFileLink(link) {
			if (!link) return false;
			var title = link.getAttribute('title') \|\| '';
			if (fileNSRe.test(title)) return true;
			var href = link.href \|\| '';
			if (/\/wiki\/(File\|Image):/i.test(href) \|\| /[?&]title=(File\|Image):/i.test(href)) return true;
			return false;
	}		}

第182行：		第202行：

	function scanLinks() {		function scanLinks() {
	var ~~links~~ = ~~document~~.~~querySelectorAll~~('a[title^="~~File~~:"], ~~a[title^~~=~~"Image:"]'~~);		var sel = fileNSNames.map(function (n) { return 'a[title^="' + n + ':"]'; }).join(',');
	console.log('[FilePreview] 找到 ' + links.length ~~+ ' 个文件链接'~~);		var links = document.querySelectorAll(sel);
			console.log('[FilePreview] 命名空间名:', JSON.stringify(fileNSNames), '选择器:', sel, '找到:', links.length);
	links.forEach(bindLink);		links.forEach(bindLink);
	}		}

2026年7月23日 (四) 06:43 Hehua

2026-07-23T06:43:52Z

显示更改

2026年7月23日 (四) 06:37 Hehua

2026-07-23T06:37:48Z

显示更改

Hehua：创建页面，内容为“/** * FilePreview — 文件链接悬停预览脚本 * 鼠标悬停在 File: 蓝色链接上时，弹出浮窗显示： * - 缩略图预览 * - 文件信息（尺寸、大小、上传者） * - 分类 (categories) * - 版权/许可模板 (templates) * * 安装方式：将本脚本的内容复制到你的 * User:<你的名字>/common.js 或 MediaWiki:Common.js * 或通过 importScript 引入。 */ mw.loader.using(['mediawiki.api', 'mediawiki…”

2026-07-23T06:29:08Z

创建页面，内容为“* * FilePreview — 文件链接悬停预览脚本 * 鼠标悬停在 File: 蓝色链接上时，弹出浮窗显示： * - 缩略图预览 * - 文件信息（尺寸、大小、上传者） * - 分类 (categories) * - 版权/许可模板 (templates) * * 安装方式：将本脚本的内容复制到你的 * User:<你的名字>/common.js 或 MediaWiki:Common.js * 或通过 importScript 引入。： mw.loader.using(['mediawiki.api', 'mediawiki…”

新页面

/**
* FilePreview — 文件链接悬停预览脚本
* 鼠标悬停在 File: 蓝色链接上时，弹出浮窗显示：
* - 缩略图预览
* - 文件信息（尺寸、大小、上传者）
* - 分类 (categories)
* - 版权/许可模板 (templates)
*
* 安装方式：将本脚本的内容复制到你的
* User:<你的名字>/common.js 或 MediaWiki:Common.js
* 或通过 importScript 引入。
*/
mw.loader.using(['mediawiki.api', 'mediawiki.util']).then(function () {
'use strict';

var CONFIG = {
delay: 400, // 悬停延迟 (ms)
thumbWidth: 220, // 缩略图宽度
maxPopupWidth: 460,
maxPopupHeight: 520
};

/* ---------- state ---------- */
var state = {
link: null,
fetchTimer: null,
hideTimer: null,
popup: null
};

/* ---------- popup DOM ---------- */
function getPopup() {
if (!state.popup) {
var el = document.createElement('div');
el.id = 'filepreview-popup';
el.style.cssText = [
'display:none',
'position:fixed',
'z-index:9999',
'background:#fff',
'border:1px solid #c8ccd1',
'border-radius:6px',
'box-shadow:0 4px 16px rgba(0,0,0,0.2)',
'padding:14px',
'max-width:' + CONFIG.maxPopupWidth + 'px',
'max-height:' + CONFIG.maxPopupHeight + 'px',
'overflow-y:auto',
'font:13px/1.5 sans-serif',
'color:#222',
'pointer-events:auto'
].join(';');
document.body.appendChild(el);
state.popup = el;

// 鼠标移到浮窗上时不隐藏
el.addEventListener('mouseenter', function () {
clearTimeout(state.hideTimer);
clearTimeout(state.fetchTimer);
});
el.addEventListener('mouseleave', function (e) {
if (e.relatedTarget && e.relatedTarget.closest && e.relatedTarget.closest('a') === state.link) {
return;
}
hidePopup();
});
}
return state.popup;
}

function showPopup(x, y, html) {
var popup = getPopup();
popup.innerHTML = html;
popup.style.display = 'block';

var rect = popup.getBoundingClientRect();
var left = Math.max(6, Math.min(x + 12, window.innerWidth - rect.width - 6));
var top = Math.max(6, Math.min(y + 12, window.innerHeight - rect.height - 6));
popup.style.left = left + 'px';
popup.style.top = top + 'px';
}

function hidePopup() {
clearTimeout(state.hideTimer);
clearTimeout(state.fetchTimer);
if (state.popup) state.popup.style.display = 'none';
state.link = null;
}

/* ---------- helpers ---------- */
function getFileTitle(link) {
var title = link.getAttribute('title') || link.getAttribute('data-title') || '';
var m = title.match(/^(File|Image):(.+)$/i);
if (m) return m[1] + ':' + m[2];
// 后备：从 href 解析
var href = link.getAttribute('href') || '';
m = href.match(/[?&]title=(File|Image):([^&]+)/);
if (m) return m[1] + ':' + decodeURIComponent(m[2].replace(/\+/g, ' '));
return null;
}

function isFileLink(link) {
if (!link || !link.href) return false;
var title = link.getAttribute('title') || '';
if (/^(File|Image):/i.test(title)) return true;
return /[?&]title=(File|Image):/i.test(link.search || link.href);
}

function fmtBytes(b) {
if (!b) return '?';
if (b < 1024) return b + ' B';
if (b < 1048576) return (b / 1024).toFixed(1) + ' KB';
return (b / 1048576).toFixed(1) + ' MB';
}

function esc(s) {
return mw.html.escape(String(s));
}

/* ---------- API ---------- */
function fetchFileData(fileTitle) {
var api = new mw.Api();
return api.get({
action: 'query',
titles: fileTitle,
prop: 'categories|templates|imageinfo|info',
cllimit: 50,
tllimit: 50,
clprop: 'sortkey',
iiprop: 'url|size|user|comment|timestamp|extmetadata',
iiurlwidth: CONFIG.thumbWidth,
format: 'json'
});
}

/* ---------- render ---------- */
function renderPopup(data, x, y) {
var pages = data.query && data.query.pages;
if (!pages) { showPopup(x, y, '<div style="color:#c00;">无法获取数据</div>'); return; }

var id = Object.keys(pages)[0];
var page = pages[id];
if (id === '-1' || !page) {
showPopup(x, y, '<div style="color:#888;">文件页面不存在</div>');
return;
}

var parts = [];
parts.push('<div style="font-weight:bold;font-size:14px;margin-bottom:6px;word-break:break-all;">' + esc(page.title) + '</div>');

// 缩略图
var ii = page.imageinfo && page.imageinfo[0];
if (ii) {
if (ii.thumburl) {
parts.push('<div style="text-align:center;margin-bottom:8px;"><a href="' + esc(ii.url) + '" target="_blank">' +
'<img src="' + esc(ii.thumburl) + '" alt="" style="max-width:100%;border:1px solid #eaecf0;border-radius:3px;"></a></div>');
}
var meta = [];
if (ii.width && ii.height) meta.push(ii.width + '×' + ii.height + ' (' + fmtBytes(ii.size) + ')');
if (ii.user) meta.push('上传者: ' + esc(ii.user));
if (meta.length) parts.push('<div style="color:#555;margin-bottom:4px;font-size:12px;">' + meta.join(' | ') + '</div>');

// 许可信息 (extmetadata)
if (ii.extmetadata) {
var licField = ii.extmetadata.LicenseShortName || ii.extmetadata.License || ii.extmetadata.Copyright;
if (licField) {
var licVal = licField.value || licField;
parts.push('<div style="color:#555;margin-bottom:4px;font-size:12px;">许可: ' + esc(String(licVal)) + '</div>');
}
}
}

// 分类
if (page.categories && page.categories.length) {
parts.push('<div style="margin-top:8px;font-weight:bold;font-size:13px;">分类</div>');
parts.push('<ul style="margin:2px 0 0 14px;padding:0;list-style:none;">');
var cats = page.categories.slice(0, 25);
cats.forEach(function (c) {
parts.push('<li style="padding:1px 0;font-size:12px;">• ' + esc(c.title.replace(/^Category:/, '')) + '</li>');
});
if (page.categories.length > 25) {
parts.push('<li style="color:#888;font-size:12px;">… 还有 ' + (page.categories.length - 25) + ' 个</li>');
}
parts.push('</ul>');
} else {
parts.push('<div style="margin-top:6px;color:#888;font-size:12px;">无分类</div>');
}

// 模板（含版权模板）
if (page.templates && page.templates.length) {
parts.push('<div style="margin-top:8px;font-weight:bold;font-size:13px;">模板 (含版权/许可)</div>');
parts.push('<div style="margin:2px 0 0;max-height:130px;overflow-y:auto;">');
var tpls = page.templates.slice(0, 40);
tpls.forEach(function (t) {
var name = t.title.replace(/^Template:/, '');
parts.push('<span style="display:inline-block;background:#f0f2f5;border:1px solid #d4d8dd;border-radius:3px;padding:1px 5px;margin:1px 2px;font:12px monospace;color:#333;">{{' + esc(name) + '}}</span>');
});
if (page.templates.length > 40) {
parts.push('<span style="color:#888;font-size:11px;"> …+' + (page.templates.length - 40) + '</span>');
}
parts.push('</div>');
}

// 底部链接
var url = mw.config.get('wgScript') || '/wiki/';
var target = page.title.replace(/ /g, '_');
parts.push('<div style="margin-top:10px;border-top:1px solid #eaecf0;padding-top:6px;text-align:right;font-size:12px;">' +
'<a href="' + url + esc(target) + '" target="_blank">打开文件页 →</a></div>');

showPopup(x, y, parts.join(''));
}

/* ---------- hover handlers ---------- */
function onLinkOver(e) {
var link = e.target.closest ? e.target.closest('a[href]') : null;
if (!link || !isFileLink(link)) return;
if (link === state.link) return;

clearTimeout(state.fetchTimer);
clearTimeout(state.hideTimer);
state.link = link;

var title = getFileTitle(link);
if (!title) return;

state.fetchTimer = setTimeout(function () {
showPopup(e.clientX, e.clientY, '<div style="color:#888;font-size:13px;">加载中… ' + esc(title) + '</div>');
fetchFileData(title).then(function (data) {
if (state.link === link) renderPopup(data, e.clientX, e.clientY);
}).catch(function (err) {
if (state.link === link) showPopup(e.clientX, e.clientY, '<div style="color:#c00;">请求失败: ' + esc(String(err)) + '</div>');
});
}, CONFIG.delay);
}

function onLinkOut(e) {
var link = e.target.closest ? e.target.closest('a[href]') : null;
if (!link || !isFileLink(link)) return;
if (link !== state.link) return;

// 如果鼠标进入浮窗则不隐藏
clearTimeout(state.fetchTimer);
state.hideTimer = setTimeout(function () {
hidePopup();
}, 200);
}

/* ---------- install ---------- */
document.addEventListener('mouseover', onLinkOver, true);
document.addEventListener('mouseout', onLinkOut, true);

// 滚动时隐藏
window.addEventListener('scroll', function () { hidePopup(); }, true);
});

用户:Hehua/filepreview.js - 版本历史

Hehua：​[IPE-NEXT] Quick edit

Hehua：​[IPE-NEXT] Quick edit

Hehua：​[IPE-NEXT] Quick edit

Hehua：​[IPE-NEXT] Quick edit

2026年7月23日 (四) 06:54 Hehua

2026年7月23日 (四) 06:43 Hehua

2026年7月23日 (四) 06:37 Hehua

Hehua：[IPE-NEXT] Quick edit

Hehua：[IPE-NEXT] Quick edit

Hehua：[IPE-NEXT] Quick edit

Hehua：[IPE-NEXT] Quick edit