☰

Discord Hide Channel List Button

Hides the channel list at the press of a button

As of 2018-08-18. See the latest version.

// ==UserScript==
// @name         Discord Hide Channel List Button
// @namespace    http://tampermonkey.net/
// @version      0.5
// @description  Hides the channel list at the press of a button
// @author       20kdc
// @match        https://discordapp.com/*
// @grant        none
// ==/UserScript==

// I release this user-script into the public domain.

// Since iterating through the entire DOM would be performance suicide,
//  let's try to detect classes in ANY OTHER WAY.
var dragonequus;
dragonequus = {
    version: 1,
    getAllClassesLen: 0,
    getAllClassesCache: [],
    getAllClasses: function () {
        var sheets = document.styleSheets;
        if (sheets.length == dragonequus.getAllClassesLen) {
            return dragonequus.getAllClassesCache;
        }
        var workspace = [];
        var seen = {};
        for (var k = 0; k < sheets.length; k++) {
            var sheet = sheets[k];
            for (var k2 = 0; k2 < sheet.cssRules.length; k2++) {
                var rule = sheet.cssRules[k2];
                if (rule.type == CSSRule.STYLE_RULE) {
                    // .A:I .B:I, .A .B
                    var majors = rule.selectorText.split(",");
                    for (var k3 = 0; k3 < majors.length; k3++) {
                        var minors = majors[k3].split(" ");
                        for (var k4 = 0; k4 < minors.length; k4++) {
                            // Minor starts off as say .A:B
                            var minor = minors[k4];
                            // Must be class
                            if (!minor.startsWith("."))
                                continue;
                            // Cut off any : and remove .
                            var selectorBreak = minor.indexOf(":");
                            if (selectorBreak != -1) {
                                minor = minor.substring(1, selectorBreak);
                            } else {
                                minor = minor.substring(1);
                            }
                            if (seen[minor])
                                continue;
                            seen[minor] = true;
                            workspace.push(minor);
                        }
                    }
                }
            }
        }
        dragonequus.getAllClassesLen = sheets.length;
        dragonequus.getAllClassesCache = workspace;
        return workspace;
    },
    findByDiscordClass: function (name) {
        var classes = dragonequus.getAllClasses();
        for (var k in classes) {
            var n = classes[k];
            if (n.startsWith(name + "-")) {
                var q = document.querySelector("." + n);
                if (q)
                    return q;
            }
        }
        return null;
    }
};

var mainFunc;
var lastTryParent;
mainFunc = function() {
    'use strict';
    // Toolbar instance tends to change
    setTimeout(mainFunc, 5000);
    const vChat = dragonequus.findByDiscordClass("chat");
    if (!vChat)
        return;
    const v = vChat.firstChild.firstChild.lastChild;
    if (lastTryParent == v)
        return;
    lastTryParent = v;
    const d = document.createElement("img");
    d.draggable = false;
    d.src = "/assets/a860a4e9c04e5cc2c8c48ebf51f7ed46.svg";
    // Unscalable, but Discord does it too
    d.width = 24;
    d.height = 24;
    v.appendChild(d);
    
    var toggleState = true;
    d.addEventListener("click", () => {
        const v2a = dragonequus.findByDiscordClass("chat");
        if (!v2a)
            return;
        const v2 = v2a.parentNode.firstChild;
        toggleState = !toggleState;
        if (toggleState) {
            d.class = "active";
            v2.style.display = "inherit";
        } else {
            d.class = "";
            v2.style.display = "none";
        }
    });
};
mainFunc();