Sync stable Changes with development

-NSA and SA stats now show correctly
-Entware is now considered out of BETA
-ttyd installation process improved
-Added install option for speedtest and fast CLI commands

Co-Authored-By: Russel Yasol <73575327+dr-dolomite@users.noreply.github.com>
This commit is contained in:
iamromulan
2024-03-26 01:57:29 -04:00
parent 36e3ff1da3
commit c01c9e88e0
11 changed files with 447 additions and 124 deletions

View File

@@ -9,6 +9,7 @@
<script src="/js/alpinejs.min.js" defer></script>
<link rel="stylesheet" href="/css/bulma.css" />
<link rel="stylesheet" type="text/css" href="/css/admin.css" />
<link rel="stylesheet" href="styles.css" />
</head>
<body>
@@ -36,6 +37,7 @@
<a class="navbar-item" href="/"> Connection Info </a>
<a class="navbar-item" href="/atcommander.html"> AT Commands </a>
<a class="navbar-item" href="/ttl.html"> TTL Changer </a>
<a class="navbar-item" href="/speedtest.html"> Speedtest </a>
</div>
</div>
</div>
@@ -120,23 +122,40 @@
</header>
<div class="card-content">
<div class="content">
<!-- <div class="field" style="margin-bottom: 1rem">
<div
class="field"
style="margin-bottom: 1rem"
x-data="atCommands()"
>
<p class="control">
<button
class="button is-danger"
click="sendRebootCommand()"
:disabled="isRebootClicked"
@click="sendRebootCommand()"
:disabled="isRebooting"
>
Reboot
</button>
</p>
</div> -->
<!-- Loading modal -->
<div x-show="isRebooting" class="modal-overlay">
<div class="loading-modal">
<div class="spinner"></div>
<div class="loading-text" style="display: flex; flex-direction: column;">
<h3>Rebooting...</h3>
<p style="margin-top: 0.5rem;">Please wait for
<span x-text="countdown" style="font-weight: 500;"></span> seconds before
refreshing the page.</p>
</div>
</div>
</div>
</div>
<!-- Add your useful commands content here -->
<p>Here are some useful commands:</p>
<ul>
<li>
See https://github.com/iamromulan/RM520N-GL#at-commands for
<!-- Open to another tab -->
See <a href="https://github.com/iamromulan/RM520N-GL#at-commands" target="_blank" style="cursor: pointer;">https://github.com/iamromulan/RM520N-GL#at-commands</a> for
more
</li>
<li>AT+CFUN=1,1 (reboot)</li>
@@ -245,15 +264,25 @@
</div>
</div>
</div>
<!-- END Useful Commands Section -->
<script>
function atCommands() {
return {
isLoading: false,
isRebooting: false,
countdown: 40, // Total waiting time in seconds
atcmd: null,
defaultAtCommand: "ATI",
atCommandResponse: "",
sendAtCommand() {
if (!this.atcmd) {
// Use ATI as default command
this.atcmd = "ATI";
console.log(
"AT Command is empty, using ATI as default command: ",
this.atcmd
);
}
this.isLoading = true;
fetch(
"/cgi-bin/get_atcommand?" +
@@ -275,29 +304,35 @@
clearResponses() {
this.atCommandResponse = "";
},
sendRebootCommand() {
this.atcmd = "AT+CFUN=1,1";
this.isRebooting = true;
console.log("Reboot command sent: ", this.atcmd);
fetch(
"/cgi-bin/get_atcommand?" +
new URLSearchParams({
atcmd: this.atcmd,
})
)
.then((res) => {
return res.text();
})
.then((data) => {
this.atCommandResponse =
"Rebooting... Please wait a few seconds before refreshing the page.";
})
.finally(() => {
let timer = setInterval(() => {
this.countdown--;
if (this.countdown <= 0) {
clearInterval(timer);
this.isRebooting = false;
}
}, 1000); // Update countdown every second
});
},
};
}
function sendRebootCommand() {
var isRebootClicked = true;
console.log("Reboot command triggered");
var atcmd = "AT+CFUN=1,1";
fetch(
"/cgi-bin/get_atcommand?" +
new URLSearchParams({
atcmd: atcmd,
})
)
.then((res) => {
return res.text();
})
.then((data) => {
console.log(data); // Logging the response for debugging purposes
})
.catch((error) => {
console.error("Error:", error);
});
}
</script>
</body>
</html>

View File

@@ -16,8 +16,8 @@ fi
MYATCMD=$(printf '%b\n' "${atcmd//%/\\x}")
if [ -n "${MYATCMD}" ]; then
x=$(urldecode "$atcmd")
# Initialize wait time to 2 seconds
wait_time=2
# Initialize wait time to 1 second
wait_time=1000
while true; do
runcmd=$(echo -en "$x\r\n" | microcom -t $wait_time /dev/ttyOUT2)
# Check if "OK" or "ERROR" is present in the response

View File

@@ -37,6 +37,7 @@
<a class="navbar-item" href="/"> Connection Info </a>
<a class="navbar-item" href="/atcommander.html"> AT Commands </a>
<a class="navbar-item" href="/ttl.html"> TTL Changer </a>
<a class="navbar-item" href="/speedtest.html"> Speedtest </a>
</div>
</div>
</div>
@@ -217,28 +218,65 @@
</div>
<script>
function getSignalData() {
function signalInfo() {
return {
csqData: {},
lastUpdate: new Date().toLocaleString(),
getcsq() {
fetch("/cgi-bin/get_csq")
.then((res) => res.json())
isLoading: false,
atcmd: 'AT+QSPN;+CEREG=2;+CEREG?;+CEREG=0;+C5GREG=2;+C5GREG?;+C5GREG=0;+CSQ;+QENG=\"servingcell\";+QRSRP;+QCAINFO;+QNWPREFCFG=\"mode_pref\";+QTEMP\r\n',
atCommandResponse: null,
refreshSignal() {
this.isLoading = true; // Set loading state to true before fetching data
fetch(
"/cgi-bin/get_atcommand?" +
new URLSearchParams({
atcmd: this.atcmd,
})
)
.then((res) => {
return res.text();
})
.then((data) => {
this.csqData = data;
this.lastUpdate = new Date(
data.LASTUPDATE * 1000
).toLocaleString();
this.atCommandResponse = data;
// Split the response into individual messages
const messages = data.trim().split("\n\n");
// Convert the messages into a JSON file
//TODO: Add the JSON conversion here
// Log the parsed messages array as JSON to the console
console.log(JSON.stringify(parsedMessages, null, 2));
})
.catch((error) => {
console.error("Something went wrong", error);
})
.finally(() => {
this.isLoading = false; // Set loading state to false after fetching data
});
},
init() {
this.getcsq();
setInterval(() => {
this.getcsq();
}, 30000);
},
};
}
function getSignalData() {
return {
csqData: {},
lastUpdate: new Date().toLocaleString(),
getcsq() {
fetch("/cgi-bin/get_csq")
.then((res) => res.json())
.then((data) => {
this.csqData = data;
this.lastUpdate = new Date(
data.LASTUPDATE * 1000
).toLocaleString();
});
},
init() {
this.getcsq();
setInterval(() => {
this.getcsq();
}, 30000);
},
};
}
</script>
</body>
</html>

View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Speedtest</title>
<script src="/js/alpinejs.min.js" defer></script>
<link rel="stylesheet" href="/css/bulma.css" />
<link rel="stylesheet" type="text/css" href="/css/admin.css" />
</head>
<body>
<!-- START NAV -->
<nav class="navbar is-black" x-data="{ isOpen: false }">
<div
class="container"
>
<div class="navbar-brand">
<a class="navbar-item brand-text" href="/"> Simple Admin </a>
<a
role="button"
class="navbar-burger burger"
@click="isOpen = !isOpen"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div
id="navMenu"
class="navbar-menu"
:class="isOpen ? 'is-active' : ''"
>
<div class="navbar-start">
<a class="navbar-item" href="/"> Connection Info </a>
<a class="navbar-item" href="/atcommander.html"> AT Commands </a>
<a class="navbar-item" href="/ttl.html"> TTL Changer </a>
<a class="navbar-item" href="/speedtest.html"> Speedtest </a>
</div>
</div>
</div>
</nav>
<!-- END NAV -->
<div class="container">
<!--OST Widget code start-->
<div style="text-align: right">
<div style="min-height: 360px">
<div
style="
width: 100%;
height: 0;
padding-bottom: 50%;
position: relative;
"
>
<iframe
style="
border: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 360px;
border: none;
overflow: hidden !important;
"
src="//openspeedtest.com/speedtest"
></iframe>
</div>
</div>
</div>
<!-- OST Widget code end -->
</div>
</body>
</html>

View File

@@ -0,0 +1,41 @@
.modal-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1000;
display: flex;
justify-content: center;
align-items: center;
}
.loading-modal {
background-color: #fff;
padding: 20px;
border-radius: 10px;
text-align: center;
}
.spinner {
border: 4px solid rgba(0, 0, 0, 0.1);
border-left-color: #333;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
margin: 0 auto 10px auto;
}
.loading-text {
font-size: 18px;
color: #333;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}

View File

@@ -30,8 +30,9 @@
<div id="navMenu" class="navbar-menu" :class="isOpen ? 'is-active' : ''">
<div class="navbar-start">
<a class="navbar-item" href="/"> Connection Info </a>
<a class="navbar-item" href="/atcommander.html"> AT Commands </a>
<a class="navbar-item" href="/ttl.html"> TTL Changer </a>
<a class="navbar-item" href="/atcommander.html"> AT Commands </a>
<a class="navbar-item" href="/ttl.html"> TTL Changer </a>
<a class="navbar-item" href="/speedtest.html"> Speedtest </a>
</div>
</div>
@@ -52,16 +53,17 @@
<div class="card-content">
<div class="content">
<p>
<h2>TTL Status</h2> <br>
TTL is <span class="tag is-large" :class="ttldata.isEnabled ? 'is-success' : 'is-danger'" x-text="ttldata.isEnabled == true ? 'ON' : 'OFF'"></span>
<br />
TTL Set to <span x-text="ttldata.ttl"></span>
<h2>TTL Status</h2> <br>
TTL is <span class="tag is-large"
:class="ttldata.isEnabled ? 'is-success' : 'is-danger'"
x-text="ttldata.isEnabled == true ? 'ON' : 'OFF'"></span>
<br />
TTL Set to <span x-text="ttldata.ttl"></span>
</p>
<div class="field">
<label class="label">Set TTL</label>
<div class="control">
<input class="input" type="number" placeholder="64"
x-model="newTTL">
<input class="input" type="number" placeholder="64" x-model="newTTL">
</div>
</div>
<div class="field">
@@ -124,4 +126,5 @@
}
</script>
</body>
</html>