☰

Greasy Fork is available in English.

Autohides playerlist on bullseye and add toggle icon to show it.

Click eye to show/hide bullseye playerlist(auto hidden by default)

  1. // ==UserScript==
  2. // @name         Autohides playerlist on bullseye and add toggle icon to show it.
  3. // @version      v0.3
  4. // @description  Click eye to show/hide bullseye playerlist(auto hidden by default)
  5. // @author       trausi
  6. // @match        https://www.geoguessr.com/*
  7. // @icon         https://www.google.com/s2/favicons?sz=64&domain=geoguessr.com
  8. // @license      none
  9. // @grant        GM_xmlhttpRequest
  10. // @namespace https://greasyfork.org/users/1452061
  11. // ==/UserScript==
  12.  
  13. const autohidden = true;
  14. let sentinel = false;
  15.  
  16. const targetClass = ".slanted-wrapper_root__XmLse";
  17. const playerlistClass = ".game-panorama_playerList__tITUA";
  18.  
  19. async function main() {
  20.   if (sentinel) {
  21.     return;
  22.   }
  23.   sentinel = true
  24.  
  25.   const toggleBtn = document.createElement('button');
  26.   toggleBtn.textContent = '👁'; // tiny eye emoji or you can use "≡" or "P"
  27.   toggleBtn.title = 'Toggle Player List';
  28.  
  29.  
  30.   Object.assign(toggleBtn.style, {
  31.     position: 'absolute',
  32.     top: '6px',
  33.     right: '6px',
  34.     padding: '2px 6px',
  35.     fontSize: '12px',
  36.     border: 'none',
  37.     borderRadius: '4px',
  38.     background: '#5b3b9d',
  39.     color: '#fff',
  40.     cursor: 'pointer',
  41.     zIndex: 9999,
  42.     opacity: 0.8
  43.   });
  44.  
  45.   toggleBtn.addEventListener('mouseenter', () => {
  46.     toggleBtn.style.opacity = 1;
  47.   });
  48.   toggleBtn.addEventListener('mouseleave', () => {
  49.     toggleBtn.style.opacity = 0.8;
  50.   });
  51.  
  52.   toggleBtn.addEventListener('click', () => {
  53.     const playerList = document.querySelector(playerlistClass);
  54.     if (playerList) {
  55.       playerList.style.display = (playerList.style.display === 'none') ? '' : 'none';
  56.     }
  57.   });
  58.  
  59.   const targetDiv = document.querySelector(targetClass);
  60.   if (targetDiv) {
  61.     targetDiv.prepend(toggleBtn);
  62.   }
  63.   if (autohidden) {
  64.     const playerList = document.querySelector(playerlistClass);
  65.     if (playerList) {
  66.       playerList.style.display = (playerList.style.display === 'none') ? '' : 'none';
  67.     }
  68.   }
  69.   console.log("He1111re");
  70. }
  71.  
  72.  
  73.  
  74. new MutationObserver((mutations) => {
  75.  
  76.   if (!document.querySelector(playerlistClass)) {
  77.     sentinel = false;
  78.     return;
  79.   }
  80.   main();
  81. }).observe(document.body, { subtree: true, childList: true });