☰

Hide Passworded Rooms Feature

Allows you to hide passworded rooms (Because theres too many :>)

  1. // ==UserScript==
  2. // @name         Hide Passworded Rooms Feature
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.0.1
  5. // @description  Allows you to hide passworded rooms (Because theres too many :>)
  6. // @match        https://heav.io/game.html
  7. // @match        https://hitbox.io/game.html
  8. // @match        https://heav.io/game2.html
  9. // @match        https://hitbox.io/game2.html
  10. // @match        https://hitbox.io/game-beta.html
  11. // @icon         https://www.google.com/s2/favicons?sz=64&domain=heav.io
  12. // @icon         https://www.google.com/s2/favicons?sz=64&domain=hitbox.io
  13. // @grant        none
  14. // @license      MIT
  15. // ==/UserScript==
  16.  
  17. (function() {
  18.     'use strict';
  19.  
  20.      const targetImage = 'graphics/ui/hitbox.svg';
  21.     const newImageSrc = 'https://i.ibb.co/F5RLpmx/hitbox-1.png';
  22.  
  23.     const images = document.querySelectorAll(`img[src="${targetImage}"]`);
  24.  
  25.     images.forEach(img => {
  26.         const overlayImage = document.createElement('img');
  27.         overlayImage.src = newImageSrc;
  28.         overlayImage.style.position = 'absolute';
  29.         overlayImage.style.left = img.offsetLeft + 'px';
  30.         overlayImage.style.top = img.offsetTop + 'px';
  31.         overlayImage.style.width = img.width + 'px';
  32.         overlayImage.style.height = img.height + 'px';
  33.         overlayImage.style.pointerEvents = 'none';
  34.         img.parentNode.appendChild(overlayImage);
  35.     });
  36.  
  37.     let checkbox, label, isChecked = false;
  38.  
  39.     function hideLockedRooms() {
  40.         const roomRows = document.querySelectorAll('.roomList .scrollBox tr');
  41.         roomRows.forEach(row => {
  42.             const lockIcon = row.querySelector('img[src="graphics/ui/lock-outline-roomlist-2.svg"]');
  43.             if (lockIcon) {
  44.                 row.style.display = 'none';
  45.             }
  46.         });
  47.     }
  48.  
  49.     function showAllRooms() {
  50.         const roomRows = document.querySelectorAll('.roomList .scrollBox tr');
  51.         roomRows.forEach(row => {
  52.             row.style.display = '';
  53.         });
  54.     }
  55.  
  56.     function toggleCheckbox() {
  57.         isChecked = checkbox.checked;
  58.         if (isChecked) {
  59.             hideLockedRooms();
  60.         } else {
  61.             showAllRooms();
  62.         }
  63.     }
  64.  
  65.     function createCheckbox() {
  66.         const topBar = document.querySelector('.roomList .topBar');
  67.         topBar.textContent = '';
  68.  
  69.         const container = document.createElement('div');
  70.         container.style.display = 'inline-flex';
  71.         container.style.alignItems = 'center';
  72.  
  73.         checkbox = document.createElement('input');
  74.         checkbox.type = 'checkbox';
  75.         checkbox.id = 'hideLockedRooms';
  76.         checkbox.className = 'custom-checkbox';
  77.         checkbox.addEventListener('change', toggleCheckbox);
  78.  
  79.         label = document.createElement('label');
  80.         label.htmlFor = 'hideLockedRooms';
  81.         label.innerText = 'Hide Passworded';
  82.         label.style.color = '#fff';
  83.         label.style.cursor = 'pointer';
  84.         label.style.marginLeft = '3px';
  85.  
  86.         container.appendChild(checkbox);
  87.         container.appendChild(label);
  88.         topBar.appendChild(container);
  89.  
  90.         const style = document.createElement('style');
  91.         style.innerHTML = `
  92.             .custom-checkbox {
  93.                 width: 20px;
  94.                 height: 20px;
  95.                 background: #303030;
  96.                 border: 1px solid #222222;
  97.                 cursor: pointer;
  98.                 position: relative;
  99.                 appearance: none;
  100.                 display: inline-block;
  101.                 outline: none;
  102.             }
  103.  
  104.             .custom-checkbox:checked {
  105.                 background-image: url('graphics/ui/check-light.svg');
  106.                 background-size: contain;
  107.                 background-repeat: no-repeat;
  108.             }
  109.  
  110.             .custom-checkbox:focus {
  111.                 outline: none;
  112.             }
  113.         `;
  114.         document.head.appendChild(style);
  115.     }
  116.  
  117.     function checkRoomListVisibility() {
  118.         const roomList = document.querySelector('.roomList');
  119.         if (roomList) {
  120.             const isRoomListVisible = window.getComputedStyle(roomList).display !== 'none' && roomList.style.opacity === '1';
  121.             if (!isRoomListVisible) {
  122.                 showAllRooms();
  123.                 checkbox.checked = false;
  124.             } else if (isChecked) {
  125.                 hideLockedRooms();
  126.             }
  127.         }
  128.     }
  129.  
  130.     setInterval(function() {
  131.         if (!document.querySelector('#hideLockedRooms')) {
  132.             createCheckbox();
  133.         }
  134.         checkRoomListVisibility();
  135.     }, 1);
  136. })();