Change Brightness and contrast script for vectaria.io
目前為
// ==UserScript==
// @name change the contrast and brightness script for vectaria.io
// @namespace http://tampermonkey.net/
// @version 1.5
// @description Change Brightness and contrast script for vectaria.io
// @author x_Rediex
// @license MIT
// @match *://vectaria.io/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
const style = document.createElement("style");
style.textContent = `
@keyframes rgbText {
0% { color: red; }
33% { color: lime; }
66% { color: deepskyblue; }
100% { color: red; }
}
#vc-overlay {
position: fixed;
top: 10px;
right: 10px;
background: #000;
padding: 14px 14px 8px 14px;
border-radius: 12px;
z-index: 99999;
font-family: monospace;
font-size: 14px;
color: white;
box-shadow: 0 0 10px rgba(0,0,0,0.6);
cursor: move;
width: fit-content;
}
#vc-overlay .rgb {
animation: rgbText 3s infinite;
font-weight: bold;
}
.slider-label {
margin-top: 10px;
margin-bottom: 2px;
}
.slider-value {
font-size: 12px;
margin-bottom: 4px;
display: block;
text-align: center;
}
input[type="range"] {
-webkit-appearance: none;
width: 120px;
height: 6px;
background: #000;
border: 1px solid white;
border-radius: 3px;
outline: none;
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 14px;
height: 14px;
background: #000;
border: 2px solid white;
cursor: pointer;
box-sizing: border-box;
}
input[type="range"]::-moz-range-thumb {
width: 14px;
height: 14px;
background: #000;
border: 2px solid white;
cursor: pointer;
box-sizing: border-box;
}
#vc-toggle-btn {
position: absolute;
top: 4px;
left: 6px;
font-weight: bold;
background: none;
color: white;
border: none;
font-size: 14px;
cursor: pointer;
padding: 0;
}
#vc-content {
margin-top: 10px;
}
#vc-mod-button {
display: none;
position: fixed;
bottom: 40px;
right: 40px;
width: 64px;
height: 64px;
background-color: #111;
color: white;
font-family: 'Arial Black', sans-serif;
font-size: 14px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 99999;
box-shadow: 0 4px 10px rgba(0,0,0,0.5);
user-select: none;
}
`;
document.head.appendChild(style);
// Main panel
const overlay = document.createElement("div");
overlay.id = "vc-overlay";
overlay.innerHTML = `
<button id="vc-toggle-btn">[-]</button>
<div class="rgb">🎮 Player: <span id="vc-nick">Loading...</span></div>
<div id="vc-content">
<div class="slider-label rgb">☀ Brightness</div>
<input type="range" id="vc-brightness" min="0" max="2" step="0.1" value="1">
<span class="slider-value" id="vc-brightness-val">1.0</span>
<div class="slider-label rgb">🎛 Contrast</div>
<input type="range" id="vc-contrast" min="0" max="4" step="0.1" value="1">
<span class="slider-value" id="vc-contrast-val">1.0</span>
</div>
`;
document.body.appendChild(overlay);
// MOD button (show panel)
const modButton = document.createElement("div");
modButton.id = "vc-mod-button";
modButton.innerText = "Mod";
document.body.appendChild(modButton);
const applyFilters = () => {
const brightness = document.getElementById("vc-brightness").value;
const contrast = document.getElementById("vc-contrast").value;
document.body.style.filter = `brightness(${brightness}) contrast(${contrast})`;
document.getElementById("vc-brightness-val").textContent = brightness;
document.getElementById("vc-contrast-val").textContent = contrast;
};
document.getElementById("vc-brightness").addEventListener("input", applyFilters);
document.getElementById("vc-contrast").addEventListener("input", applyFilters);
const updateNick = () => {
try {
const nick = window.username || document.querySelector(".username, .player-name")?.innerText || "Unknown";
document.getElementById("vc-nick").innerText = nick;
} catch {
document.getElementById("vc-nick").innerText = "No nickname";
}
};
setTimeout(updateNick, 1500);
// Drag & Drop
let isDragging = false;
let offsetX, offsetY;
overlay.addEventListener('mousedown', function(e) {
if (e.target.id === 'vc-toggle-btn') return;
isDragging = true;
offsetX = e.clientX - overlay.offsetLeft;
offsetY = e.clientY - overlay.offsetTop;
overlay.style.cursor = 'grabbing';
});
document.addEventListener('mousemove', function(e) {
if (isDragging) {
overlay.style.left = `${e.clientX - offsetX}px`;
overlay.style.top = `${e.clientY - offsetY}px`;
overlay.style.right = 'auto';
}
});
document.addEventListener('mouseup', function() {
isDragging = false;
overlay.style.cursor = 'move';
});
// Minimize
const toggleBtn = document.getElementById('vc-toggle-btn');
const content = document.getElementById('vc-content');
toggleBtn.addEventListener('click', () => {
overlay.style.display = "none";
modButton.style.display = "flex";
});
// Show panel
modButton.addEventListener("click", () => {
overlay.style.display = "block";
modButton.style.display = "none";
});
})();