Merge pull request #50 from dr-dolomite/development-socat

NSA Mode Bandwidth Parsing and SMS Layout Fixes
This commit is contained in:
Cameron Thompson
2024-05-11 23:14:10 -04:00
committed by GitHub
3 changed files with 293 additions and 291 deletions

View File

@@ -925,9 +925,10 @@
// Calculate the LTE bandwidth // Calculate the LTE bandwidth
this.bandwidth = this.bandwidth =
"UL " +
this.calculate_lte_bw(lte_bw_ul) + this.calculate_lte_bw(lte_bw_ul) +
" MHz, " + " MHz / " +
"NR " + "DL " +
this.calculate_lte_bw(lte_bw_dl) + this.calculate_lte_bw(lte_bw_dl) +
" MHz"; " MHz";
@@ -1003,7 +1004,7 @@
// Calculate the NR bandwidth // Calculate the NR bandwidth
this.bandwidth += this.bandwidth +=
" / " + this.calculate_nr_bw(nr_bw).toString() + " MHz"; " / NR " + this.calculate_nr_bw(nr_bw).toString() + " MHz";
// Parse the PCIs // Parse the PCIs
this.pcc_pci = lines[28].split(",")[5].replace(/"/g, ""); this.pcc_pci = lines[28].split(",")[5].replace(/"/g, "");

View File

