Diskuse » Creation Requests
// ==UserScript==// @name Sankaku Image Preview and Download// @namespace http://tampermonkey.net/// @version 0.5// @description Preview original images on Sankaku Complex when hovering over thumbnails and download them// @author You// @match *://chan.sankakucomplex.com/*// @grant none// ==/UserScript==(function () { 'use strict'; let hoverTimeout; let currentImageUrl = null; const createPreview = () => { const preview = document.createElement('img'); preview.id = 'image-preview'; preview.style.display = 'none'; preview.style.position = 'fixed'; preview.style.zIndex = 9999; preview.style.maxWidth = '90%'; preview.style.maxHeight = '90%'; document.body.appendChild(preview); return preview; }; const showPreview = (imgUrl, preview) => { preview.style.display = 'block'; preview.src = imgUrl; preview.style.left = '50%'; preview.style.top = '50%'; preview.style.transform = 'translate(-50%, -50%)'; console.log('显示预览:', imgUrl); }; const hidePreview = (preview) => { preview.style.display = 'none'; preview.src = ''; };// 获取原图链接的函数const getOriginalImageUrl = async (thumbnailUrl) => { const response = await fetch(thumbnailUrl); const html = await response.text(); const parser = new DOMParser(); const doc = parser.parseFromString(html, 'text/html'); const image = doc.querySelector('img#image'); return image ? image.src : null;}; const downloadImage = async (imageUrl) => { if (imageUrl) { try { const response = await fetch(imageUrl); const data = await response.blob(); const blobUrl = URL.createObjectURL(data); const link = document.createElement('a'); link.href = blobUrl; link.download = ''; link.style.display = 'none'; document.body.appendChild(link); link.click(); document.body.removeChild(link); // 释放 Blob URL setTimeout(() => URL.revokeObjectURL(blobUrl), 100); } catch (error) { console.error('下载失败:', error); } } }; const onThumbnailMouseEnter = async (e, preview) => { const target = e.target; const link = target.closest('a'); if (!link) return; const thumbnailUrl = link.href; hoverTimeout = setTimeout(async () => { const originalImageUrl = await getOriginalImageUrl(thumbnailUrl); if (!originalImageUrl) return; currentImageUrl = originalImageUrl; showPreview(originalImageUrl, preview); }, 200); }; const onThumbnailMouseLeave = (preview) => { clearTimeout(hoverTimeout); hidePreview(preview); }; const init = () => { const container = document.querySelector('.content'); if (!container) return; const preview = createPreview(); container.addEventListener('mouseover', (e) => onThumbnailMouseEnter(e, preview)); container.addEventListener('mouseout', () => onThumbnailMouseLeave(preview)); // 按下 "+" 键时下载图片 document.addEventListener('keydown', (e) => { if (e.key === '+' || e.code === 'NumpadAdd') { downloadImage(currentImageUrl); } }); }; init();})();
如果你打算发布脚本的话,可以在依次点击中在中的页眉(header)昵称-发布你编写的脚本。
Sign in to post a reply.
// ==UserScript==
// @name Sankaku Image Preview and Download
// @namespace http://tampermonkey.net/
// @version 0.5
// @description Preview original images on Sankaku Complex when hovering over thumbnails and download them
// @author You
// @match *://chan.sankakucomplex.com/*
// @grant none
// ==/UserScript==
(function () {
'use strict';
let hoverTimeout;
let currentImageUrl = null;
const createPreview = () => {
const preview = document.createElement('img');
preview.id = 'image-preview';
preview.style.display = 'none';
preview.style.position = 'fixed';
preview.style.zIndex = 9999;
preview.style.maxWidth = '90%';
preview.style.maxHeight = '90%';
document.body.appendChild(preview);
return preview;
};
const showPreview = (imgUrl, preview) => {
preview.style.display = 'block';
preview.src = imgUrl;
preview.style.left = '50%';
preview.style.top = '50%';
preview.style.transform = 'translate(-50%, -50%)';
console.log('显示预览:', imgUrl);
};
const hidePreview = (preview) => {
preview.style.display = 'none';
preview.src = '';
};
// 获取原图链接的函数
const getOriginalImageUrl = async (thumbnailUrl) => {
const response = await fetch(thumbnailUrl);
const html = await response.text();
const parser = new DOMParser();
const doc = parser.parseFromString(html, 'text/html');
const image = doc.querySelector('img#image');
return image ? image.src : null;
};
const downloadImage = async (imageUrl) => {
if (imageUrl) {
try {
const response = await fetch(imageUrl);
const data = await response.blob();
const blobUrl = URL.createObjectURL(data);
const link = document.createElement('a');
link.href = blobUrl;
link.download = '';
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 释放 Blob URL
setTimeout(() => URL.revokeObjectURL(blobUrl), 100);
} catch (error) {
console.error('下载失败:', error);
}
}
};
const onThumbnailMouseEnter = async (e, preview) => {
const target = e.target;
const link = target.closest('a');
if (!link) return;
const thumbnailUrl = link.href;
hoverTimeout = setTimeout(async () => {
const originalImageUrl = await getOriginalImageUrl(thumbnailUrl);
if (!originalImageUrl) return;
currentImageUrl = originalImageUrl;
showPreview(originalImageUrl, preview);
}, 200);
};
const onThumbnailMouseLeave = (preview) => {
clearTimeout(hoverTimeout);
hidePreview(preview);
};
const init = () => {
const container = document.querySelector('.content');
if (!container) return;
const preview = createPreview();
container.addEventListener('mouseover', (e) => onThumbnailMouseEnter(e, preview));
container.addEventListener('mouseout', () => onThumbnailMouseLeave(preview));
// 按下 "+" 键时下载图片
document.addEventListener('keydown', (e) => {
if (e.key === '+' || e.code === 'NumpadAdd') {
downloadImage(currentImageUrl);
}
});
};
init();
})();