IThome Pro

优化ithome网页端浏览效果

Per 19-08-2024. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         IThome Pro
// @version      1.0
// @description  优化ithome网页端浏览效果
// @match        https://www.ithome.com/*
// @run-at       document-start
// @namespace https://greasyfork.org/users/1354671
// ==/UserScript==

(function() {
    'use strict';

    // Function to keep the page active by simulating clicks
    function keepPageActive() {
        const event = new MouseEvent('click', {
            view: window,
            bubbles: true,
            cancelable: true,
            clientX: 0, // 点击页面左上角,通常是空白区域
            clientY: 0
        });
        document.dispatchEvent(event);
    }

    // Set an interval to keep the page active every 0.1 seconds
    const intervalId = setInterval(keepPageActive, 100);

    // Stop the interval after 10 seconds
    setTimeout(() => {
        clearInterval(intervalId);
    }, 10000);

    // Redirect from homepage to blog page
    if (window.location.href === 'https://www.ithome.com/') {
        const style = document.createElement('style');
        style.innerHTML = `body { display: none; }`;
        document.head.appendChild(style);
        window.location.replace('https://www.ithome.com/blog/');
        return;
    }

    // Initial CSS to hide elements before page load
    const style = document.createElement('style');
    style.innerHTML = `
        #nav, #top, #tt, #list > div.fr.fx:last-child, #side_func,
        #dt > div.fl.content:first-child > div.cv:first-child, #dt > div.fr.fx:last-child,
        #dt > div.fl.content:first-child > div.newsgrade:nth-child(6),
        #dt > div.fl.content:first-child > div.shareto:nth-child(7),
        #dt > div.fl.content:first-child > iframe.dajia:nth-child(10),
        #rm-login-modal > div.modal.has-title.loaded,
        #dt > div.fl.content:first-child > div.related_post:nth-child(8),
        #dt > div.fl.content:first-child > div.newserror:nth-child(5),
        #paragraph > p.ad-tips:last-child, #postcomment3, #fls, #fi, #lns,
        #paragraph > div.tougao-user:nth-child(2), #login-guide-box, .dajia,
        [id^="ad-id-"] {
            display: none !important;
        }
    `;
    document.head.appendChild(style);

    // Function to hide elements based on AdGuard rules
    function hideElements() {
        const selectors = [
            '#nav', '#top', '#tt', '#list > div.fr.fx:last-child', '#side_func',
            '#dt > div.fl.content:first-child > div.cv:first-child', '#dt > div.fr.fx:last-child',
            '#dt > div.fl.content:first-child > div.newsgrade:nth-child(6)',
            '#dt > div.fl.content:first-child > div.shareto:nth-child(7)',
            '#dt > div.fl.content:first-child > iframe.dajia:nth-child(10)',
            '#rm-login-modal > div.modal.has-title.loaded',
            '#dt > div.fl.content:first-child > div.related_post:nth-child(8)',
            '#dt > div.fl.content:first-child > div.newserror:nth-child(5)',
            '#paragraph > p.ad-tips:last-child', '#postcomment3', '#fls', '#fi', '#lns',
            '#paragraph > div.tougao-user:nth-child(2)', '#login-guide-box', '.dajia',
            '[id^="ad-id-"]'
        ];

        selectors.forEach(selector => {
            document.querySelectorAll(selector).forEach(element => {
                element.style.display = 'none';
            });
        });
    }

    // Function to process and set rounded images
    function processImage(image) {
        if (image.classList.contains('ruanmei-emoji') && image.classList.contains('emoji')) return;
        if (image.id === 'image-viewer' || image.classList.contains('zoomed')) return;

        if (image.closest('a.img')) {
            const anchor = image.closest('a.img');
            anchor.style.border = '3px solid #CCC';
            anchor.style.borderRadius = '12px';
            anchor.style.display = 'inline-block';
            anchor.style.overflow = 'hidden';
        } else if (image.closest('.ithome_super_player')) {
            const videoPlayer = image.closest('.ithome_super_player');
            const wrapper = document.createElement('div');
            wrapper.style.border = '3px solid #CCC';
            wrapper.style.borderRadius = '12px';
            wrapper.style.overflow = 'hidden';
            wrapper.style.maxWidth = '400px';
            wrapper.style.display = 'block';
            wrapper.style.margin = '0 auto';
            videoPlayer.parentNode.insertBefore(wrapper, videoPlayer);
            wrapper.appendChild(videoPlayer);
        } else {
            image.style.borderRadius = '12px';
            image.style.border = '3px solid #CCC';
            if (image.width >= 30 && image.height > 150) {
                image.style.display = 'inline';
                image.style.maxWidth = '400px';
                image.style.height = 'auto';
                image.style.objectFit = 'cover';
                image.style.overflow = 'hidden';
            }
        }
    }

    // Function to set rounded images on all img elements
    function setRoundedImages() {
        document.querySelectorAll('img').forEach(image => processImage(image));
    }

    // Function to wrap images in <p> tags
    function wrapImagesInP() {
        if (window.location.href.startsWith('https://www.ithome.com/blog/')) return;
        document.querySelectorAll('img').forEach(image => {
            if (image.classList.contains('ruanmei-emoji') && image.classList.contains('emoji')) return;
            if (image.classList.contains('ithome_super_player')) return;
            if (image.parentNode.tagName.toLowerCase() === 'p' && image.parentNode.children.length === 1) return;
            const p = document.createElement('p');
            p.style.textAlign = 'center';
            p.style.margin = '0';
            p.setAttribute('data-vmark', 'f5e8');
            image.parentNode.insertBefore(p, image);
            p.appendChild(image);
        });
    }

    // Function to set rounded corners for comments
    function setRounded() {
        const roundeds = document.querySelectorAll(
            '.comm_list ul.list li.entry ul.reply, .content .post_content blockquote, ' +
            '.add_comm input#btnComment, .card, span.card'
        );
        roundeds.forEach(rounded => rounded.style.borderRadius = '12px');

        document.querySelectorAll('.add_comm').forEach(addCommElement => {
            addCommElement.style.borderRadius = '0px 0px 12px 12px';
        });

        document.querySelectorAll('.card, span.card').forEach(card => {
            card.style.borderRadius = '12px';
            card.style.transform = 'scale(0.8)';
        });
    }

    // Function to remove specific ads
    function removeAds() {
        document.querySelectorAll('div.bb.clearfix > div.fl > ul.bl > li').forEach(element => {
            if (element.querySelector('div.c > div.m:empty')) element.remove();
        });
    }

    // Automatically click the "Load More" button
    function autoClickLoadMore() {
        const loadMoreButton = document.querySelector('a.more');
        if (loadMoreButton) loadMoreButton.click();
    }

    // Observe DOM changes and apply styles/changes dynamically
    function observeDOM() {
        const observer = new MutationObserver(mutationsList => {
            for (const mutation of mutationsList) {
                if (mutation.type === 'childList') {
                    setRoundedImages();
                    wrapImagesInP();
                    setRounded();
                    removeAds();
                    hideElements();
                }
            }
        });

        observer.observe(document.body, { childList: true, subtree: true });
    }

    // Load all images immediately
    function loadAllImages() {
        if (window.location.href.startsWith('https://www.ithome.com/blog/')) return;
        document.querySelectorAll('img').forEach(image => {
            if (image.hasAttribute('data-src')) {
                image.setAttribute('src', image.getAttribute('data-src'));
                image.removeAttribute('data-src');
            }
            if (image.hasAttribute('data-original')) {
                image.setAttribute('src', image.getAttribute('data-original'));
                image.removeAttribute('data-original');
            }
            if (image.hasAttribute('loading')) {
                image.removeAttribute('loading');
            }
        });
    }

    // Event listeners
    window.addEventListener('scroll', autoClickLoadMore);
    window.addEventListener('load', function() {
        hideElements();
        setRoundedImages();
        wrapImagesInP();
        setRounded();
        removeAds();
        loadAllImages();
        observeDOM();
    });
})();