IThome Pro

优化ithome网页端浏览效果

Versão de: 19/08/2024. Veja: a última versão.

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==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();
    });
})();