Greasy Fork is available in English.

Drawaria Hide All Players Button!

Adds a "Hide All Players" button that hides and shows all players.

Fra og med 01.06.2024. Se den nyeste version.

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 or Violentmonkey 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         Drawaria Hide All Players Button!
// @namespace    http://tampermonkey.net/
// @version      1.01
// @description  Adds a "Hide All Players" button that hides and shows all players.
// @match        https://drawaria.online/*
// @author       YouTubeDrawaria
// @icon         https://www.google.com/s2/favicons?sz=64&domain=drawaria.online
// @license      MIT
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Translation map
    const translations = {
        'en': {
            'hide': 'Hide All Players',
            'show': 'Show All Players'
        },
        'ru': {
            'hide': 'Скрыть всех игроков',
            'show': 'Показать всех игроков'
        },
        'es': {
            'hide': 'Ocultar todos los jugadores',
            'show': 'Mostrar todos los jugadores'
        }
        // Add more translations as needed
    };

    // Function to get the current language
    function getCurrentLanguage() {
        const langSelector = document.querySelector('#langselector');
        return langSelector ? langSelector.value : 'en';
    }

    // Function to translate the button text
    function translateButtonText(button, language) {
        const translationsForLanguage = translations[language];
        if (translationsForLanguage) {
            button.textContent = playersHidden ? translationsForLanguage.show : translationsForLanguage.hide;
        }
    }

    // Function to hide or show all players and restore their original positions
    function togglePlayersVisibility(hide) {
        var playerListRows = Array.from(document.querySelectorAll('.playerlist-row'));
        if (hide) {
            // Hide all players and store their original positions
            playerListRows.forEach(function(row) {
                row.dataset.originalStyle = row.style.cssText; // Store original styles
                row.style.display = 'none';
            });
        } else {
            // Show all players and restore their original positions
            playerListRows.sort(function(a, b) {
                var nameA = a.querySelector('.playerlist-name a').textContent.toUpperCase();
                var nameB = b.querySelector('.playerlist-name a').textContent.toUpperCase();
                if (nameA < nameB) {
                    return -1;
                }
                if (nameA > nameB) {
                    return 1;
                }
                return 0;
            });
            playerListRows.forEach(function(row) {
                row.style.cssText = row.dataset.originalStyle; // Restore original styles
                row.style.display = 'table-row';
            });
        }
    }

    // Add the "Hide All Players" button below the existing button
    var existingButton = document.querySelector('#roomcontrols-menu');
    if (existingButton) {
        // Create the "Hide All Players" button
        var hideAllButton = document.createElement('button');
        hideAllButton.className = 'btn btn-outline-secondary btn-sm';
        hideAllButton.style.padding = '1px 10px';
        hideAllButton.id = 'hide-all-players-button';

        // Variable to control the visibility state
        var playersHidden = false;

        // Function to update the button text and functionality
        function updateButton() {
            const currentLanguage = getCurrentLanguage();
            translateButtonText(hideAllButton, currentLanguage);
            hideAllButton.addEventListener('click', function() {
                playersHidden = !playersHidden;
                togglePlayersVisibility(playersHidden);
                translateButtonText(hideAllButton, currentLanguage);
            });
        }

        // Initial update of the button text and functionality
        updateButton();

        // Insert the "Hide All Players" button after the existing button
        existingButton.parentNode.insertBefore(hideAllButton, existingButton.nextSibling);
    }

    // Event listener for language change
    document.querySelector('#langselector').addEventListener('change', updateButton);

      // Style the player rows to display the ID
    var playerListRows = Array.from(document.querySelectorAll('.playerlist-row'));
    playerListRows.forEach(function(row) {
        var playerId = row.getAttribute('data-playerid');
        row.style.position = 'relative'; // Ensure the position is relative to place the ID label
        row.insertAdjacentHTML('beforeend', `<span class="player-id-label">${playerId}</span>`);
    });

    // CSS to style the player ID label
    var css = document.createElement('style');
    css.type = 'text/css';
    css.innerHTML = `
        .player-id-label {
            position: absolute;
            top: 0;
            right: 0;
            background-color: rgba(0, 0, 0, 0.5);
            color: white;
            padding: 2px 4px;
            font-size: 0.8em;
            border-radius: 4px;
        }
    `;
    document.head.appendChild(css);
})();