Grasscutters/MojoFrontend
2
0
Fork 0
mirror of https://github.com/SpikeHD/MojoFrontend.git synced 2024-11-21 16:58:17 +00:00
Code Issues Projects Releases Wiki Activity

UI Refinement

Browse Source
This commit is contained in:
mingjun97 2022-05-04 18:16:56 -07:00
parent ca71310628
commit 99ee47fa85
5 changed files with 51 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
console.html
View File

@ -4,12 +4,13 @@
<link rel="stylesheet" type="text/css" href="styles/console.css" />
<script src="scripts/onload.js"></script>
<script src="scripts/console.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<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 id="status" class="ready"><span id="statusText">Ready</span><span class="dot"></span></div>
</div>
<div id="right">
<div id="sidebar">

31
scripts/console.js
View File

@ -10,17 +10,30 @@ async function sendCommand(payload, method="invoke", background=false, persisten
},
body: data,
})
let json = await response.json();
if (method == 'invoke' && !background) {
var m = json.payload.trim().replace(/\r/g, "").replace(/\n\n/g, "\n");
if(persistent == "auto") {
var m2 = m.replace(/\n/g, "");
persistent = (m.length - m2.length) > 3; // true more than 3 lines
try {
let json = await response.json();
try{
if (method == 'invoke' && !background) {
if (json.code != 200) throw Error('');
var m = json.payload.trim().replace(/\r/g, "").replace(/\n\n/g, "\n");
if(persistent == "auto") {
var m2 = m.replace(/\n/g, "");
persistent = (m.length - m2.length) > 3; // true more than 3 lines
}
message(`${m}`, null, persistent);
}
return json
} catch (e) {
var messages = `Request failed.`
if (json.code) {
messages += ` Code: ${json.message}`
}
message(messages, "fail", false);
}
message(`${m}`, null, persistent);
} catch (err) {
message("Connection issue.", "fail", false);
}
return json
}
function dismissMessage(){

3
scripts/onload.js
View File

@ -26,6 +26,7 @@ document.addEventListener("DOMContentLoaded", () => {
checkStatus();
}, 30 * 1000 );
// adjust frame height
setTimeout(() => {
var height = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
@ -34,5 +35,5 @@ document.addEventListener("DOMContentLoaded", () => {
content.style.height = height + "px";
message("Welcome to MojoConsolePlus!");
},10); // delay height modification to avoid issues
})

15
styles/cheat.css
View File

@ -7,14 +7,14 @@
.toolset {
display: flex;
flex-direction: column;
overflow-y: auto;
}
#panel {
margin-left: 3em;
display: flex;
flex-direction: column;
margin-right: 3em;
min-width: 30em;
min-width: 70vw;
overflow-y: auto;
}
@ -26,6 +26,17 @@
padding-right: 0.5em;
}
.commandGroup>*:last-child {
/* margin-left: auto; */
margin-right: 0.5em;
}
.commandGroup input{
/* margin-left: 1em; */
margin-right: 1em;
}
hr.solid {
border-top: 1px solid #bbb;
margin-left: 1px;

15
styles/console.css
View File

@ -57,7 +57,7 @@ button:hover {
}
#titleBar {
font-size: 3em;
font-size: 2em;
padding: 20px;
text-align: left;
font-weight: bold;
@ -66,8 +66,10 @@ button:hover {
#status {
font-size: 0.7em;
display: inline-block;
margin-left: 20em;
float: right;
margin-top: -1em;
display: flex;
align-items: center;
}
#sidebar {
@ -100,7 +102,9 @@ button:hover {
height: 20px;
width: 20px;
border-radius: 50%;
border: 2px solid grey;
display: inline-block;
margin-left: 3px;
}
.ready {
@ -152,6 +156,11 @@ button:hover {
height: fit-content;
}
.messageBox.fail {
background-color: #f65531;
}
.messageBox.initial {
transform: translateY(100%);
opacity: 0;