Watch2Gether_Band_aid.user.js

// ==UserScript==
// @name         Watch2Gether Band-aid
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Adds some attributes to make writing custom CSS themes easier
// @author       [email protected]
// @match        https://www.watch2gether.com/rooms/*
// @downloadURL  https://gist.githubusercontent.com/yutsuku/1f13e94744ae1e9b648d36a6efee64b4/raw/772a91678554dec2cffda9aa477ac3fae7fdefe8/Watch2Gether_Band_aid.user.js
// @updateURL    https://gist.githubusercontent.com/yutsuku/1f13e94744ae1e9b648d36a6efee64b4/raw/772a91678554dec2cffda9aa477ac3fae7fdefe8/Watch2Gether_Band_aid.user.js
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const elements = {
        userlist: {
            main: document.querySelector('#userbar'),
            button: document.querySelector('#userbar .w2g-panel-menu'),
            isHidden: function() {
                return this.main.classList.contains('w2g-panel-hidden');
            },
        },
        panel: document.querySelector('.w2g-main-right')
    };

    function toggleFullscreen(state) {
        if (state) {
            document.body.classList.add('fullscreen');
        } else {
            document.body.classList.remove('fullscreen');
        }
    }

    // watch userlist for hide/show changes
    const mutationObserver = new MutationObserver(function() {
        toggleFullscreen(elements.userlist.isHidden());
    });
    mutationObserver.observe(elements.userlist.main, {
        attributeFilter: ['class'],
        attributes: true,
    });

})();