Spaceous Mastodon Helper

companion script for spaceous mastodon userstyle

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         Spaceous Mastodon Helper
// @namespace    github.com/RiedleroD/userstyles-riedler
// @version      1.2.1
// @description  companion script for spaceous mastodon userstyle
// @author       Riedler
// @match        https://mas.to/*
// @match        https://fosstodon.org/*
// @match        https://mastodon.social/*
// @icon         https://mas.to/favicon.ico
// @grant        none
// @run-at       document-idle
// ==/UserScript==

(function() {
    'use strict';

    console.log("me alive");

    function checkSideBar(post){
        let content = post.getElementsByClassName('status__content')[0];
        //get minimum height by getting 15em in px
        let divisor = 12*parseFloat(getComputedStyle(post).fontSize);
        let actionbar = post.getElementsByClassName('status__action-bar')[0];
        if(content.clientHeight>=divisor){
            actionbar.classList.add('sm__force_sidebar');
        }else{
            //if we previously added it and it changed in the meantime
            actionbar.classList.remove('sm__force_sidebar');
        }
    }
    function isPost(element){
        return element.classList!=undefined && element.classList.contains('status');
    }

    const target = document.getElementById('mastodon');
    const obconf = { attributes: false, childList: true, subtree: true };

    const callback = (mutationList, observer) => {
        for(const mutation of mutationList){
            for(let node of mutation.addedNodes){
                if(isPost(node)){
                    checkSideBar(node);
                }else{
                    //checking parents for posts
                    do{
                        node=node.parentNode;
                        if(isPost(node)){
                            checkSideBar(node);
                            return;
                        }
                    }while(node.parentNode!=undefined);
                    //checking children for posts
                    for(const e of node.getElementsByClassName('status')){
                        checkSideBar(e);
                    }
                }
            }
        }
    };

    const observer = new MutationObserver(callback);
    observer.observe(target, obconf);
})();