Greasy Fork

Kbin Description Expander

Expand the description on posts

目前为 2023-06-16 提交的版本。查看 最新版本

// ==UserScript==
// @name        Kbin Description Expander
// @match       https://kbin.social/*
// @match       https://fedia.io/*
// @match       https://karab.in/*
// @grant       GM_xmlhttpRequest
// @run-at      document-end
// @description Expand the description on posts
// @version     1.0
// @namespace https://greasyfork.org/users/1096641
// ==/UserScript==


function fetchFullContent(url, callback) {
    GM_xmlhttpRequest({
        method: "GET",
        url: url,
        onload: function(response) {
            let parser = new DOMParser();
            let doc = parser.parseFromString(response.responseText, "text/html");
            let fullContent = '';
            let pTags = doc.querySelectorAll('.entry__body .content p');
            for(let p of pTags) {
                fullContent += p.outerHTML;
            }
            callback(fullContent);
        }
    });
}

function expandDescription(event) {
    let descElement = event.currentTarget;
    let postElement = descElement.closest('article');
    let commentLink = postElement.querySelector('[href$="#comments"]').href;

    // If full content is already displayed, revert to the original description
    if (descElement.dataset.fullContent === 'true') {
        descElement.innerHTML = descElement.dataset.originalDesc;
        descElement.dataset.fullContent = 'false';
    } else {
        // Store the original description
        descElement.dataset.originalDesc = descElement.innerHTML;

        fetchFullContent(commentLink, function(fullContent) {
            descElement.innerHTML = fullContent;
            descElement.dataset.fullContent = 'true';
        });
    }
}

function applyToNewPosts() {
    let descriptions = document.querySelectorAll('article .content.short-desc:not(.expanded-description)');
    for (let desc of descriptions) {
        desc.classList.add('expanded-description');
        desc.style.cursor = 'pointer';
        desc.addEventListener('click', expandDescription);
    }
}

window.addEventListener('DOMContentLoaded', (event) => {
    applyToNewPosts();

    // Observe for new posts
    let observer = new MutationObserver(applyToNewPosts);
    observer.observe(document.body, { childList: true, subtree: true });
});