Reference »

Lesser Wrong Comments Collapse

NOTE: This doesn’t work fully.

  1. It only works if you go right to a post (or reload one); it doesn’t work if you start elsewhere on the site, and then click to a post.
  2. Something’s removing the ‘hide’ links from nested (i.e., not-top-level) comments.

// ==UserScript==
// @name         LesserWrong Collapse Comments
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        *://www.lesserwrong.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    var css = document.createElement("style");
    css.type = "text/css";
    css.innerHTML = ".comments-node { position: relative; } \n";
    css.innerHTML += "input[type=checkbox].comments-collapse-checkbox { position: absolute; top: 4px; right: 30px; z-index: 2; } \n";
    css.innerHTML += ".comments-collapse-checkbox, .comments-collapse-checkbox:checked { display: none; } \n";
    css.innerHTML += ".comments-collapse-checkbox + label { position: absolute; top: 5px; right: 30px; z-index: 2; } \n";
    css.innerHTML += ".comments-collapse-checkbox + label::before { content: 'hide'; } \n";
    css.innerHTML += ".comments-collapse-checkbox:checked + label::before { content: 'show'; } \n";
    css.innerHTML += ".comments-collapse-checkbox:checked ~ .comments-item > .comments-item-body > div:nth-of-type(n+2), .comments-collapse-checkbox:checked ~ .comments-children { display: none; } \n";
    document.body.appendChild(css);

    document.querySelectorAll(".comments-node").forEach(function(element) {
        var element_id = element.getAttribute("data-reactid");
        element.innerHTML = '<input type="checkbox" class="comments-collapse-checkbox" id="comments-collapse-checkbox-' + element_id + '" /> <label for="comments-collapse-checkbox-' + element_id + '"></label>' + element.innerHTML;
    });

    var commentsCollapseState = JSON.parse(document.cookie.replace(/(?:(?:^|.*;\s*)comments-collapse-state\s*\=\s*([^;]*).*$)|^.*$/, "$1"));
    document.querySelectorAll(".comments-collapse-checkbox").forEach(function(checkbox) {
        checkbox.checked = (commentsCollapseState[checkbox.getAttribute("id")] == '1');
        checkbox.addEventListener( 'change', function() {
            commentsCollapseState = JSON.parse(document.cookie.replace(/(?:(?:^|.*;\s*)comments-collapse-state\s*\=\s*([^;]*).*$)|^.*$/, "$1"));
            if(this.checked) {
                commentsCollapseState[checkbox.getAttribute("id")] = '1';
            } else {
                commentsCollapseState[checkbox.getAttribute("id")] = '0';
            }
            document.cookie = 'comments-collapse-state=' + JSON.stringify(commentsCollapseState) + '; expires=Fri, 3 Aug 2031 20:47:11 UTC; path=/';
        });
    });
})();