Visual toolkit for surviv.io
// ==UserScript==
// @name Surluner
// @namespace demo.surluner.fx
// @version 12.3
// @description Visual toolkit for surviv.io
// @match *://surviv.io/*
// @match *://*.surviv.io/*
// @grant none
// ==/UserScript==
(function () {
'use strict';
if (!location.hostname.includes('surviv.io')) return;
if (document.getElementById('surluner')) return;
const body = document.body;
/* ================= FILTER ENGINE (FIXES CONFLICTS) ================= */
let fx = {
grayscale:false,
invert:false,
blur:false,
sepia:false,
contrast:false,
brightness:false,
hue:0
};
function updateFilters(){
let f = '';
if (fx.grayscale) f += ' grayscale(100%)';
if (fx.invert) f += ' invert(100%)';
if (fx.blur) f += ' blur(3px)';
if (fx.sepia) f += ' sepia(100%)';
if (fx.contrast) f += ' contrast(2)';
if (fx.brightness) f += ' brightness(1.5)';
if (fx.hue) f += ` hue-rotate(${fx.hue}deg)`;
body.style.filter = f.trim();
}
/* ================= MENU ================= */
const menu = document.createElement('div');
menu.id = 'surluner';
menu.style.display = 'none';
menu.innerHTML = `
<div id="header">
<span>Surluner</span>
<span id="close">×</span>
</div>
<div id="content">
<div class="card toggle" data-f="rainbow"><span>🌈 Rainbow</span><button>OFF</button></div>
<div class="card toggle" data-f="grayscale"><span>🌑 Grayscale</span><button>OFF</button></div>
<div class="card toggle" data-f="invert"><span>🔄 Invert</span><button>OFF</button></div>
<div class="card toggle" data-f="blur"><span>🌫 Blur</span><button>OFF</button></div>
<div class="card toggle" data-f="shake"><span>🌪 Shake</span><button>OFF</button></div>
<div class="card toggle" data-f="mirror"><span>🪞 Mirror</span><button>OFF</button></div>
<div class="card toggle" data-f="zoom"><span>🔍 Zoom</span><button>OFF</button></div>
<div class="card toggle" data-f="spin"><span>🌀 Spin</span><button>OFF</button></div>
<div class="card toggle" data-f="sepia"><span>📸 Sepia</span><button>OFF</button></div>
<div class="card toggle" data-f="contrast"><span>⚡ Contrast</span><button>OFF</button></div>
<div class="card toggle" data-f="brightness"><span>💡 Brightness</span><button>OFF</button></div>
<div class="card toggle" data-f="fps"><span>📊 FPS</span><button>OFF</button></div>
<div class="card toggle" data-f="mouse"><span>📍 Mouse</span><button>OFF</button></div>
<div class="card toggle" data-f="crosshair"><span>🎯 Crosshair</span><button>OFF</button></div>
<div class="card toggle" data-f="bigcursor"><span>🖱 Cursor</span><button>OFF</button></div>
<div class="card toggle" data-f="dvd"><span>📺 DVD</span><button>OFF</button></div>
<div class="card toggle" data-f="party"><span>🎉 Party</span><button>OFF</button></div>
<div class="card toggle" data-f="matrix"><span>🟩 Matrix</span><button>OFF</button></div>
<div class="card toggle" data-f="vignette"><span>🌌 Vignette</span><button>OFF</button></div>
<div class="card toggle" data-f="pixel"><span>🧱 Pixel</span><button>OFF</button></div>
<div class="card toggle" data-f="bounce"><span>🏀 Bounce</span><button>OFF</button></div>
<div class="card toggle" data-f="ghost"><span>👻 Ghost</span><button>OFF</button></div>
<div class="card toggle" data-f="disco"><span>🕺 Disco</span><button>OFF</button></div>
<div class="card toggle" data-f="clock"><span>⏰ Clock</span><button>OFF</button></div>
<div class="card toggle" data-f="tiny"><span>🐜 Tiny</span><button>OFF</button></div>
<div class="card toggle" data-f="giant"><span>🦍 Giant</span><button>OFF</button></div>
<div class="card toggle" data-f="spinview"><span>🌀 View Spin</span><button>OFF</button></div>
<div class="card toggle" data-f="retro"><span>📺 Retro</span><button>OFF</button></div>
<div class="card toggle" data-f="cinema"><span>🎬 Cinema</span><button>OFF</button></div>
<div class="card toggle" data-f="snow"><span>❄ Snow</span><button>OFF</button></div>
<div class="card toggle" data-f="emoji"><span>😂 Emoji</span><button>OFF</button></div>
<div class="card toggle" data-f="laser"><span>🔴 Laser</span><button>OFF</button></div>
<div class="card button" id="bg">🎲 Background</div>
<div class="card button" id="reset">🔁 Reset</div>
</div>
`;
document.body.appendChild(menu);
/* ================= STYLE ================= */
const style = document.createElement('style');
style.textContent = `
#surluner{
position:fixed;
top:50%;
left:60px;
transform:translateY(-50%);
width:340px;
background:#0a0a0a;
border:1px solid red;
color:white;
font-family:Arial;
z-index:999999;
border-radius:10px;
overflow:hidden;
display:flex;
flex-direction:column;
max-height:75vh;
}
#header{
background:#111;
padding:10px;
display:flex;
justify-content:space-between;
color:red;
cursor:move;
font-weight:bold;
}
#content{overflow-y:auto;padding:8px;max-height:65vh;}
.card{
background:#111;
margin:6px 0;
padding:10px;
border-radius:8px;
display:flex;
justify-content:space-between;
align-items:center;
border:1px solid #222;
}
.toggle button{
background:#222;
border:1px solid red;
color:white;
padding:4px 10px;
border-radius:6px;
cursor:pointer;
}
.toggle button.active{background:red;color:black;}
.button{justify-content:center;cursor:pointer;}
`;
document.head.appendChild(style);
/* ================= SHIFT MENU ================= */
let open=false;
document.addEventListener('keydown',e=>{
if(e.repeat) return;
if(e.code==='ShiftLeft'||e.code==='ShiftRight'){
open=!open;
menu.style.display=open?'flex':'none';
}
});
/* ================= CLOSE ================= */
document.getElementById('close').onclick=()=>{
menu.style.display='none';
open=false;
};
/* ================= EXTRA ELEMENTS ================= */
const fps=document.createElement('div');
fps.style.cssText='position:fixed;top:10px;right:10px;color:lime;background:black;padding:5px;z-index:999999;display:none';
document.body.appendChild(fps);
let last=performance.now();
function fpsLoop(){
requestAnimationFrame(()=>{
let now=performance.now();
fps.textContent='FPS:'+Math.round(1000/(now-last));
last=now;
fpsLoop();
});
}
fpsLoop();
const tracker=document.createElement('div');
tracker.style.cssText='position:fixed;width:10px;height:10px;background:red;border-radius:50%;z-index:999999;display:none';
document.body.appendChild(tracker);
document.addEventListener('mousemove',e=>{
tracker.style.left=e.clientX+'px';
tracker.style.top=e.clientY+'px';
});
const crosshair=document.createElement('div');
crosshair.style.cssText='position:fixed;left:50%;top:50%;width:20px;height:20px;border:2px solid red;transform:translate(-50%,-50%);display:none;z-index:999999';
document.body.appendChild(crosshair);
/* ================= RAINBOW FIX ================= */
let rainbow=false;
setInterval(()=>{
if(rainbow){
fx.hue=(fx.hue+2)%360;
updateFilters();
}
},30);
/* ================= TOGGLES ================= */
document.querySelectorAll('.toggle').forEach(card=>{
const btn=card.querySelector('button');
const f=card.dataset.f;
btn.onclick=()=>{
const on=btn.classList.toggle('active');
btn.textContent=on?'ON':'OFF';
switch(f){
case 'rainbow': rainbow=on; break;
case 'grayscale': fx.grayscale=on; updateFilters(); break;
case 'invert': fx.invert=on; updateFilters(); break;
case 'blur': fx.blur=on; updateFilters(); break;
case 'sepia': fx.sepia=on; updateFilters(); break;
case 'contrast': fx.contrast=on; updateFilters(); break;
case 'brightness': fx.brightness=on; updateFilters(); break;
case 'fps': fps.style.display=on?'block':'none'; break;
case 'mouse': tracker.style.display=on?'block':'none'; break;
case 'crosshair': crosshair.style.display=on?'block':'none'; break;
case 'mirror': body.style.transform=on?'scaleX(-1)':''; break;
case 'zoom': body.style.zoom=on?'1.3':'1'; break;
case 'spin': body.style.animation=on?'spin 4s linear infinite':''; break;
case 'ghost': body.style.opacity=on?'0.5':'1'; break;
case 'clock': break;
}
};
});
/* ================= BUTTONS ================= */
document.getElementById('bg').onclick=()=>{
body.style.background='#'+Math.floor(Math.random()*16777215).toString(16);
};
document.getElementById('reset').onclick=()=>location.reload();
})();