Lazy load links and show their titles
// ==UserScript==
// @name BangumiLazyPreviewLinkForWiki
// @namespace https://github.com/Adachi-Git/BangumiLazyPreviewLink
// @version 0.8
// @description Lazy load links and show their titles
// @author Jirehlov (Original Author), Adachi (Current Author)
// @include /^https?://(bangumi\.tv|bgm\.tv|chii\.in)/.*
// @grant none
// @license MIT
// @require https://cdnjs.cloudflare.com/ajax/libs/localforage/1.10.0/localforage.min.js
// ==/UserScript==
(function () {
'use strict';
// 初始化 localForage
localforage.config({
driver: localforage.INDEXEDDB, // 使用 IndexedDB 存储
name: 'localforage', // 指定数据库名称
version: 1.0, // 数据库版本
storeName: 'keyvaluepairs' // 存储链接的对象存储空间名称
});
// 删除可视区域内的零宽空格字符
function removeZeroWidthSpacesInView() {
document.querySelectorAll('*').forEach(element => {
const rect = element.getBoundingClientRect();
// 检查元素是否在可视区域内
if (rect.top >= 0 && rect.bottom <= window.innerHeight) {
element.childNodes.forEach(node => {
if (node.nodeType === Node.TEXT_NODE) {
node.textContent = node.textContent.replace(/\u200B/g, ''); // 替换零宽空格字符
}
});
}
});
}
// 替换链接文本为链接指向页面的标题
async function replaceLinkText(link) {
try {
let linkURL = link.href;
if (window.location.href.includes('bangumi.tv')) {
linkURL = linkURL.replace('bgm.tv', 'bangumi.tv');
} else if (window.location.href.includes('chii.in')) {
linkURL = linkURL.replace(/bangumi\.tv|bgm\.tv/, 'chii.in');
}
if (link.textContent === link.href) {
console.log(`Processing link: ${linkURL}`);
const cachedTitle = await localforage.getItem(linkURL);
console.log(`Cached title for ${linkURL}: ${cachedTitle}`);
if (cachedTitle) {
link.textContent = cachedTitle + ',';
} else {
console.log('Fetching data from network...');
const response = await fetch(linkURL);
const data = await response.text();
const parser = new DOMParser();
const htmlDoc = parser.parseFromString(data, 'text/html');
const title = htmlDoc.querySelector('h1.nameSingle a');
let titleText = title ? title.textContent : '';
if (link.href.includes('subject') || link.href.includes('ep')) {
const chineseName = title ? title.getAttribute('title') : '';
if (chineseName) {
if (titleText) {
titleText += ' | ' + chineseName;
} else {
titleText = chineseName;
}
}
}
if (link.href.includes('ep')) {
const epTitle = htmlDoc.querySelector('h2.title');
if (epTitle) {
epTitle.querySelectorAll('small').forEach(small => small.remove());
const epTitleText = epTitle.textContent;
if (epTitleText) {
if (titleText) {
titleText += ' | ' + epTitleText;
} else {
titleText = epTitleText;
}
}
}
}
if (titleText) {
link.textContent = titleText + ',';
console.log(`Title for ${linkURL} retrieved from network: ${titleText}`);
await localforage.setItem(linkURL, titleText);
console.log(`Cached title for ${linkURL}`);
}
}
}
} catch (error) {
console.error('Error in replaceLinkText:', error);
}
}
// 获取页面上的所有链接
const allLinks = document.querySelectorAll('a[href^="https://bgm.tv/subject/"], a[href^="https://chii.in/subject/"], a[href^="https://bangumi.tv/subject/"], a[href^="https://bgm.tv/ep/"], a[href^="https://chii.in/ep/"], a[href^="https://bangumi.tv/ep/"], a[href^="https://bgm.tv/character/"], a[href^="https://chii.in/character/"], a[href^="https://bangumi.tv/character/"], a[href^="https://bgm.tv/person/"], a[href^="https://chii.in/person/"], a[href^="https://bangumi.tv/person/"]');
// 懒加载链接的函数
function lazyLoadLinks() {
allLinks.forEach(link => {
const rect = link.getBoundingClientRect();
if (rect.top >= 0 && rect.bottom <= window.innerHeight) {
replaceLinkText(link);
}
});
}
// 在滚动事件中触发懒加载
window.addEventListener('scroll', () => {
// 当页面滚动停止一段时间后再执行懒加载
clearTimeout(window.timer);
window.timer = setTimeout(() => {
lazyLoadLinks();
}, 200); // 等待200毫秒
});
// 监听文本选中事件
let selectionTimeout;
document.addEventListener('selectionchange', () => {
clearTimeout(selectionTimeout);
selectionTimeout = setTimeout(() => {
const selection = window.getSelection();
let selectedText = selection.toString().trim();
selectedText = selectedText.replace(/,$/, ''); // 去除选定文本末尾的逗号
if (selectedText) {
const selectedWords = selectedText.split(/,\s*/); // 使用逗号和可能的空格进行分词
const selectedIDs = [];
allLinks.forEach(link => {
const linkText = link.textContent.trim().replace(/,$/, ''); // 去除链接文本末尾的逗号
if (selectedWords.some(word => linkText.includes(word))) {
const id = link.href.match(/\d+/)[0];
selectedIDs.push(id);
}
});
if (selectedIDs.length > 0) {
showFloatingDiv(selectedIDs);
}
} else {
hideFloatingDiv();
}
}, 500); // 等待500毫秒
});
// 创建浮动窗口元素
const floatingDiv = document.createElement('div');
floatingDiv.style.position = 'fixed';
floatingDiv.style.top = '50px';
floatingDiv.style.left = '50px';
floatingDiv.style.padding = '10px';
floatingDiv.style.background = '#fff';
floatingDiv.style.border = '1px solid #ccc';
floatingDiv.style.borderRadius = '5px';
floatingDiv.style.boxShadow = '0px 0px 10px rgba(0, 0, 0, 0.1)';
floatingDiv.style.zIndex = '9999';
floatingDiv.style.display = 'none';
document.body.appendChild(floatingDiv);
// 显示浮动窗口
function showFloatingDiv(ids) {
floatingDiv.innerHTML = ''; // 清空浮动窗口内容
const uniqueIDs = [...new Set(ids)]; // 使用 Set 来获取唯一的 ID
uniqueIDs.forEach(id => {
const itemDiv = document.createElement('div');
itemDiv.textContent = id + ',';
floatingDiv.appendChild(itemDiv);
});
floatingDiv.style.display = 'block';
// 添加点击事件监听器
floatingDiv.addEventListener('click', () => {
copyAllToClipboard(uniqueIDs);
});
}
// 复制全部文本到剪贴板，并隐藏浮动窗口
function copyAllToClipboard(ids) {
const clipboardText = ids.join(',');
navigator.clipboard.writeText(clipboardText)
.then(() => {
console.log('Copied to clipboard:', clipboardText);
hideFloatingDiv(); // 复制完成后隐藏悬浮框
})
.catch(err => console.error('Failed to copy to clipboard:', err));
}
// 隐藏浮动窗口
function hideFloatingDiv() {
floatingDiv.style.display = 'none';
}
// 页面加载完成时立即执行一次懒加载
window.addEventListener('DOMContentLoaded', lazyLoadLinks);
// 页面完全加载后再执行一次删除零宽空格字符
window.addEventListener('load', removeZeroWidthSpacesInView);
})();