您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Adds some QoL features, such as always showing kill count, green health bar, etc
// ==UserScript== // @name Blubbled's UI Mod v1.3 // @namespace http://tampermonkey.net/ // @version 1.3 // @description Adds some QoL features, such as always showing kill count, green health bar, etc // @author Blubbled // @match https://suroi.io/* // @grant none // ==/UserScript== (function() { 'use strict'; function periodicallyShowKillCounter() { showKillCounter(); setTimeout(periodicallyShowKillCounter, 200); } function showKillCounter() { var killCounter = document.getElementById('kill-counter'); if (killCounter) { killCounter.style.display = 'flex'; killCounter.style.alignItems = 'center'; var skullIcon = killCounter.querySelector('img'); if (skullIcon) { skullIcon.style.marginRight = '5px'; } var counterText = killCounter.querySelector('.counter-text'); if (counterText) { counterText.style.minWidth = '30px'; } } } function addAdditionalUI() { var additionalText = document.createElement('h1'); additionalText.textContent = "Technical UI pack by Blubbled "; var joinLink = document.createElement('a'); joinLink.textContent = "[JOIN ZESK]"; joinLink.href = "https://discord.gg/msNbP9Nt2r"; joinLink.style.color = 'blue'; joinLink.style.textDecoration = 'underline'; joinLink.style.marginLeft = '5px'; additionalText.appendChild(joinLink); additionalText.style.position = 'fixed'; additionalText.style.top = '10px'; additionalText.style.right = '10px'; additionalText.style.color = '#ffffff'; additionalText.style.zIndex = '9999'; additionalText.style.display = 'none'; document.body.appendChild(additionalText); var masterVolumeSlider = document.getElementById('slider-master-volume'); var sfxVolumeSlider = document.getElementById('slider-sfx-volume'); var musicVolumeSlider = document.getElementById('slider-music-volume'); var uiScaleSlider = document.getElementById('slider-ui-scale'); var minimapTransparencySlider = document.getElementById('slider-minimap-transparency'); var bigMapTransparencySlider = document.getElementById('slider-big-map-transparency'); if (masterVolumeSlider && sfxVolumeSlider && musicVolumeSlider && uiScaleSlider && minimapTransparencySlider && bigMapTransparencySlider) { masterVolumeSlider.step = 0.01; sfxVolumeSlider.step = 0.01; musicVolumeSlider.step = 0.01; uiScaleSlider.step = 0.01; minimapTransparencySlider.step = 0.01; bigMapTransparencySlider.step = 0.01; } } function replaceWithHeader() { var customHeader = document.createElement('h1'); customHeader.textContent = "Technical UI pack by Blubbled "; var joinLink = document.createElement('a'); joinLink.textContent = "[JOIN ZESK]"; joinLink.href = "https://discord.gg/msNbP9Nt2r"; joinLink.style.color = 'blue'; joinLink.style.textDecoration = 'underline'; joinLink.style.marginLeft = '5px'; // Adjust spacing as needed customHeader.appendChild(joinLink); customHeader.style.position = 'fixed'; customHeader.style.top = '10px'; customHeader.style.right = '10px'; customHeader.style.color = '#ffffff'; customHeader.style.zIndex = '9999'; var elementToReplace = document.querySelector('a[href="./changelog/"][target="_blank"][rel="noopener noreferrer"]'); if (elementToReplace) { elementToReplace.parentNode.replaceChild(customHeader, elementToReplace); } } function updateHealthBarColor() { var healthBar = document.getElementById('health-bar'); var healthPercentage = document.getElementById('health-bar-percentage'); var percentage = parseInt(healthPercentage.textContent); var colorPicker = document.getElementById('health-bar-color'); var selectedColor = colorPicker.value; var degradationColorPicker = document.getElementById('health-bar-degradation-color'); var degradationColor = degradationColorPicker.value; var redValue = Math.round((100 - percentage) * 2.55); var blendFactor = percentage / 100; var finalRed = Math.round((1 - blendFactor) * parseInt(degradationColor.substr(1, 2), 16) + blendFactor * parseInt(selectedColor.substr(1, 2), 16)); var finalGreen = Math.round((1 - blendFactor) * parseInt(degradationColor.substr(3, 2), 16) + blendFactor * parseInt(selectedColor.substr(3, 2), 16)); var finalBlue = Math.round((1 - blendFactor) * parseInt(degradationColor.substr(5, 2), 16) + blendFactor * parseInt(selectedColor.substr(5, 2), 16)); var updatedColor = 'rgb(' + finalRed + ',' + finalGreen + ',' + finalBlue + ')'; healthBar.style.backgroundColor = updatedColor; } function saveSettings() { var healthBarColor = document.getElementById('health-bar-color').value; var healthBarDegradationColor = document.getElementById('health-bar-degradation-color').value; localStorage.setItem('healthBarColor', healthBarColor); localStorage.setItem('healthBarDegradationColor', healthBarDegradationColor); } // Function to load settings from localStorage function loadSettings() { var healthBarColor = localStorage.getItem('healthBarColor'); var healthBarDegradationColor = localStorage.getItem('healthBarDegradationColor'); if (healthBarColor) { document.getElementById('health-bar-color').value = healthBarColor; } if (healthBarDegradationColor) { document.getElementById('health-bar-degradation-color').value = healthBarDegradationColor; } } var settingsTabsContainer = document.getElementById('settings-tabs-container'); var modSettingsTabButton = document.createElement('button'); modSettingsTabButton.className = 'tab'; modSettingsTabButton.id = 'tab-mod-settings'; modSettingsTabButton.innerHTML = '<i class="fa-solid fa-gear"></i>Mod Settings'; settingsTabsContainer.querySelector('#settings-tab-bar').appendChild(modSettingsTabButton); var modSettingsTabContent = document.createElement('div'); modSettingsTabContent.className = 'tab-content'; modSettingsTabContent.id = 'tab-mod-settings-content'; modSettingsTabContent.style.display = 'none'; var modSettingsContent = document.createElement('div'); var healthBarColorSetting = document.createElement('div'); healthBarColorSetting.className = 'modal-item'; healthBarColorSetting.style.marginBottom = '25px'; healthBarColorSetting.innerHTML = ` <label> <span class="setting-title">Health bar color</span> <input type="color" id="health-bar-color" value="#FFFFFF"> <!-- Default color: white --> </label> `; modSettingsContent.appendChild(healthBarColorSetting); var healthBarDegradationColorSetting = document.createElement('div'); healthBarDegradationColorSetting.className = 'modal-item'; healthBarDegradationColorSetting.style.marginBottom = '10px'; healthBarDegradationColorSetting.innerHTML = ` <label> <span class="setting-title">Health bar degradation color</span> <input type="color" id="health-bar-degradation-color" value="#FF0000"> <!-- Default color: red --> </label>`; modSettingsContent.appendChild(healthBarDegradationColorSetting); modSettingsTabContent.appendChild(modSettingsContent); settingsTabsContainer.querySelector('#settings-tabs').appendChild(modSettingsTabContent); var healthBarSettings = document.querySelectorAll('#health-bar-color, #health-bar-degradation-color'); healthBarSettings.forEach(function(setting) { setting.addEventListener('input', function() { updateHealthBarColor(); saveSettings(); }); }); function toggleUncappedFPS(enabled) { if (enabled) { window.requestAnimationFrame = function(callback) { return setTimeout(callback, 1); }; } else { window.requestAnimationFrame = function(callback) { return setTimeout(callback, 1000 / 60); }; } } var uncappedFPSEnabled = localStorage.getItem('uncappedFPSEnabled') === 'true'; toggleUncappedFPS(uncappedFPSEnabled); function updateUncappedFPSSetting(enabled) { localStorage.setItem('uncappedFPSEnabled', enabled); toggleUncappedFPS(enabled); } function createUncappedFPSSetting() { var uncappedFPSSetting = document.createElement('div'); uncappedFPSSetting.className = 'modal-item checkbox-setting'; uncappedFPSSetting.style.marginBottom = '10px'; uncappedFPSSetting.innerHTML = ` <label> <span class="setting-title" style="margin-right: 10px;">Uncapped FPS</span> <input type="checkbox" id="toggle-uncapped-fps" ${uncappedFPSEnabled ? 'checked' : ''} style="margin-left: auto; margin-right: -40px; "> </label> `; uncappedFPSSetting.querySelector('#toggle-uncapped-fps').addEventListener('change', function() { updateUncappedFPSSetting(this.checked); }); return uncappedFPSSetting; } modSettingsContent.appendChild(createUncappedFPSSetting()); var graphicsSettingsTabContent = document.getElementById('tab-graphics-content'); graphicsSettingsTabContent.appendChild(createUncappedFPSSetting()); showKillCounter(); addAdditionalUI(); updateHealthBarColor(); loadSettings(); createUncappedFPSSetting() var healthPercentage = document.getElementById('health-bar-percentage'); healthPercentage.addEventListener('DOMSubtreeModified', updateHealthBarColor); periodicallyShowKillCounter(); document.addEventListener('DOMContentLoaded', addAdditionalUI); window.addEventListener('popstate', showKillCounter); replaceWithHeader(); })();