update
This commit is contained in:
@@ -115,7 +115,7 @@ if ($type == "sara_APN") {
|
||||
$port=$_GET['port'];
|
||||
$timeout=$_GET['timeout'];
|
||||
$APN_address=$_GET['APN_address'];
|
||||
$command = '/usr/bin/python3 /var/www/moduleair_pro_4g/SARA/sara_setAPN.py ' . $port . ' ' . $APN_address . ' ' . $timeout;
|
||||
$command = '/usr/bin/python3 /var/www/nebuleair_pro_4g/SARA/sara_setAPN.py ' . $port . ' ' . $APN_address . ' ' . $timeout;
|
||||
$output = shell_exec($command);
|
||||
echo $output;
|
||||
}
|
||||
|
||||
@@ -55,6 +55,7 @@
|
||||
Status
|
||||
<span id="modem-status" class="badge">Loading...</span>
|
||||
</h3>
|
||||
|
||||
<div class="row mb-3">
|
||||
|
||||
<div class="col-sm-3">
|
||||
@@ -111,6 +112,7 @@
|
||||
</div>
|
||||
|
||||
<h3>Connexion 4G Network</h3>
|
||||
|
||||
<div class="row mb-3">
|
||||
|
||||
<div class="col-sm-6">
|
||||
@@ -118,6 +120,8 @@
|
||||
|
||||
<div class="card-body">
|
||||
<p class="card-text">Network scan. Attention: 2 min scan.</p>
|
||||
<p class="card-text">Orange FR (20801), SFR (20810), Bouygues (20820)</p>
|
||||
|
||||
<button class="btn btn-primary" onclick="getData_saraR4('ttyAMA2', 'AT+COPS=?', 120)">Scan</button>
|
||||
<div id="loading_ttyAMA2_AT_COPS__" class="spinner-border spinner-border-sm" style="display: none;" role="status"></div>
|
||||
<div id="response_ttyAMA2_AT_COPS__"></div>
|
||||
@@ -152,7 +156,8 @@
|
||||
<span class="input-group-text" id="inputGroup-sizing-sm">Address</span>
|
||||
<input type="text" id="messageInput_APN" class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-sm">
|
||||
</div>
|
||||
<button class="btn btn-primary" onclick="connectAPN_saraR4('ttyAMA2', document.getElementById('messageInput_APN').value, 5)">Connect</button>
|
||||
<button class="btn btn-primary" onclick="connectAPN_saraR4('ttyAMA2', document.getElementById('messageInput_APN').value, 5)">Set APN</button>
|
||||
|
||||
<button class="btn btn-secondary" onclick="getData_saraR4('ttyAMA2','AT+CGDCONT?', 5)">Get APN</button>
|
||||
|
||||
<div id="loading_ttyAMA2_APN" class="spinner-border spinner-border-sm" style="display: none;" role="status"></div>
|
||||
@@ -536,11 +541,12 @@ function getData_saraR4(port, command, timeout){
|
||||
}
|
||||
|
||||
function sendMessage_saraR4(port, endpoint){
|
||||
|
||||
console.log("Send message from SaraR4 (port "+port+" and endpoint "+endpoint+"):");
|
||||
|
||||
$("#loading_"+port+"_message_send").show();
|
||||
|
||||
$.ajax({
|
||||
$.ajax({
|
||||
url: 'launcher.php?type=sara_sendMessage&port='+port+'&endpoint='+encodeURIComponent(endpoint),
|
||||
//dataType: 'json', // Specify that you expect a JSON response
|
||||
method: 'GET', // Use GET or POST depending on your needs
|
||||
@@ -558,9 +564,12 @@ function getData_saraR4(port, command, timeout){
|
||||
}
|
||||
|
||||
function connectAPN_saraR4(port, APN_address, timeout){
|
||||
|
||||
console.log(" Set APN (port "+port+" and adress "+APN_address+"):");
|
||||
|
||||
$("#loading_"+port+"_APN").show();
|
||||
$.ajax({
|
||||
|
||||
$.ajax({
|
||||
url: 'launcher.php?type=sara_APN&port='+port+'&APN_address='+encodeURIComponent(APN_address)+'&timeout='+timeout,
|
||||
//dataType: 'json', // Specify that you expect a JSON response
|
||||
method: 'GET', // Use GET or POST depending on your needs
|
||||
|
||||
208
html/wifi.html
208
html/wifi.html
@@ -45,12 +45,68 @@
|
||||
|
||||
<div class="container-fluid mt-5">
|
||||
<div class="row">
|
||||
<aside class="col-md-2 col-lg-1 d-none d-md-block vh-100 position-fixed bg-dark text-white" id="sidebar">
|
||||
</aside>
|
||||
<aside class="col-md-2 col-lg-1 d-none d-md-block vh-100 position-fixed bg-dark text-white" id="sidebar">
|
||||
</aside>
|
||||
<!-- Main content -->
|
||||
<main class="col-md-9 ms-sm-auto col-lg-10 offset-md-3 offset-lg-2 px-md-4">
|
||||
<main class="col-md-10 ms-sm-auto col-lg-11 offset-md-2 offset-lg-1 px-md-4">
|
||||
<h1 class="mt-4">Connection WIFI</h1>
|
||||
<p>La connexion WIFI n'est pas obligatoire mais elle vous permet d'effectuer des mises à jour et d'activer le contrôle à distance.</p>
|
||||
|
||||
<h3>Status
|
||||
<span id="wifi-status" class="badge">Loading...</span>
|
||||
</h3>
|
||||
|
||||
<div class="row mb-3">
|
||||
|
||||
<div class="col-sm-4">
|
||||
<div class="card text-dark bg-light">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">WIFI / Ethernet</h5>
|
||||
<p class="card-text">General information.</p>
|
||||
<button class="btn btn-primary" onclick="get_internet()">Get Data</button>
|
||||
<table class="table table-striped-columns">
|
||||
<tbody id="data-table-body_internet_general"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-8">
|
||||
<div class="card text-dark bg-light">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Wifi Scan</h5>
|
||||
<p class="card-text">Scan des réseaux WIFI disponibles.</p>
|
||||
<button class="btn btn-primary" onclick="wifi_scan()">Scan</button>
|
||||
<table class="table">
|
||||
<tbody id="data-table-body_wifi_scan"></tbody>
|
||||
</table>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal WIFI PASSWORD -->
|
||||
<!-- filled with JS -->
|
||||
<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="myModalLabel">Modal title</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body" id="myModalBody">
|
||||
...
|
||||
</div>
|
||||
<div class="modal-footer" id="myModalFooter">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
@@ -64,6 +120,8 @@
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
console.log("DOMContentLoaded");
|
||||
|
||||
const elementsToLoad = [
|
||||
{ id: 'topbar', file: 'topbar.html' },
|
||||
{ id: 'sidebar', file: 'sidebar.html' },
|
||||
@@ -81,7 +139,151 @@
|
||||
})
|
||||
.catch(error => console.error(`Error loading ${file}:`, error));
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
function get_internet(){
|
||||
console.log("Getting internet general infos");
|
||||
$.ajax({
|
||||
url: 'launcher.php?type=internet',
|
||||
dataType: 'json', // Specify that you expect a JSON response
|
||||
method: 'GET', // Use GET or POST depending on your needs
|
||||
success: function(response) {
|
||||
console.log(response);
|
||||
let tableBody = document.getElementById('data-table-body_internet_general');
|
||||
tableBody.innerHTML = ''; // Clear existing table content
|
||||
|
||||
// Iterate through the data and create rows
|
||||
for (let key in response) {
|
||||
let row = `
|
||||
<tr>
|
||||
<td>${key}</td>
|
||||
<td>${response[key].connection}</td>
|
||||
<td>${response[key].IP ? response[key].IP : "No IP"}</td>
|
||||
</tr>
|
||||
`;
|
||||
tableBody.innerHTML += row; // Append row to table body
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error('AJAX request failed:', status, error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function wifi_connect(SSID, PASS){
|
||||
console.log("Connecting to wifi");
|
||||
console.log(SSID);
|
||||
console.log(PASS);
|
||||
if (typeof PASS === 'undefined') {
|
||||
console.log("Need to add password");
|
||||
//open bootstrap modal to ask for password
|
||||
var myModal = new bootstrap.Modal(document.getElementById('myModal'));
|
||||
//modifiy modal title
|
||||
document.getElementById('myModalLabel').innerHTML = "Enter password for "+SSID;
|
||||
//add input field to modal body
|
||||
document.getElementById('myModalBody').innerHTML = "<input type='text' id='wifi_pass' class='form-control' placeholder='Password'>";
|
||||
//add button to modal footer
|
||||
document.getElementById('myModalFooter').innerHTML = "<button type='button' class='btn btn-secondary' data-bs-dismiss='modal'>Close</button><button type='button' class='btn btn-primary' onclick='wifi_connect(\""+SSID+"\", document.getElementById(\"wifi_pass\").value)'>Se connecter</button>";
|
||||
myModal.show();
|
||||
} else {
|
||||
console.log("Will try to connect to "+SSID+" with password "+PASS);
|
||||
console.log("Start PHP script:");
|
||||
|
||||
$.ajax({
|
||||
url: 'launcher.php?type=wifi_connect&SSID='+SSID+'&pass='+PASS,
|
||||
dataType: 'text', // Specify that you expect a JSON response
|
||||
method: 'GET', // Use GET or POST depending on your needs
|
||||
success: function(response) {
|
||||
console.log(response);
|
||||
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error('AJAX request failed:', status, error);
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
function wifi_scan(){
|
||||
console.log("Scanning Wifi");
|
||||
$.ajax({
|
||||
url: 'launcher.php?type=wifi_scan',
|
||||
dataType: 'json', // Specify that you expect a JSON response
|
||||
method: 'GET', // Use GET or POST depending on your needs
|
||||
success: function(response) {
|
||||
console.log(response);
|
||||
const tableBody = document.getElementById("data-table-body_wifi_scan");
|
||||
|
||||
// Clear the existing table body
|
||||
tableBody.innerHTML = "";
|
||||
|
||||
// Loop through the wifiNetworks array and create rows
|
||||
response.forEach(network => {
|
||||
const row = document.createElement("tr");
|
||||
|
||||
// Create and append cells for SSID, BARS, and SIGNAL
|
||||
const ssidCell = document.createElement("td");
|
||||
// Truncate SSID to 25 characters
|
||||
const truncatedSSID = network.SSID.length > 20 ? network.SSID.substring(0, 20) + '...' : network.SSID;
|
||||
ssidCell.textContent = truncatedSSID;
|
||||
row.appendChild(ssidCell);
|
||||
|
||||
/*
|
||||
const signalCell = document.createElement("td");
|
||||
signalCell.textContent = network.SIGNAL;
|
||||
row.appendChild(signalCell);
|
||||
*/
|
||||
|
||||
// Create a button
|
||||
const buttonCell = document.createElement("td");
|
||||
const button = document.createElement("button");
|
||||
button.textContent = "Connect"; // Button text
|
||||
button.classList.add("btn", "btn-primary"); // Bootstrap button classes
|
||||
|
||||
// Determine button color based on SIGNAL value
|
||||
const signalValue = parseInt(network.SIGNAL, 10); // Assuming SIGNAL is a numeric value
|
||||
// Calculate color based on the signal strength
|
||||
let buttonColor;
|
||||
if (signalValue >= 100) {
|
||||
buttonColor = "success"; // Green for strong signal
|
||||
} else if (signalValue >= 50) {
|
||||
buttonColor = "warning"; // Yellow for moderate signal
|
||||
} else {
|
||||
buttonColor = "danger"; // Red for weak signal
|
||||
}
|
||||
// Add Bootstrap button classes along with color
|
||||
button.classList.add("btn", `btn-${buttonColor}`);
|
||||
|
||||
|
||||
//Trigger function as soon as the button is clicked
|
||||
button.addEventListener("click", () => wifi_connect(network.SSID));
|
||||
|
||||
|
||||
// Append the button to the button cell
|
||||
buttonCell.appendChild(button);
|
||||
row.appendChild(buttonCell);
|
||||
|
||||
// Append the row to the table body
|
||||
tableBody.appendChild(row);
|
||||
});
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error('AJAX request failed:', status, error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
function confirmSubmit() {
|
||||
// You can display a simple confirmation message or customize the behavior
|
||||
return confirm("Are you sure you want to connect to this Wi-Fi network?");
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user