Save as HTML and Print articles from Civitai

Save Civitai articles as HTML or Print Articles
当前为 2024-02-25 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name        Save as HTML and Print articles from Civitai
// @version     1.1
// @namespace   cyberdelia extract
// @description Save Civitai articles as HTML or Print Articles
// @license     MIT
// @match       https://civitai.com/articles/*
// @icon        https://civitai.com/favicon.ico
// @author      Cyberdelia
// @run-at      document-idle
// @grant       none
// ==/UserScript==

(function() {
    'use strict';

    // Function to extract and save a specific part of the page as HTML
    function extractAndSaveAsHTML() {
        // Define the selector for the part of the page you want to extract
        var selector = 'article'; // Replace '.your-selector' with the appropriate CSS selector

        // Select the element using the selector
        var element = document.querySelector(selector);

        if (!element) {
            console.error('Element not found:', selector);
            return;
        }

        // Get the title from the <h1> tag
        var titleElement = document.querySelector('h1.mantine-Text-root');
        var title = titleElement ? titleElement.textContent : '';

        // Get the author from the '.mantine-Text-root.mantine-aljean' tag
        var authorElement = document.querySelector('.mantine-Text-root.mantine-aljean');
        var author = authorElement ? authorElement.textContent : '';

        // Define additional CSS styles to ensure black text
        var additionalStyles = "body { color: black !important; }";

        // Create a new HTML document with title and author prepended to content
        var htmlContent = "<!DOCTYPE html><html lang='en'><head><meta charset='UTF-8'><title>" + title + "</title><style>" + additionalStyles + "</style></head><body><h1>" + title + "</h1>by " + author + "<hr>" + element.innerHTML + "</body></html>";

        // Create a Blob object containing the HTML content
        var blob = new Blob([htmlContent], { type: 'text/html' });

        // Create a link element to download the HTML file with the title as the filename
        var link = document.createElement('a');
        link.href = URL.createObjectURL(blob);
        link.download = title.replace(/\s+/g, '_') + '.html'; // Replace spaces with underscores and add .html extension

        // Simulate click on the link to trigger download
        link.click();
    }

    // Function to print the specific part of the page
    function printContent() {
        // Define the selector for the part of the page you want to print
        var selector = 'article'; // Replace '.your-selector' with the appropriate CSS selector

        // Select the element(s) using the selector
        var element = document.querySelector(selector);

        if (!element) {
            console.error('Element not found:', selector);
            return;
        }

        // Get the title from the <h1> tag
        var titleElement = document.querySelector('h1.mantine-Text-root');
        var title = titleElement ? titleElement.textContent : '';

        // Get the author from the '.mantine-Text-root.mantine-aljean' tag
        var authorElement = document.querySelector('.mantine-Text-root.mantine-aljean');
        var author = authorElement ? authorElement.textContent : '';

        // Open a new window and write the content to it
        var printWindow = window.open('', '_blank');
        printWindow.document.write('<html><head><title>' + document.title + '</title><style>body { color: black !important; }</style></head><body><h1>' + title + '</h1>by ' + author + '<hr>');
        printWindow.document.write(element.innerHTML);
        printWindow.document.write('</body></html>');
        printWindow.document.close();

        // Print the content
        printWindow.print();
    }

    // Function to save the page as HTML with only black text
    function saveBlackTextAsHTML() {
        // Define the selector for the part of the page you want to extract
        var selector = 'article'; // Replace '.your-selector' with the appropriate CSS selector

        // Select the element using the selector
        var element = document.querySelector(selector);

        if (!element) {
            console.error('Element not found:', selector);
            return;
        }

        // Get the title from the <h1> tag
        var titleElement = document.querySelector('h1.mantine-Text-root');
        var title = titleElement ? titleElement.textContent : '';

        // Get the author from the '.mantine-Text-root.mantine-aljean' tag
        var authorElement = document.querySelector('.mantine-Text-root.mantine-aljean');
        var author = authorElement ? authorElement.textContent : '';

        // Define additional CSS styles to ensure black text
        var additionalStyles = "body { color: black !important; }";

        // Create a new HTML document with title and author prepended to content
        var htmlContent = "<!DOCTYPE html><html lang='en'><head><meta charset='UTF-8'><title>" + title + "</title><style>" + additionalStyles + "</style></head><body><h1>" + title + "</h1>by " + author + "<hr>" + element.innerHTML + "</body></html>";

        // Create a Blob object containing the HTML content
        var blob = new Blob([htmlContent], { type: 'text/html' });

        // Create a link element to download the HTML file with the title as the filename
        var link = document.createElement('a');
        link.href = URL.createObjectURL(blob);
        link.download = title.replace(/\s+/g, '_') + '_black.html'; // Add '_black' to filename to indicate black text

        // Simulate click on the link to trigger download
        link.click();
    }

    // Function to add buttons for triggering extraction, printing, and saving with black text
    function addButton() {
        var container = document.createElement('div');
        container.style.display = 'inline-flex';
        container.style.flex = 'fit-content';
        container.style.minHeight = '34px';
        container.style.justifyContent = 'center';
        container.style.alignItems = 'center';

        var htmlButton = document.createElement('button');
        htmlButton.textContent = 'Save article as HTML';
        htmlButton.addEventListener('click', extractAndSaveAsHTML);
        htmlButton.style.color = 'white';
        htmlButton.style.backgroundColor = '#228be6';
        htmlButton.style.height = '30px';
        htmlButton.style.borderRadius = '4px';
        htmlButton.style.fontWeight = 'bold';
        htmlButton.style.fontSize = 'small';
        htmlButton.style.cursor = 'pointer';
        htmlButton.style.wordBreak = 'keep-all';
        htmlButton.style.padding = '0 2rem';
        htmlButton.style.margin = '0 10px 0 0';
        htmlButton.style.whiteSpace = 'nowrap';
        htmlButton.style.overflow = 'hidden';

        var printButton = document.createElement('button');
        printButton.textContent = 'Print article';
        printButton.addEventListener('click', printContent);
        printButton.style.color = 'white';
        printButton.style.backgroundColor = '#228be6';
        printButton.style.height = '30px';
        printButton.style.borderRadius = '4px';
        printButton.style.fontWeight = 'bold';
        printButton.style.fontSize = 'small';
        printButton.style.cursor = 'pointer';
        printButton.style.wordBreak = 'keep-all';
        printButton.style.padding = '0 2rem';
        printButton.style.margin = '0';
        printButton.style.whiteSpace = 'nowrap';
        printButton.style.overflow = 'hidden';

        var blackTextButton = document.createElement('button');
        blackTextButton.textContent = 'Save article as clean HTML';
        blackTextButton.addEventListener('click', saveBlackTextAsHTML);
        blackTextButton.style.color = 'white';
        blackTextButton.style.backgroundColor = '#228be6';
        blackTextButton.style.height = '30px';
        blackTextButton.style.borderRadius = '4px';
        blackTextButton.style.fontWeight = 'bold';
        blackTextButton.style.fontSize = 'small';
        blackTextButton.style.cursor = 'pointer';
        blackTextButton.style.wordBreak = 'keep-all';
        blackTextButton.style.padding = '0 2rem';
        blackTextButton.style.margin = '0 10px 0 0';
        blackTextButton.style.whiteSpace = 'nowrap';
        blackTextButton.style.overflow = 'hidden';

        container.appendChild(htmlButton);
        container.appendChild(blackTextButton);
        container.appendChild(printButton);


        // Select the article element
        var articleElement = document.querySelector('.mantine-Stack-root');
        // Insert the button container before the article element
        if (articleElement && articleElement.parentNode) {
            articleElement.parentNode.insertBefore(container, articleElement);
        }
    }

    // Check if the current URL matches the desired pattern
    if (window.location.href.startsWith('https://civitai.com/articles/')) {
        // Add the buttons when the URL matches
        addButton();
    }
})();
欢迎访问Greasy Fork镜像
