一键将下载模型介绍和图片。
// ==UserScript==
// @name Civitai模型下载辅助
// @namespace https://greasyfork.org/zh-CN/users/904778-blueccoffee
// @version 1.5
// @description 一键将下载模型介绍和图片。
// @author AIGC知识库
// @match https://civitai.com/models/*
// @grant GM_download
// @license GNU
// ==/UserScript==
(function() {
'use strict';
function downloadMarkdownAndImage(text, fileName) {
const blob = new Blob([text], { type: 'text/markdown' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = fileName + '.md';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}
function extractFileInfo() {
const fileInfo = {};
// 提取文件名
const fileNameElement = document.querySelector('h1.mantine-Text-root');
if (fileNameElement) {
fileInfo.fileName = fileNameElement.innerText.trim();
}
// 提取介绍内容
const introductionElement = document.querySelector('div.mantine-Spoiler-content');
if (introductionElement) {
fileInfo.introduction = introductionElement.innerText.trim();
}
// 提取图片网址
const imageElement = document.querySelector('img.mantine-7aj0so');
if (imageElement) {
fileInfo.imageUrl = imageElement.src;
}
// 提取元数据信息
const metadataElement = document.querySelector('table.mantine-Table-root');
if (metadataElement) {
const rows = metadataElement.querySelectorAll('tr');
rows.forEach((row) => {
const keyElement = row.querySelector('td:nth-child(1) div.mantine-Text-root');
const valueElement = row.querySelector('td:nth-child(2) div.mantine-Text-root');
if (keyElement && valueElement) {
const key = keyElement.innerText.trim();
const value = valueElement.innerText.trim();
if (key === 'Trigger Words') {
fileInfo.triggerWords = value;
} else if (key === '源地址') {
fileInfo.sourceAddress = value;
} else if (key === '名称') {
fileInfo.name = value;
}
}
});
fileInfo.metadata = metadataElement.innerText.trim();
}
return fileInfo;
}
function addButton() {
// 添加【下载】按钮
const downloadButton = document.createElement('button');
downloadButton.innerText = '下载';
downloadButton.style.position = 'fixed';
downloadButton.style.top = '10px';
downloadButton.style.right = '60px'; // 调整位置，留出悬浮窗的空间
downloadButton.style.zIndex = '9999';
downloadButton.addEventListener('click', async () => {
const fileInfo = extractFileInfo();
// 创建Markdown文本
let markdownText = `---
Type:
Trigger: ${fileInfo.triggerWords}
note:
src: ${fileInfo.sourceAddress}
name: ${fileInfo.name}
---\n\n`;
markdownText += `# ${fileInfo.fileName}\n\n`;
markdownText += `## 介绍\n\n${fileInfo.introduction}\n\n`;
// 下载图片并将其添加到Markdown文本中
const imageData = await fetch(fileInfo.imageUrl).then(response => response.blob());
const imageFileName = fileInfo.fileName.replace(/[^a-zA-Z0-9-_]/g, '_'); // 替换非法字符
const imageBlob = new Blob([imageData], { type: 'image/png' });
const imageLink = document.createElement('a');
imageLink.href = URL.createObjectURL(imageBlob);
imageLink.download = `${imageFileName}.png`;
document.body.appendChild(imageLink);
imageLink.click();
document.body.removeChild(imageLink);
URL.revokeObjectURL(imageLink.href);
markdownText += `\n\n`;
// 添加元数据信息到Markdown文本中
markdownText += `## 元数据\n\n${fileInfo.metadata}\n\n`;
// 下载Markdown文件
downloadMarkdownAndImage(markdownText, fileInfo.fileName);
});
document.body.appendChild(downloadButton);
// 添加【关于】按钮
const aboutButton = document.createElement('button');
aboutButton.innerText = '关于';
aboutButton.style.position = 'fixed';
aboutButton.style.top = '10px';
aboutButton.style.right = '10px';
aboutButton.style.zIndex = '9999';
aboutButton.addEventListener('click', () => {
// 创建悬浮窗
const overlay = document.createElement('div');
overlay.style.position = 'fixed';
overlay.style.top = '50%';
overlay.style.left = '50%';
overlay.style.transform = 'translate(-50%, -50%)';
overlay.style.backgroundColor = 'rgba(255, 255, 255, 0.9)';
overlay.style.padding = '20px';
overlay.style.borderRadius = '8px';
overlay.style.zIndex = '9999';
overlay.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.3)';
overlay.style.maxWidth = '400px';
overlay.style.maxHeight = '80vh';
overlay.style.overflowY = 'auto';
// 创建覆盖层
const overlayCover = document.createElement('div');
overlayCover.style.position = 'fixed';
overlayCover.style.top = '0';
overlayCover.style.left = '0';
overlayCover.style.width = '100%';
overlayCover.style.height = '100%';
overlayCover.style.backgroundColor = 'rgba(0, 0, 0, 0.5)'; // 透明黑色背景
overlayCover.style.zIndex = '9998'; // 设置较低的z-index，确保覆盖悬浮窗
document.body.appendChild(overlayCover);
overlayCover.addEventListener('click', () => {
// 当用户点击覆盖层时，移除悬浮窗和覆盖层
document.body.removeChild(overlay);
document.body.removeChild(overlayCover);
});
// 模拟异步加载悬浮窗内容
fetch('https://raw.githubusercontent.com/Guyungy/AIGC-knowbase/main/civitai.md') // 替换为实际网页URL
.then(response => response.text())
.then(html => {
overlay.innerHTML = html;
// 在悬浮窗内容加载完毕后，添加点击事件
overlay.addEventListener('click', (event) => {
if (!overlay.contains(event.target)) {
document.body.removeChild(overlay);
}
});
})
.catch(error => {
overlay.innerHTML = '加载悬浮窗内容时出现错误。';
});
document.body.appendChild(overlay);
});
document.body.appendChild(aboutButton);
}
// 添加按钮
addButton();
})();