mirror of
https://github.com/SpikeHD/MojoFrontend.git
synced 2024-11-22 01:05:33 +00:00
[WIP] Add cheating page
This commit is contained in:
mingjun97
parent
db554d5f32
commit
ac444c8bdd
17
console.html
17
console.html
@ -9,14 +9,29 @@
|
||||
<div id="main">
|
||||
<div id="titleBar">
|
||||
Mojo Console <img src="" id="logo" />
|
||||
<div id="status" class="ready"><span class="dot"></span><span id="statusText">Ready</span></div>
|
||||
</div>
|
||||
<div id="right">
|
||||
<div id="sidebar">
|
||||
<div class="sidebarItem" data-value="cheat">Cheating</div>
|
||||
<div class="sidebarItem" data-value="players">Players</div>
|
||||
<div class="sidebarItem" data-value="server">Server</div>
|
||||
<div class="sidebarItem" data-value="settings">Settings</div>
|
||||
</div>
|
||||
<iframe id="content" src="pages/default.html"></iframe>
|
||||
<iframe id="content" src="pages/cheat.html"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div id="message" class="hide" onclick="dismissMessage()">
|
||||
<div id="messageBox" onclick="">
|
||||
<div class="messageBoxTitle">
|
||||
Server Response
|
||||
</div>
|
||||
<div id="messageContent">
|
||||
Message!
|
||||
</div>
|
||||
<div>
|
||||
<button style="margin-bottom: 1em;" onclick="dismissMessage()"> Dismiss </button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
28
pages/cheat.html
Normal file
28
pages/cheat.html
Normal file
@ -0,0 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="../styles/cheat.css" />
|
||||
<link rel="stylesheet" href="../styles/picnic.css">
|
||||
<script type="text/javascript" src="../scripts/cheat.js"></script>
|
||||
<script type="text/javascript" src="../scripts/parent.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="toolset">
|
||||
<input id='tab-1' type='radio' name='tabgroupB' checked />
|
||||
<label class="pseudo button toggle" for="tab-1">Quick Command</label>
|
||||
<input id='tab-2' type='radio' name='tabgroupB'>
|
||||
<label class="pseudo button toggle" for="tab-2">Avatar</label>
|
||||
<input id='tab-3' type='radio' name='tabgroupB'>
|
||||
<label class="pseudo button toggle" for="tab-3">Weapon</label>
|
||||
<input id='tab-4' type='radio' name='tabgroupB'>
|
||||
<label class="pseudo button toggle" for="tab-4">Item</label>
|
||||
<input id='tab-5' type='radio' name='tabgroupB'>
|
||||
<label class="pseudo button toggle" for="tab-5">Misc</label>
|
||||
</div>
|
||||
<div id="panel">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -3,7 +3,6 @@
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="../styles/console.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../styles/players.css" />
|
||||
<script src="../scripts/console.js"></script>
|
||||
<script src="../scripts/parent.js"></script>
|
||||
<script src="../scripts/players.js"></script>
|
||||
</head>
|
||||
|
||||
43
scripts/cheat.js
Normal file
43
scripts/cheat.js
Normal file
@ -0,0 +1,43 @@
|
||||
qucick_command = [
|
||||
{name: "Heal All Characters", command: "heal", args: []},
|
||||
{name: "Give 1000000 Mora", command: "give 202 1000000", args: []},
|
||||
{name: "Give 100000 Proigem", command: "give 201 100000", args: []},
|
||||
{name: "God mode", command: "godmode", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items", command: "clear all", args: []},
|
||||
{name: "Clear all items111", command: "clear all", args: []},
|
||||
]
|
||||
|
||||
document.addEventListener("DOMContentLoaded", ()=> {
|
||||
var panel = document.getElementById("panel");
|
||||
var i = 0;
|
||||
for (i=0; i< qucick_command.length; i++) {
|
||||
var command = qucick_command[i];
|
||||
console.log(i);
|
||||
var div = document.createElement("div");
|
||||
var label = document.createElement("span");
|
||||
var button = document.createElement("button");
|
||||
var hr = document.createElement("hr");
|
||||
hr.classList.add("solid");
|
||||
div.classList.add('commandGroup');
|
||||
label.innerText = command.name;
|
||||
button.innerText = "Go!";
|
||||
button.command_id = i;
|
||||
div.appendChild(label);
|
||||
div.appendChild(button);
|
||||
panel.appendChild(div);
|
||||
button.onclick = (e) => {
|
||||
var cmd = qucick_command[e.target.command_id];
|
||||
var payload = cmd.command;
|
||||
sendCommand(payload);
|
||||
}
|
||||
panel.appendChild(hr);
|
||||
}
|
||||
});
|
||||
@ -1,7 +1,7 @@
|
||||
async function sendCommand(payload){
|
||||
async function sendCommand(payload, method="invoke", background=false){
|
||||
let key = new window.URLSearchParams(window.location.search).get("k");
|
||||
let url = '/mojoplus/api';
|
||||
let data = JSON.stringify({ "k": key, "request": "invoke", "payload": payload });
|
||||
let data = JSON.stringify({ "k": key, "request": method, "payload": payload });
|
||||
|
||||
let response = await fetch(url, {
|
||||
method: 'POST',
|
||||
@ -12,11 +12,23 @@ async function sendCommand(payload){
|
||||
})
|
||||
|
||||
let json = await response.json();
|
||||
|
||||
if (method == 'invoke' && !background) {
|
||||
document.getElementById("messageContent").innerText = json.payload;
|
||||
document.getElementById("message").style.opacity = 1;
|
||||
document.getElementById("message").classList.remove("hide");
|
||||
}
|
||||
return json
|
||||
}
|
||||
|
||||
function dismissMessage(){
|
||||
document.getElementById("message").style.opacity = 1;
|
||||
setTimeout(() => {
|
||||
document.getElementById("message").classList.add("hide");
|
||||
}, 500);
|
||||
document.getElementById("message").style.opacity = 0;
|
||||
}
|
||||
|
||||
function switchPage(page) {
|
||||
const iframe = document.getElementById("content");
|
||||
iframe.src = `pages/${page}.html`;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,7 +1,33 @@
|
||||
function checkStatus(){
|
||||
var status = document.getElementById("status");
|
||||
sendCommand("", "ping").then(res => {
|
||||
if (res.code == 200) {
|
||||
status.classList.add("ready");
|
||||
status.classList.remove("error");
|
||||
document.getElementById("statusText").innerText = "Ready";
|
||||
} else {
|
||||
throw new Error("");
|
||||
}
|
||||
}).catch(err => {
|
||||
status.classList.add("error");
|
||||
status.classList.remove("ready");
|
||||
document.getElementById("statusText").innerText = "Error";
|
||||
})
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const sidebarItems = document.querySelector("#sidebar").children;
|
||||
|
||||
for (const item of sidebarItems) {
|
||||
item.onclick = (e) => switchPage(e.target.dataset.value)
|
||||
}
|
||||
})
|
||||
checkStatus();
|
||||
setInterval(() => {
|
||||
checkStatus();
|
||||
}, 30 * 1000 );
|
||||
document.getElementById("messageBox").onclick = (e) => {
|
||||
e.stopImmediatePropagation();
|
||||
}
|
||||
window.
|
||||
document.getElementById("content").style.height = "400px";
|
||||
})
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
async function sendCommand(payload) {
|
||||
async function sendCommand(payload, method="invoke", background=false) {
|
||||
const parent = window.parent
|
||||
return await parent.sendCommand(payload)
|
||||
return await parent.sendCommand(payload, method, background)
|
||||
}
|
||||
@ -9,7 +9,7 @@ function kickUser(username) {
|
||||
}
|
||||
|
||||
async function displayUserList() {
|
||||
const resp = await sendCommand('/list');
|
||||
const resp = await sendCommand('/list', 'invoke', true);
|
||||
|
||||
// Do some funky string stuff
|
||||
const dataArr = resp.payload.split('\n').map(x => x.trim()).filter(x => x.length > 0);
|
||||
|
||||
34
styles/cheat.css
Normal file
34
styles/cheat.css
Normal file
@ -0,0 +1,34 @@
|
||||
.container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.toolset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#panel {
|
||||
margin-left: 3em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-right: 3em;
|
||||
min-width: 30em;
|
||||
}
|
||||
|
||||
.commandGroup {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
hr.solid {
|
||||
border-top: 1px solid #bbb;
|
||||
margin-left: 1px;
|
||||
margin-right: 1px;
|
||||
margin-top: -5px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
@ -61,6 +61,13 @@ button:hover {
|
||||
padding: 20px;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
#status {
|
||||
font-size: 0.7em;
|
||||
display: inline-block;
|
||||
margin-left: 20em;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
@ -87,4 +94,81 @@ button:hover {
|
||||
#content {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dot {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.ready {
|
||||
color: lightgreen;
|
||||
}
|
||||
|
||||
.ready .dot {
|
||||
background-color: lightgreen;
|
||||
|
||||
}
|
||||
|
||||
.error {
|
||||
color: darkred;
|
||||
}
|
||||
|
||||
.error .dot {
|
||||
background-color: darkred;
|
||||
}
|
||||
|
||||
#message {
|
||||
position: absolute;
|
||||
background-color: #0000005b;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 100;
|
||||
top: 0px;
|
||||
transition: all ease-in 0.5s;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#messageBox {
|
||||
width: 300px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
background-color: #f2f3c6;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-radius: 25px;
|
||||
overflow: hidden;
|
||||
-webkit-box-shadow: 0px 0px 26px -9px rgba(0,0,0,0.83);
|
||||
box-shadow: 0px 0px 26px -9px rgba(0,0,0,0.83);
|
||||
}
|
||||
|
||||
#messageContent {
|
||||
margin-top: 0.2em;
|
||||
overflow-wrap: break-word;
|
||||
overflow-y: auto;
|
||||
margin-bottom: 0.2em;
|
||||
margin-left: 1em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.messageBoxTitle {
|
||||
width: 100%;
|
||||
height: 2em;
|
||||
padding-top:1em;
|
||||
text-align: center;
|
||||
|
||||
background: rgb(16,232,253);
|
||||
background: linear-gradient(180deg, rgba(16,232,253,1) 0%, rgba(16,248,253,0.5914959733893557) 70%, rgba(249,255,0,0) 100%);
|
||||
|
||||
}
|
||||
1
styles/picnic.css
Normal file
1
styles/picnic.css
Normal file
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user