@@ -589,7 +589,7 @@
this.prefNetwork = settings.prefNetwork; this.prefNetwork = settings.prefNetwork;
this.nrModeControl = settings.nrModeControl; this.nrModeControl = settings.nrModeControl;
this.bands = settings.bands; this.bands = settings.bands;
}); })
}, },
lockSelectedBands() { lockSelectedBands() {
// Get the updated this.currentNetworkMode = selectedMode; and this.updatedLockedBands = newCheckedValues; // Get the updated this.currentNetworkMode = selectedMode; and this.updatedLockedBands = newCheckedValues;

View File

@@ -1,301 +1,302 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" data-bs-theme="light"> <html lang="en" data-bs-theme="light">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Simple Admin</title> <title>Simple Admin</title>
<!-- <link <!-- <link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
rel="stylesheet" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous" crossorigin="anonymous"
/> --> /> -->
<!-- Import all the bootstrap css files from css folder --> <!-- Import all the bootstrap css files from css folder -->
<link rel="stylesheet" href="css/styles.css" /> <link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/bootstrap.min.css" /> <link rel="stylesheet" href="css/bootstrap.min.css" />
<!-- Logo --> <!-- Logo -->
<link rel="simpleadmin-logo" href="favicon.ico"> <link rel="simpleadmin-logo" href="favicon.ico">
<!-- Import BootStrap Javascript --> <!-- Import BootStrap Javascript -->
<script src="js/bootstrap.bundle.min.js"></script> <script src="js/bootstrap.bundle.min.js"></script>
<script src="js/alpinejs.min.js" defer></script> <script src="js/alpinejs.min.js" defer></script>
<script src="js/auth.js"></script> <script src="js/auth.js"></script>
</head> </head>
<body onload="isAuthenticated()"> <body onload="isAuthenticated()">
<main> <main>
<div class="container my-4" x-data="fetchSMS()"> <div class="container my-4" x-data="fetchSMS()">
<nav class="navbar navbar-expand-lg mt-2"> <nav class="navbar navbar-expand-lg mt-2">
<div class="container-fluid"> <div class="container-fluid">
<a class="navbar-brand" href="/" <a class="navbar-brand" href="/"
><span class="mb-0 h4">Simple Admin</span></a ><span class="mb-0 h4">Simple Admin</span></a
> >
<button <button
class="navbar-toggler" class="navbar-toggler"
type="button" type="button"
data-bs-toggle="collapse" data-bs-toggle="collapse"
data-bs-target="#navbarText" data-bs-target="#navbarText"
aria-controls="navbarText" aria-controls="navbarText"
aria-expanded="false" aria-expanded="false"
aria-label="Toggle navigation" aria-label="Toggle navigation"
> >
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarText"> <div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav me-auto mb-2 ml-4 mb-lg-0"> <ul class="navbar-nav me-auto mb-2 ml-4 mb-lg-0">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="/">Home</a> <a class="nav-link" href="/">Home</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="/network.html">Simple Network</a> <a class="nav-link" href="/network.html">Simple Network</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="/settings.html">Simple Settings</a> <a class="nav-link" href="/settings.html">Simple Settings</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a <a
class="nav-link active" class="nav-link active"
href="/sms.html" href="/sms.html"
aria-current="page" aria-current="page"
>SMS</a >SMS</a
> >
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="/console">Console</a> <a class="nav-link" href="/console">Console</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="/deviceinfo.html" <a class="nav-link" href="/deviceinfo.html"
>Device Information</a >Device Information</a
> >
</li> </li>
</ul> </ul>
<span class="navbar-text"> <span class="navbar-text">
<button class="btn btn-link text-reset" id="darkModeToggle"> <button class="btn btn-link text-reset" id="darkModeToggle">
Dark Mode Dark Mode
</button> </button>
</span> </span>
</div> </div>
</div> </div>
</nav> </nav>
<div class="row mt-5 mb-4">
<div class="col">
<div class="card">
<div class="card-header">SMS Manager</div>
<div class="card-body">
<div class="card-text">
<div class="col">
<div
style="
max-height: 400px;
overflow-y: scroll;
overflow-x: hidden;
"
>
<table class="table table-hover border-success">
<tbody>
<div class="card-subtitle" x-show="isLoading">
<h4>Fetching SMS...</h4>
</div>
<!-- Only show template if isLoading is False -->
<template x-if="messages.length === 0 && isLoading === false" >
<div>
<p>Message Empty</p>
</div>
</template>
<template
x-for="(message, index) in messages"
:key="index"
>
<tr class="">
<td>
<div class="row column-gap-1 mb-2">
<div class="col-md-3">
<p x-text="'Sender: ' + senders[index]"></p>
</div>
<div class="col">
<p
x-text="'Date and Time: ' + dates[index]"
></p>
</div>
</div>
<div class="col-md-9">
<p x-text="message"></p>
</div>
</td>
</tr>
</template>
</tbody>
</table>
</div>
</div>
<form>
<!-- <div class="col-md-4 my-4">
<label for="PhoneNumber" class="form-label"
>Send SMS</label
>
<input
type="text"
class="form-control"
placeholder="Phone Number"
aria-label="Phone Number"
x-model="phoneNumber"
/>
</div> -->
<div class="row mt-5 mb-4"> <!-- <div class="col-md-8 mb-3">
<div class="col">
<div class="card"> <textarea
<div class="card-header">SMS Manager</div> class="form-control"
<div class="card-body"> id="smsInputBox"
<div class="card-text"> rows="5"
<div class="col"> placeholder="Enter SMS here (!!!CURRENTLY UNDER DEVELOPMENT!!!)"
<div x-model="messageToSend"
style=" ></textarea>
max-height: 400px; </div> -->
overflow-y: scroll; </form>
overflow-x: hidden; </div>
" </div>
> <div class="card-footer">
<table class="table table-hover border-success"> <div
<tbody> class="d-grid gap-2 d-md-flex justify-content-md-start"
<div class="card-subtitle" x-show="isLoading"> >
<h4>Fetching SMS...</h4> <!-- <button class="btn btn-primary me-md-2" type="button" @click="sendSMS()" :disabled="true" >
</div> Send SMS
<!-- Only show template if isLoading is False --> </button> -->
<template x-if="messages.length === 0 && isLoading === false" > <button
<div> class="btn btn-success"
<p>Message Empty</p> type="button"
</div> @click="init()"
</template> >
<template Refresh
x-for="(message, index) in messages" </button>
:key="index" <button
> class="btn btn-danger"
<tr class=""> type="button"
<td> @click="deleteAllSMS()"
<div class="row column-gap-1 mb-2"> >
<div class="col-md-3"> Delete All SMS
<p x-text="'Sender: ' + senders[index]"></p> </button>
</div> </div>
<div class="col"> </div>
<p </div>
x-text="'Date and Time: ' + dates[index]" </div>
></p> </div>
</div> </div>
</div> </main>
<div class="col-md-9"> <script src="js/dark-mode.js"></script>
<p x-text="message"></p> <script>
</div> function fetchSMS() {
</td> return {
</tr> isLoading: false,
</template> atCommandResponse: "",
</tbody> messageToSend: "",
</table> phoneNumber: "",
</div> messages: [],
</div> senders: [],
<form> dates: [],
<div class="col-md-4 my-4"> requestSMS() {
<label for="PhoneNumber" class="form-label" this.isLoading = true;
>Send SMS</label this.atCommandResponse = "Loading...";
> // Expect a text response from the server
<input fetch("/cgi-bin/get_sms")
type="text" .then((response) => response.text())
class="form-control" .then((data) => {
placeholder="Phone Number" this.isLoading = false;
aria-label="Phone Number" this.atCommandResponse = data;
x-model="phoneNumber" })
/> .finally(() => {
</div> this.parseSMSData(this.atCommandResponse);
});
},
<div class="col-md-8 mb-3"> parseSMSData(data) {
<!-- Text Area Here for SMS Input --> const cmglRegex =
<textarea /^\s*\+CMGL:\s*(\d+),"[^"]*","([^"]*)"[^"]*,"([^"]*)"/gm;
class="form-control"
id="smsInputBox"
rows="5"
placeholder="Enter SMS here (!!!CURRENTLY UNDER DEVELOPMENT!!!)"
x-model="messageToSend"
></textarea>
</div>
<div
class="d-grid gap-2 d-md-flex justify-content-md-start"
>
<button class="btn btn-primary me-md-2" type="button" @click="sendSMS()" :disabled="true" >
Send SMS
</button>
<button
class="btn btn-success"
type="button"
@click="init()"
>
Refresh
</button>
<button
class="btn btn-danger"
type="button"
@click="deleteAllSMS()"
>
Delete All SMS
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<script src="js/dark-mode.js"></script>
<script>
function fetchSMS() {
return {
isLoading: false,
atCommandResponse: "",
messageToSend: "",
phoneNumber: "",
messages: [],
senders: [],
dates: [],
requestSMS() {
this.isLoading = true;
this.atCommandResponse = "Loading...";
// Expect a text response from the server
fetch("/cgi-bin/get_sms")
.then((response) => response.text())
.then((data) => {
this.isLoading = false;
this.atCommandResponse = data;
})
.finally(() => {
this.parseSMSData(this.atCommandResponse);
});
},
parseSMSData(data) { let match;
const cmglRegex = while ((match = cmglRegex.exec(data)) !== null) {
/^\s*\+CMGL:\s*(\d+),"[^"]*","([^"]*)"[^"]*,"([^"]*)"/gm; const index = parseInt(match[1]);
const sender = match[2];
let date = match[3];
let match; // remove +32 from the date
while ((match = cmglRegex.exec(data)) !== null) { date = date.replace("+32", "");
const index = parseInt(match[1]);
const sender = match[2];
let date = match[3];
// remove +32 from the date // Find the start and end positions of the message
date = date.replace("+32", ""); const startIndex = cmglRegex.lastIndex;
let endIndex = data.indexOf("+CMGL:", startIndex + 1);
if (endIndex === -1) {
// If no more +CMGL lines, set end index to end of string
endIndex = data.length;
}
// Find the start and end positions of the message // Extract the message from start to end index
const startIndex = cmglRegex.lastIndex; const message = data.substring(startIndex, endIndex).trim();
let endIndex = data.indexOf("+CMGL:", startIndex + 1);
if (endIndex === -1) {
// If no more +CMGL lines, set end index to end of string
endIndex = data.length;
}
// Extract the message from start to end index this.messages.push(message);
const message = data.substring(startIndex, endIndex).trim(); this.senders.push(sender);
this.dates.push(date);
}
},
this.messages.push(message); deleteAllSMS() {
this.senders.push(sender); const atcmd = "AT+CMGD=,4";
this.dates.push(date); fetch(
} "/cgi-bin/get_atcommand?" +
}, new URLSearchParams({
atcmd: atcmd,
})
)
.then((response) => response.text())
.then((data) => {
console.log(data);
})
.finally(() => {
this.requestSMS();
});
},
deleteAllSMS() { sendSMS() {
const atcmd = "AT+CMGD=,4"; this.isLoading = true;
fetch( fetch(
"/cgi-bin/get_atcommand?" + "/cgi-bin/send_sms?" +
new URLSearchParams({ new URLSearchParams({
atcmd: atcmd, phone_number: this.phoneNumber,
}) message: this.messageToSend,
) })
.then((response) => response.text()) )
.then((data) => { .then((response) => response.text())
console.log(data); .then((data) => {
}) console.log(data);
.finally(() => { })
this.requestSMS(); .catch((error) => {
}); console.error("Error:", error);
}, })
.finally(() => {
this.isLoading = false;
this.requestSMS();
});
},
sendSMS() { init() {
this.isLoading = true; // Send AT+CMGF=1 once to set the modem to text mode
fetch( const atcmd = "AT+CMGF=1";
"/cgi-bin/send_sms?" + fetch(
new URLSearchParams({ "/cgi-bin/get_atcommand?" +
phone_number: this.phoneNumber, new URLSearchParams({
message: this.messageToSend, atcmd: atcmd,
}) })
) )
.then((response) => response.text()) .then((response) => response.text())
.then((data) => { .then((data) => {
console.log(data); console.log(data);
}) })
.catch((error) => { .finally(() => {
console.error("Error:", error); this.requestSMS();
}) });
.finally(() => { },
this.isLoading = false; };
this.requestSMS(); }
}); </script>
}, </body>
init() {
// Send AT+CMGF=1 once to set the modem to text mode
const atcmd = "AT+CMGF=1";
fetch(
"/cgi-bin/get_atcommand?" +
new URLSearchParams({
atcmd: atcmd,
})
)
.then((response) => response.text())
.then((data) => {
console.log(data);
})
.finally(() => {
this.requestSMS();
});
},
};
}
</script>
</body>
</html> </html>