Kbin Collapsable Comments

Greasy Fork is available in English.
Kbin Collapsable Comments

On the KBin website, support collapsing and expanding comments
当前为 2023-06-11 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         Kbin Collapsable Comments
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  On the KBin website, support collapsing and expanding comments
// @author       CodingAndCoffee
// @match        https://kbin.social/m/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=kbin.social
// @grant        none
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    const COLLAPSE_PARENTS_BY_DEFAULT = true;

    const getNumericId = function (comment) {
        return comment.id.split("-").reverse()[0];
    };

    const getComment = function (numericId) {
        return document.querySelector('#comments blockquote#entry-comment-' + numericId);
    };

    const getChildrenOf = function (numericId) {
        return document.querySelectorAll('#comments blockquote[data-subject-parent-value="' + numericId + '"]');
    }

    const getDescendentsOf = function (numericId) {
        var parent = getComment(numericId);
        var children = getChildrenOf(numericId);

        var descendents = [];
        children.forEach(function (child) {
            descendents.push(child);
            var childDescendents = getDescendentsOf(getNumericId(child));
            childDescendents.forEach (function (cd) {
                descendents.push(cd);
            });
        });
        return descendents;
    };

    window.toggleChildren = function (numericId) {
        var parent = getComment(numericId);

        // get visibility status
        var childrenVisible = (
            parent.dataset['childrenVisible'] === 'true' ||
            typeof(parent.dataset['childrenVisible']) === 'undefined'
        ) ? true : false;
        var toggledStatus = !childrenVisible;

        // toggle visibility of the descendents
        var descendents = getDescendentsOf(numericId);
        descendents.forEach(function(c) {
            c.style.display = (toggledStatus ? 'grid' : 'none');
        });

        // update dataset
        parent.setAttribute('data-children-visible', toggledStatus);

        // update the link text
        var children = getChildrenOf(numericId);
        if (children.length > 0) {
            var link = document.querySelector('#comment-'+numericId+'-collapse-link');
            if (link) {
                link.innerHTML = (toggledStatus ? '[- collapse ' + children.length + ']' : '[+ show ' + children.length + ']');
            }
        }
    };

    const comments = document.querySelectorAll('#comments blockquote.comment');
    comments.forEach(function (comment) {
        var numericId = getNumericId(comment);

        const children = getChildrenOf(numericId);
        if (children.length > 0) {
            var header = comment.querySelector('header');
            var span = document.createElement('span');
            var spanSpacer = document.createTextNode(' | ');
            span.append(spanSpacer);
            header.appendChild(span);

            var a = document.createElement('a');
            a.id = 'comment-'+numericId+'-collapse-link';
            var link = document.createTextNode('[- collapse ' + children.length + ']');
            a.appendChild(link);
            a.href = 'javascript:window.toggleChildren('+numericId+')';
            span.appendChild(a);
        }
    });

    if (COLLAPSE_PARENTS_BY_DEFAULT) {
        comments.forEach(function (comment) {
            var numericId = getNumericId(comment);

            var isTopLevel = (typeof comment.dataset['subject-parent-value'] !== 'string');
            if (isTopLevel) {
                window.toggleChildren(numericId);
            }
        });
    }
})();