Tool Army Community Style Fixes

toolarmy-community-style-fixes.user.js

// ==UserScript==
// @name         Tool Army Community Style Fixes
// @namespace    https://gist.github.com/robfrawley
// @version      0.2.7
// @description  A collection of style fixes for the community sections of Tool's website.
// @author       Rob Frawley 2nd <[email protected]>
// @copyright    2023
// @license      https://src.mit-license.com/
// @match        https://www.toolband.com/forums*
// @match        https://www.toolband.com/activities*
// @match        https://www.toolband.com/conversations*
// @grant        GM_addStyle
// @grant        GM_log
// @icon         data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tIEZvbnQgQXdlc29tZSBQcm8gNS4xNS40IGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIC0tPjxkZWZzPjxzdHlsZT4uZmEtc2Vjb25kYXJ5e29wYWNpdHk6LjR9PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTM1MiAyNTZhMjQgMjQgMCAxIDAgMjQgMjQgMjQgMjQgMCAwIDAtMjQtMjR6bS0xOTQuNDggMTZoMzdMMTc2IDIxOC43OHpNNDY0IDY0SDQ4YTQ4IDQ4IDAgMCAwLTQ4IDQ4djI4OGE0OCA0OCAwIDAgMCA0OCA0OGg0MTZhNDggNDggMCAwIDAgNDgtNDhWMTEyYTQ4IDQ4IDAgMCAwLTQ4LTQ4ek0yNTAuNTggMzUyaC0xNi45NGExNiAxNiAwIDAgMS0xNS4xMi0xMC43NUwyMTEuMTUgMzIwaC03MC4yOWwtNy4zOCAyMS4yNUExNiAxNiAwIDAgMSAxMTguMzYgMzUyaC0xNi45NGExNiAxNiAwIDAgMS0xNS4xMi0yMS4yNUwxNDAgMTc2LjEyQTI0IDI0IDAgMCAxIDE2Mi42NyAxNjBoMjYuNjZBMjQgMjQgMCAwIDEgMjEyIDE3Ni4xM2w1My42OSAxNTQuNjJBMTYgMTYgMCAwIDEgMjUwLjU4IDM1MnpNNDI0IDMzNmExNiAxNiAwIDAgMS0xNiAxNmgtMTZhMTUuNzQgMTUuNzQgMCAwIDEtMTItNS42OEE3MiA3MiAwIDEgMSAzNTIgMjA4YTcxLjA1IDcxLjA1IDAgMCAxIDI0IDQuNDJWMTc2YTE2IDE2IDAgMCAxIDE2LTE2aDE2YTE2IDE2IDAgMCAxIDE2IDE2eiIgY2xhc3M9ImZhLXNlY29uZGFyeSIvPjxwYXRoIGQ9Ik0yMTIgMTc2LjEzQTI0IDI0IDAgMCAwIDE4OS4zMyAxNjBoLTI2LjY2QTI0IDI0IDAgMCAwIDE0MCAxNzYuMTJMODYuMyAzMzAuNzVBMTYgMTYgMCAwIDAgMTAxLjQyIDM1MmgxNi45NGExNiAxNiAwIDAgMCAxNS4xMi0xMC43NWw3LjM4LTIxLjI1aDcwLjI5bDcuMzcgMjEuMjVBMTYgMTYgMCAwIDAgMjMzLjY0IDM1MmgxNi45NGExNiAxNiAwIDAgMCAxNS4xMS0yMS4yNXpNMTU3LjUyIDI3MkwxNzYgMjE4Ljc4IDE5NC40OCAyNzJ6TTQwOCAxNjBoLTE2YTE2IDE2IDAgMCAwLTE2IDE2djM2LjQyYTcxLjA1IDcxLjA1IDAgMCAwLTI0LTQuNDIgNzIgNzIgMCAxIDAgMjggMTM4LjMyIDE1Ljc0IDE1Ljc0IDAgMCAwIDEyIDUuNjhoMTZhMTYgMTYgMCAwIDAgMTYtMTZWMTc2YTE2IDE2IDAgMCAwLTE2LTE2em0tNTYgMTQ0YTI0IDI0IDAgMSAxIDI0LTI0IDI0IDI0IDAgMCAxLTI0IDI0eiIgY2xhc3M9ImZhLXByaW1hcnkiLz48L3N2Zz4=
// @supportURL   https://gist.github.com/robfrawley/74ec9d1be237bc5acfff0b57d1849725#new_comment_field
// ==/UserScript==

