config.lua
Config = {}
Config.GlobalSettings = {
["peds"] = false,
["vehicles"] = false,
["objects"] = false,
["particles"] = false,
["rain"] = false,
["shadows"] = false,
["lights"] = false,
["broken"] = false,
["unnecessary"] = false,
["ped"] = false,
["lowTexture"] = false,
}
Config.Key = "F11"
Config.DisableKeybind = false
Config.CommandString = "fpsmenu"
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div class="mainMenu" style="display: none;">
<div class="options-container">
<div class="options">
<div class="optionLabel"><img src="assets/mainOptions.png"></div>
<div class="child">
<div class="text">Optimize Peds</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="pedsON">ON</div>
<div class="switchOption selectedOFF" id="pedsOFF">OFF</div>
</div>
<div class="switchIndicator" id="peds"></div>
</div>
</div>
<div class="child">
<div class="text">Optimize Vehicles</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="vehiclesON">ON</div>
<div class="switchOption selectedOFF" id="vehiclesOFF">OFF</div>
</div>
<div class="switchIndicator" id="vehicles"></div>
</div>
</div>
<div class="child">
<div class="text">Optimize Objects</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="objectsON">ON</div>
<div class="switchOption selectedOFF" id="objectsOFF">OFF</div>
</div>
<div class="switchIndicator" id="objects"></div>
</div>
</div>
<div class="child">
<div class="text">Remove Particles</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="particlesON">ON</div>
<div class="switchOption selectedOFF" id="particlesOFF">OFF</div>
</div>
<div class="switchIndicator" id="particles"></div>
</div>
</div>
</div>
<div class="options" id="center">
<div class="optionLabel"><img src="assets/otherOptions.png"></div>
<div class="child">
<div class="text">Disable Broken Glass</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="brokenON">ON</div>
<div class="switchOption selectedOFF" id="brokenOFF">OFF</div>
</div>
<div class="switchIndicator" id="broken"></div>
</div>
</div>
<div class="child">
<div class="text">Clearing Ped dirt</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="pedON">ON</div>
<div class="switchOption selectedOFF" id="pedOFF">OFF</div>
</div>
<div class="switchIndicator" id="ped"></div>
</div>
</div>
<div class="child">
<div class="text">Turn various optimizations</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="unnecessaryON">ON</div>
<div class="switchOption selectedOFF" id="unnecessaryOFF">OFF</div>
</div>
<div class="switchIndicator" id="unnecessary"></div>
</div>
</div>
</div>
<div class="options" style="margin-right: 0;">
<div class="optionLabel"><img src="assets/worldOptions.png"></div>
<div class="child">
<div class="text">Disable Rain and Wind</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="rainON">ON</div>
<div class="switchOption selectedOFF" id="rainOFF">OFF</div>
</div>
<div class="switchIndicator" id="rain"></div>
</div>
</div>
<div class="child" >
<div class="text">Optimize Shadows</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="shadowsON">ON</div>
<div class="switchOption selectedOFF" id="shadowsOFF">OFF</div>
</div>
<div class="switchIndicator" id="shadows"></div>
</div>
</div>
<div class="child">
<div class="text">Optimize Lights</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="lightsON">ON</div>
<div class="switchOption selectedOFF" id="lightsOFF">OFF</div>
</div>
<div class="switchIndicator" id="lights"></div>
</div>
</div>
<div class="child">
<div class="text">Set Textures to Low</div>
<div class="switch">
<div class="flex">
<div class="switchOption" id="lowTextureON">ON</div>
<div class="switchOption selectedOFF" id="lowTextureOFF">OFF</div>
</div>
<div class="switchIndicator" id="lowTexture"></div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="scripts.js"></script>
</html>
script.js
function GetParentResourceName() {
return 'neo100k_fpsbooster';
}
$(".switchOption").click(function() {
let value = $(this).attr("id");
let boolean = false;
if (value.includes("ON")) {
boolean = true;
value = value.replace("ON", "");
$(`#${value}`).css("margin-left", "-1px");
$(`#${value}OFF`).removeClass("selectedOFF");
$(`#${value}ON`).addClass("selectedON");
} else {
value = value.replace("OFF", "");
$(`#${value}`).css("margin-left", "39px");
$(`#${value}OFF`).addClass("selectedOFF");
$(`#${value}ON`).removeClass("selectedON");
}
fetch(`https://${GetParentResourceName()}/changeOption`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ option: value, boolean: boolean })
});
});
window.addEventListener('message', function (event) {
let action = event.data.action;
if (action == "openMenu") {
$('.mainMenu').show();
let currentOptions = event.data.settings;
for (var k in currentOptions) {
if (currentOptions[k] == true) {
$(`#${k}`).css("margin-left", "-1px");
$(`#${k}OFF`).removeClass("selectedOFF");
$(`#${k}ON`).addClass("selectedON");
} else {
$(`#${k}`).css("margin-left", "39px");
$(`#${k}OFF`).addClass("selectedOFF");
$(`#${k}ON`).removeClass("selectedON");
}
}
} else if (action == "closeMenu") {
$('.mainMenu').hide();
}
});
$(document).keyup(function(e) {
if (e.keyCode == 27) {
$('.mainMenu').hide();
fetch(`https://${GetParentResourceName()}/exitMenu`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
}
});
}
});
style.css
body {
display: flex;
justify-content: center;
align-items: center;
color: rgb(255, 255, 255);
padding: 0;
margin: 0;
overflow: hidden;
width: 100%;
height: 100%;
background: transparent;
font-family: "Gilroy";
}
* {
user-select: none;
box-sizing: border-box;
}
@font-face {
font-family: "Gilroy";
src: url("assets/Gilroy-SemiBold.ttf");
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Gilroy";
src: url("assets/Gilroy-Bold.ttf");
font-weight: 200;
font-style: normal;
font-display: swap;
}
.mainMenu {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: flex-start;
background: rgba(0, 0, 0, 0.7);
padding: 20px;
z-index: 9999;
}
.options-container {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 20px;
max-width: 1200px;
margin: 0 auto;
}
.options {
background: linear-gradient(180deg, rgba(14, 10, 18, 0.9) .5%, rgba(14, 10, 18, 0) 100%);
padding: 20px;
border-radius: 10px;
border: 1px solid rgba(146, 123, 183, 0.3);
margin: 0;
height: fit-content;
min-width: 300px;
flex: 1 1 300px;
box-sizing: border-box;
}
.optionLabel {
margin-bottom: 15px;
text-align: center;
}
.optionLabel img {
max-width: 100%;
height: auto;
}
.child {
padding: 10px;
padding-right: 20px;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(146, 123, 183, 0.15);
border-radius: 5px;
font-family: "Gilroy";
font-weight: 200;
font-size: 16px;
}
.child .text {
margin-left: 6px;
flex: 1;
}
.switch {
background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 100%);
border: 1px solid rgba(255, 255, 255, 0.247);
border-radius: 6px;
margin-right: 6px;
width: 75px;
height: 25px;
position: relative;
flex-shrink: 0;
}
.switch .flex {
height: 100%;
display: flex;
align-items: center;
justify-content: space-around;
}
.switchOption {
font-family: 'Gilroy';
font-weight: 100;
font-size: 12px;
color: rgba(255, 255, 255, 0.5);
z-index: 11;
transition: 0.2s;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.selectedON {
color: #ffffff !important;
}
.selectedOFF {
color: #ffffff !important;
}
.switchIndicator {
position: absolute;
background: linear-gradient(295.75deg, rgba(106, 26, 255, 0.27) 0%, rgba(133, 26, 255, 0.055) 100%);
border: 1px solid #721aff;
border-radius: 6px;
height: 25px;
width: 35px;
margin-top: -1px;
margin-left: 39px;
z-index: 10;
transition: 0.35s;
top: 0;
}
small {
color: rgba(255, 255, 255, 0.5);
font-size: 10px;
margin-left: 5px;
}
@media screen and (max-width: 1185px) {
.optionLabel img {
width: 250px;
}
.child {
font-size: 14px;
padding: 8px;
padding-right: 15px;
}
small {
font-size: 8px;
}
}
@media screen and (max-width: 950px) {
.options-container {
flex-direction: column;
align-items: center;
}
.options {
margin-right: 0;
width: 100%;
max-width: 400px;
}
#center {
order: 3;
}
}
gör en client.lua