Loop upgrade custom builds, render aim line, render factory guide circle, and more.
目前為
// ==UserScript==
// @name Diep.io x03 Mod Menu
// @namespace http://tampermonkey.net/
// @version 1.0
// @homepage https://greasyfork.org/scripts/
// @description Loop upgrade custom builds, render aim line, render factory guide circle, and more.
// @author x03#2666 / x032205
// @match https://diep.io/
// @grant none
// @license GNU GPLv3
// ==/UserScript==
;(function () {
'use strict'
//== Basic Elements ==//
const main_panel = document.createElement('div')
main_panel.id = 'main_panel'
// Anchor
const anchor = document.createElement('a')
anchor.id = 'anchor'
// Header
const header = document.createElement('h1')
header.textContent = 'x03 Mod Menu | Toggle: [R]'
anchor.appendChild(header)
// Holder panel
const holder_panel = document.createElement('div')
holder_panel.id = 'holder_panel'
anchor.appendChild(holder_panel)
// Tab side panel
const side_panel = document.createElement('div')
side_panel.classList.add('panel_1')
holder_panel.appendChild(side_panel)
// Display panel
const display_panel = document.createElement('div')
display_panel.classList.add('panel_1')
holder_panel.appendChild(display_panel)
display_panel.style.width = '100%'
display_panel.style.marginLeft = '4px'
display_panel.innerHTML = `<h2>select a tab</h2>`
//== Tab Panels ==//
//== VISUAL TAB
const view_line = document.createElement('div')
view_line.style.textAlign = 'left'
view_line.style.alignItems = 'center'
view_line.style.height = '33px'
view_line.style.display = 'flex'
const view_line_text = document.createElement('span')
view_line_text.style.fontWeight = 'bold'
view_line_text.textContent = 'View Aim Line'
const view_line_label = document.createElement('label')
view_line_label.classList.add('switch')
const view_line_toggle = document.createElement('INPUT')
view_line_toggle.setAttribute('type', 'checkbox')
view_line_label.appendChild(view_line_toggle)
const view_line_div = document.createElement('div')
view_line_label.appendChild(view_line_div)
view_line.appendChild(view_line_label)
view_line.appendChild(view_line_text)
// View Circle
const view_circle = document.createElement('div')
view_circle.style.textAlign = 'left'
view_circle.style.alignItems = 'center'
view_circle.style.height = '33px'
view_circle.style.display = 'flex'
const view_circle_text = document.createElement('span')
view_circle_text.style.fontWeight = 'bold'
view_circle_text.textContent = 'View Factory Cicle'
const view_circle_label = document.createElement('label')
view_circle_label.classList.add('switch')
const view_circle_toggle = document.createElement('INPUT')
view_circle_toggle.setAttribute('type', 'checkbox')
view_circle_label.appendChild(view_circle_toggle)
const view_circle_div = document.createElement('div')
view_circle_label.appendChild(view_circle_div)
view_circle.appendChild(view_circle_label)
view_circle.appendChild(view_circle_text)
// Tab Control
const visual_tab = document.createElement('button')
visual_tab.classList.add('tab_button')
side_panel.appendChild(visual_tab)
visual_tab.textContent = 'Visual'
visual_tab.onclick = function () {
display_panel.innerHTML = ``
display_panel.appendChild(view_line)
display_panel.appendChild(view_circle)
}
//== AUTO UPGRADES TAB
const au_label = document.createElement('span')
au_label.textContent = 'Custom Build'
au_label.style.fontWeight = 'bold'
const au_input = document.createElement('INPUT')
au_input.ariaReadOnly = 'true'
au_input.setAttribute('type', 'text')
au_input.style.borderColor = 'rgb(20 20 20)'
au_input.style.borderRadius = '5px'
au_input.style.marginTop = '4px'
au_input.style.outline = 'none'
au_input.style.color = 'white'
au_input.placeholder = '000000000000000000000000000000000'
au_input.style.backgroundColor = 'rgb(25 25 25)'
const au_set_button = document.createElement('button')
au_set_button.classList.add('button')
au_set_button.textContent = 'Set Build'
au_set_button.onclick = function () {
input.execute('game_stats_build ' + au_input.value)
}
// Autoset toggle
const au_autoset = document.createElement('div')
au_autoset.style.textAlign = 'left'
au_autoset.style.alignItems = 'center'
au_autoset.style.height = '33px'
au_autoset.style.display = 'flex'
const au_autoset_text = document.createElement('span')
au_autoset_text.style.fontWeight = 'bold'
au_autoset_text.textContent = 'Keep Build on Respawn'
const au_autoset_label = document.createElement('label')
au_autoset_label.classList.add('switch')
const au_autoset_toggle = document.createElement('INPUT')
au_autoset_toggle.setAttribute('type', 'checkbox')
au_autoset_label.appendChild(au_autoset_toggle)
const au_autoset_div = document.createElement('div')
au_autoset_label.appendChild(au_autoset_div)
au_autoset.appendChild(au_autoset_label)
au_autoset.appendChild(au_autoset_text)
// Tab Control
const auto_upgrades_tab = document.createElement('button')
auto_upgrades_tab.classList.add('tab_button')
side_panel.appendChild(auto_upgrades_tab)
auto_upgrades_tab.textContent = 'Auto Upgrades'
auto_upgrades_tab.onclick = function () {
display_panel.innerHTML = ``
display_panel.style.textAlign = 'left'
display_panel.appendChild(au_label)
display_panel.appendChild(au_input)
display_panel.appendChild(au_set_button)
display_panel.appendChild(au_autoset)
}
//== CREDITS TAB
const credits_tab = document.createElement('button')
credits_tab.classList.add('tab_button')
side_panel.appendChild(credits_tab)
credits_tab.textContent = 'Credits'
credits_tab.onclick = function () {
display_panel.style.textAlign = 'center'
display_panel.innerHTML = `
<br>
<h3>Mod menu made by x03</h3>
<p>Discord: <span style="color: rgb(52 211 153)">x03#2666</span></p>
<p>Github: <span style="color: rgb(52 211 153)">x032205</span></p>
<style>
br {
margin-top: 30px;
}
p {
margin: 2px;
font-weight: bold;
}
</style>
`
}
//== Style ==//
const style = document.createElement('style')
style.textContent = `
#main_panel a {
position: absolute;
font-family: 'Outfit', sans-serif;
src: url('https://fonts.googleapis.com/css2?family=Outfit&display=swap');
}
#anchor {
display: inline-flex;
flex-direction: column;
width: 600px;
height: 300px;
text-align: center;
top: 300px;
right: 50px;
padding: 0 7px 14px 7px;
color: white;
background: rgb(15 15 15);
border-radius: 7px;
border-style: solid;
border-width: 2px;
border-color: rgb(60 60 60);
}
#holder_panel {
display: inline-flex;
flex-direction: row;
height: 100%;
}
h1 {
margin-top: 10px;
margin-bottom: 5px;
color: rgb(52 211 153);
}
.switch input {
position: absolute;
opacity: 0;
cursor: pointer;
}
.switch {
display: inline-block;
font-size: 20px; /* 1 */
height: 1em;
width: 2em;
background: rgb(50 50 50);
border-radius: 1em;
margin-right: 10px;
cursor: pointer;
}
.switch div {
height: 1em;
width: 1em;
border-radius: 1em;
background: rgb(100 100 100);
-webkit-transition: all 100ms;
-moz-transition: all 100ms;
transition: all 100ms;
cursor: pointer;
}
.switch input:checked + div {
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
background: rgb(40 200 140)
}
.panel_1 {
display: inline-flex;
flex-direction: column;
padding: 4px;
width: fit-content;
height: 100%;
border-radius: 5px;
background: rgb(30 30 30);
white-space: nowrap;
}
.button {
font-family: 'Outfit', sans-serif;
src: url('https://fonts.googleapis.com/css2?family=Outfit&display=swap');
font-weight: bold;
cursor: pointer;
font-size: 14px;
padding: 2px 4px 2px 4px;
margin-top: 2px;
margin-bottom: 2px;
color: white;
background: rgb(50 50 50);
border-radius: 3px;
border-style: solid;
border-width: 2px;
border-color: rgb(60 60 60);
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 50ms;
}
.tab_button {
font-family: 'Outfit', sans-serif;
src: url('https://fonts.googleapis.com/css2?family=Outfit&display=swap');
font-weight: bold;
cursor: pointer;
font-size: 18px;
padding: 4px 8px 4px 8px;
margin-bottom: 4px;
color: white;
background: rgb(50 50 50);
border-radius: 3px;
border-style: solid;
border-width: 2px;
border-color: rgb(60 60 60);
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 50ms;
}
.tab_button:hover {
background: rgb(60 60 60);
border-color: rgb(80 80 80);
}
.button:hover {
background: rgb(60 60 60);
border-color: rgb(80 80 80);
}
.tab_button:focus {
background: rgb(50 60 50);
border-color: rgb(50 100 50);
}
`
//== Appends ==//
main_panel.appendChild(anchor)
document.body.appendChild(main_panel)
document.head.appendChild(style)
//== Funcs ==//
function ToggleDisplay(element_id) {
var element = document.getElementById(element_id)
element.style.display = element.style.display === 'none' ? 'block' : 'none'
}
//== Vars ==//
let X, Y, x, y
let Z = false
let radius = []
//== Events ==//
document.body.onkeyup = function (ctx) {
if (ctx.keyCode === 82) {
ToggleDisplay('main_panel')
} else if (document.activeElement === au_input && parseInt(ctx.key) >= 1 && parseInt(ctx.key) <= 8) {
au_input.value = au_input.value + ctx.key
} else if (document.activeElement === au_input && ctx.keyCode === 8) {
au_input.value = au_input.value.slice(0, -1)
}
}
document.onmousemove = function () {
x = event.clientX
y = event.clientY
}
document.onmousedown = function (e) {
if (e.button == 2) {
Z = true
}
}
document.onmouseup = function (e) {
if (e.button == 2) {
Z = false
}
}
//== Draw Funcs ==//
const canvas = document.createElement('canvas')
function get_Radius() {
X = window.innerWidth / 2
Y = window.innerHeight / 2
canvas.width = window.innerWidth
canvas.height = window.innerHeight
// thx to "Licht_denker47" for these sets
radius[0] = window.innerWidth * 0.17681239669
radius[1] = window.innerWidth * 0.06545454545
radius[2] = window.innerWidth * 0.16751239669
radius[3] = window.innerWidth * 0.36
}
get_Radius()
window.addEventListener('resize', get_Radius)
canvas.style.position = 'absolute'
canvas.style.top = '0px'
canvas.style.left = '0px'
canvas.style.pointerEvents = 'none'
document.body.appendChild(canvas)
const ctx = canvas.getContext('2d')
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height)
// Aim Line
if (view_line_toggle.checked) {
ctx.beginPath()
ctx.moveTo(X, Y)
ctx.lineTo(x, y)
ctx.lineWidth = 50
ctx.strokeStyle = 'rgba(0, 0, 0, 0.05)'
ctx.stroke()
ctx.beginPath()
ctx.moveTo(X, Y)
ctx.lineTo(x, y)
ctx.lineWidth = 2
ctx.strokeStyle = 'rgba(0, 0, 0, 0.7)'
ctx.stroke()
}
if (view_circle_toggle.checked) {
// Large Circle
ctx.lineWidth = 2
ctx.beginPath()
ctx.arc(X, Y, radius[3], 0, 2 * Math.PI)
ctx.strokeStyle = 'rgba(0, 0, 0, 0.7)'
ctx.stroke()
// Inner Circle
ctx.beginPath()
ctx.arc(x, y, radius[1], 0, 2 * Math.PI)
ctx.stroke()
// Outer Circle
ctx.beginPath()
if (Z) {
ctx.arc(x, y, radius[0], 0, 2 * Math.PI)
} else {
ctx.arc(x, y, radius[2], 0, 2 * Math.PI)
}
ctx.stroke()
}
if (au_autoset_toggle.checked) {
input.execute('game_stats_build ' + au_input.value)
}
requestAnimationFrame(draw)
}
draw()
})()