☰

Chat Improvements

Simple chat quality improvements

  1. // ==UserScript==
  2. // @name         Chat Improvements
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.1.2
  5. // @license      GPL-3.0
  6. // @description  Simple chat quality improvements
  7. // @author       kamarov
  8. // @match        https://tanktrouble.com/*
  9. // @run-at       document-end
  10. // @grant        GM_addStyle
  11. // @require      https://update.greasyfork.org/scripts/482092/1297984/TankTrouble%20Development%20Library.js
  12. // ==/UserScript==
  13.  
  14. GM_addStyle(`
  15. @keyframes disappear {
  16.   0% {
  17.     opacity: 1;
  18.   }
  19.   100% {
  20.     opacity: 0;
  21.   }
  22. }
  23. @keyframes appear {
  24.   0% {
  25.     opacity: 0;
  26.   }
  27.   100% {
  28.     opacity: 1;
  29.   }
  30. }
  31. .clearChat-button {
  32.     cursor: pointer;
  33.     position: absolute;
  34.     top: 40px;
  35.     right: -15px;
  36.     background: none;
  37.     box-shadow: none;
  38. }
  39. .muteGlobalChat-button {
  40.     cursor: pointer;
  41.     position: absolute;
  42.     top: 70px;
  43.     right: -15px;
  44.     background: none;
  45.     box-shadow: none;
  46. }
  47. .commands-button {
  48.     cursor: pointer;
  49.     position: absolute;
  50.     top: 100px;
  51.     right: -15px;
  52.     background: none;
  53.     box-shadow: none;
  54. }
  55. .plus-button {
  56.     cursor: pointer;
  57.     position: absolute;
  58.     top: 160px;
  59.     left: 267px;
  60. }
  61. .minus-button {
  62.     cursor: pointer;
  63.     position: absolute;
  64.     top: 177px;
  65.     left: 267px;
  66. }
  67. #chat:not(.open) .clearChat-button,
  68. #chat:not(.open) .muteGlobalChat-button,
  69. #chat:not(.open) .commands-button,
  70. #chat:not(.open) .plus-Button,
  71. #chat:not(.open) .minus-Button {
  72.     animation: disappear 0.3s cubic-bezier(0.79, 0.02, 0.32, 0.98) forwards;
  73. }
  74. #chat:is(.opening, .open) .clearChat-button,
  75. #chat:is(.opening, .open) .muteGlobalChat-button,
  76. #chat:is(.opening, .open) .commands-button,
  77. #chat:is(.opening, .open) .plus-Button,
  78. #chat:is(.opening, .open) .minus-Button {
  79.     animation: appear 0.3s cubic-bezier(0.79, -0.02, 0.32, 0.98) forwards;
  80. }
  81.  
  82. `);
  83.  
  84. (function() {
  85.     whenContentInitialized().then(() => {
  86.         const container = document.querySelector('#chat');
  87.         if (!container) return;
  88.  
  89.         const clearButton = createButton('clearChat-button', 'https://i.imgur.com/f0bzcXU.png', 'Clear Chat');
  90.         const muteButton = createButton('muteGlobalChat-button', 'https://i.imgur.com/yJR2Mma.png', 'Mute Global Chat');
  91.         const ignoreButton = createButton('commands-button', 'https://i.imgur.com/PA2XOf0.png', 'Commands');
  92.  
  93.         //const plusButton = createButton('plus-button', 'https://i.imgur.com/G9so5yS.png', '+');
  94.         //const minusButton = createButton('minus-button', 'https://i.imgur.com/AJ9FuAn.png', '-');
  95.  
  96.         // Append buttons to the container
  97.         container.appendChild(clearButton);
  98.         container.appendChild(muteButton);
  99.         container.appendChild(ignoreButton);
  100.  
  101.  
  102.         // Add event listeners for each button
  103.         clearButton.addEventListener('click', clearChat);
  104.         muteButton.addEventListener('click', toggleMuteGlobalChat);
  105.         ignoreButton.addEventListener('click', showCommands);
  106.  
  107.         // Mute chat state variable
  108.         let isGlobalMuted = false;
  109.  
  110.         // Function to create button elements dynamically
  111.         function createButton(className, imageUrl, altText) {
  112.             const button = document.createElement('div');
  113.             button.classList.add(className);
  114.             const img = document.createElement('img');
  115.             img.src = imageUrl;
  116.             img.alt = altText;
  117.             img.style.width = '30px';
  118.             img.style.height = '28px';
  119.             button.appendChild(img);
  120.             return button;
  121.         }
  122.  
  123.         // Function to mute global chat
  124.         function toggleMuteGlobalChat() {
  125.             const globalMuteElement = document.getElementById("globalMuteSupport");
  126.  
  127.             if (isGlobalMuted) {
  128.                 if (globalMuteElement) {
  129.                     globalMuteElement.innerHTML = "";
  130.                     globalMuteElement.remove();
  131.                 }
  132.                 const globalMuteSupport = document.createElement("script");
  133.                 globalMuteSupport.innerHTML = `
  134.                     TankTrouble.ChatBox.addGlobalChatMessage=function(from,message,chatMessageId){
  135.                         var playerIds=from;
  136.                         this._lookUpUsernamesAndAddChatMessage(from,null,false,"#68c5ff","#333333",message,chatMessageId);
  137.                     };
  138.                     TankTrouble.ChatBox.addSystemMessage(0, "Global chat unmuted");
  139.                 `;
  140.                 globalMuteSupport.id = "globalMuteSupport";
  141.                 document.head.appendChild(globalMuteSupport);
  142.                 isGlobalMuted = false;
  143.             } else {
  144.                 if (globalMuteElement) {
  145.                     globalMuteElement.innerHTML = "";
  146.                     globalMuteElement.remove();
  147.                 }
  148.                 const globalMuteSupport = document.createElement("script");
  149.                 globalMuteSupport.innerHTML = `
  150.                     TankTrouble.ChatBox.addGlobalChatMessage=function(from,message,chatMessageId){
  151.                         console.log(String(from)+": "+message);
  152.                     };
  153.                     TankTrouble.ChatBox.addSystemMessage(0, "Global chat muted");
  154.                 `;
  155.                 globalMuteSupport.id = "globalMuteSupport";
  156.                 document.head.appendChild(globalMuteSupport);
  157.                 isGlobalMuted = true;
  158.             }
  159.  
  160.             // Toggle mute button icon
  161.             const muteImg = muteButton.querySelector('img');
  162.             if (muteImg.src === 'https://i.imgur.com/yJR2Mma.png') {
  163.                 muteImg.src = 'https://i.imgur.com/pIVI6lx.png';
  164.             } else {
  165.                 muteImg.src = 'https://i.imgur.com/yJR2Mma.png';
  166.             }
  167.         }
  168.  
  169.         // Function to show existing commands
  170.         function showCommands() {
  171.             TankTrouble.ChatBox.addSystemMessage(0, " /u - Undo ignore command");
  172.             TankTrouble.ChatBox.addSystemMessage(0, " /i - Ignore command");
  173.             TankTrouble.ChatBox.addSystemMessage(0, "Commands:");
  174.         }
  175.  
  176.         // Function to clear chat
  177.         function clearChat() {
  178.             const chatMessages = document.querySelectorAll('.chatMessage');
  179.             chatMessages.forEach((message) => {
  180.                 message.style.transition = 'opacity 0.1s';
  181.                 message.style.opacity = '0';
  182.                 setTimeout(() => {
  183.                     message.remove();
  184.                 }, 300);
  185.             });
  186.             TankTrouble.ChatBox.addSystemMessage(0, "Chat cleared");
  187.         }
  188.  
  189.         // Update button visibility based on chat state
  190.         const chatElement = document.querySelector('#chat');
  191.         updateButtonVisibility();
  192.  
  193.         setInterval(() => {
  194.             updateButtonVisibility();
  195.         }, 600);
  196.  
  197.         function updateButtonVisibility() {
  198.             if (chatElement.classList.contains('open')) {
  199.                 clearButton.style.display = 'block';
  200.                 muteButton.style.display = 'block';
  201.                 ignoreButton.style.display = 'block';
  202.             } else {
  203.                 clearButton.style.display = 'none';
  204.                 muteButton.style.display = 'none';
  205.                 ignoreButton.style.display = 'none';
  206.             }
  207.         }
  208.     });
  209. })();