(function() {
    'use strict';

    const verboseLoggerEnable = false;

    const addStyleSelectorMap = {
        '.fan-wall.activity-panel .fan-wall-post.discussions': [
            'border: 4px solid rgb(0 0 0 / 50%)',
            'border-left: none',
            'border-right: none',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li': [
            'background-color: rgb(0 0 0 / 20%)',
            'border-left: 4px solid rgb(0 0 0 / 25%)',
            'border-right: 4px solid rgb(0 0 0 / 25%)',
            'margin-bottom: 2px',
            'padding: 1em',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li:first-child': [
            'margin-top: 2px',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li:hover, .fan-wall.activity-panel .fan-wall-post.discussions li:focus': [
            'background-color: rgb(0 0 0 / 22.5%)',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li.un-read' : [
            'background-color: rgb(142 104 42 / 50%)',
            'border-left-color: rgb(142 104 42 / 95%)',
            'border-right-color: rgb(142 104 42 / 95%)',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li.un-read:hover, .fan-wall.activity-panel .fan-wall-post.discussions li.un-read:focus': [
            'background-color: rgb(142 104 42 / 55%)',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li .profile-pic' : [
            'margin: 1em 1.5em 1em 0.5em',
            'border: 2px solid rgb(255 255 255 / 80%)',
            'box-shadow: 0 0 0 4px rgb(0 0 0 / 40%)',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li.un-read .profile-pic' : [
            'box-shadow: 0 0 0 4px rgb(39 31 19 / 80%)',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li .content': [
            'border-bottom: none',
            'margin: 0',
            'padding: 1.0em 0 1.0em 0',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li p:first-child': [
            'font-size: 1.2em',
            'margin-bottom: 0.25em',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li.un-read p:first-child' : [
            'font-weight: 500',
        ],
        '.fan-wall.activity-panel .fan-wall-post.discussions li .content .time': [
            'float: none',
            'margin: 0',
            'padding: 0',
        ],
        '.upper-heading .comment-reply-head .vote-btn.notification-view-post': [
            'color: rgb(255 255 255 / 50%)',
        ],
        '.previous-comment-btn span.previous-comment-link': [
            'color: rgb(255 255 255 / 30%)',
        ],
        '.previous-comment-btn span.previous-comment-link:hover,.previous-comment-btn span.previous-comment-link:active ': [
            'color: rgb(255 255 255 / 50%)',
        ],
        '.fb_layout .messages-box textarea, .fb_layout .messages-box #makemojifield': [
            'max-height: none',
        ],
        '.fb_layout .newfeeds-right .add-forum .form-control, .fb_layout .newfeeds-right .add-forum #makemojifield': [
            'height: auto',
        ],
    };

    const toHiddenSelectorSet = [];

    const debugConsoleOut = (text) => {
        if (verboseLoggerEnable) {
            GM_log(text);
        }
    };

    const debounceEvent = (func) => {
        var timer;

        return function(event) {
            if (timer) {
                clearTimeout(timer);
            }

            timer = setTimeout(func, 100, event);
        };
    };

    const joinStyles = (properties, selector) => {
        return properties.map(function (value) {
            return typeof value === 'function' ? value(selector) : value;
        }).filter(function (value) {
            return typeof value === 'string' && value.trim().length > 0;
        }).map(function (value) {
            return value.trim() + ' !important';
        }).join('; ');
    };

    const main = () => {
        debugConsoleOut(`(MAIN) Executing initialization function ...`);

        debugConsoleOut(`(MAIN) Performing element styling operations ...`);

        for (const selector in addStyleSelectorMap) {
            let definition = `${selector} { ${joinStyles(addStyleSelectorMap[selector], selector)}; }`;

            try {
                GM_addStyle(definition);
                debugConsoleOut(`    -> SUCCESS: Created new selector style definitions => [ ${definition} ]`);
            } catch {
                debugConsoleOut(`    -> FAILURE: Created new selector style definitions => [ ${definition} ]`);
            }
        }

        debugConsoleOut(`(MAIN) Performing element hiding operations ...`);

        toHiddenSelectorSet.forEach(function(querySelector) {
            try {
                GM_addStyle(`${querySelector} { display: none !important; }`);
                debugConsoleOut(`    -> SUCCESS: Hid els matching query selector(s) => [ "${querySelector}" ]`);
            } catch {
                debugConsoleOut(`    -> FAILURE: Hid els matching query selector(s) => [ "${querySelector}" ]`);
            }
        });

        debugConsoleOut(`(MAIN) Completed initialization function ...`);
    };

    window.addEventListener('load', function() {
        main();
    }, false);

})();