150 lines
5.4 KiB
HTML
150 lines
5.4 KiB
HTML
<head>
|
|
<title>WifiManager</title>
|
|
<script src="/public/jquery-3.3.1.min.js"></script>
|
|
<script src="/public/popper.min.js"></script>
|
|
<script src="/public/bootstrap.min.js"></script>
|
|
<link rel="stylesheet" href="/public/bootstrap.min.css">
|
|
<script>
|
|
/* global jQuery */
|
|
|
|
function getNetworks() {
|
|
jQuery("#status").html("Scanning...");
|
|
jQuery("#scanbutton").prop("disabled", true);
|
|
|
|
jQuery.getJSON("/rpc/scan", function(data) {
|
|
var knowncheck;
|
|
var prioritizecheck;
|
|
var disablepass;
|
|
var tclass;
|
|
|
|
jQuery("#networklist").children('tr').remove();
|
|
|
|
for (var n in data) {
|
|
var network = data[n]
|
|
console.log(network)
|
|
if (network.Encryption == "open") disablepass = "disabled";
|
|
else disablepass = "";
|
|
|
|
if (network.Known) knowncheck = " checked ";
|
|
else knowncheck = "";
|
|
|
|
if (network.Prioritize) prioritizecheck = " checked ";
|
|
else prioritizecheck = "";
|
|
|
|
if (network.Connected) {
|
|
tclass = "table-active";
|
|
jQuery("#status").html("Connected to " + network.SSID);
|
|
}
|
|
else {
|
|
tclass = "table-default";
|
|
}
|
|
|
|
jQuery("#networklisttable").find("tbody").append(
|
|
"<tr class='" + tclass + "'><td>" + network.SSID +
|
|
"</td><td>" + network.Signal + "%" +
|
|
"</td><td>" + network.Encryption +
|
|
"</td><td><input type='checkbox' " + knowncheck + " class='form-check-input' id='" + network.SSID + "_save'>" +
|
|
"</td><td><input type='checkbox' " + prioritizecheck + " class='form-check-input' id='" + network.SSID + "_prioritize'>" +
|
|
"</td><td><input type='text' " + disablepass + " id='" + network.SSID + "_password'>" +
|
|
"</td><td><button type='button' class='btn-primary' onClick='connect(\"" + network.SSID + "\")'>Connect</button>" +
|
|
"</td><td><button type='button' class='btn-danger' onClick='remove(\"" + network.SSID + "\")'>Delete</button>" +
|
|
"</td></tr>");
|
|
|
|
|
|
}
|
|
if (jQuery("#status").html()=="Scanning...") jQuery("#status").html("Not connected");
|
|
jQuery("#scanbutton").prop("disabled", false);
|
|
})
|
|
}
|
|
|
|
function remove(ssid) {
|
|
var qdata={};
|
|
qdata.ssid=ssid;
|
|
jQuery.post("/rpc/delete", qdata, getNetworks)
|
|
}
|
|
|
|
function connect(ssid) {
|
|
var pass = jQuery("#" + ssid + "_password").val();
|
|
var remember = jQuery("#" + ssid + "_save").is(":checked");
|
|
var prior = jQuery("#" + ssid + "_prioritize").is(":checked");
|
|
|
|
var qdata = {};
|
|
qdata.SSID = ssid;
|
|
qdata.Password = pass;
|
|
qdata.Remember = remember;
|
|
qdata.Prioritize = prior;
|
|
|
|
jQuery.post("/rpc/connect", qdata, connectresult);
|
|
jQuery("#status").html("Connecting...");
|
|
}
|
|
function connectresult(data) {
|
|
if (data!="Success") alert(data);
|
|
getNetworks();
|
|
}
|
|
function intervalscan() {
|
|
getNetworks();
|
|
}
|
|
jQuery(document).ready(getNetworks);
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<h1> Current status: <span id="status">Initializing</span></h1>
|
|
</div>
|
|
<!-- <div class="row">
|
|
<h2>Wan Details</h2>
|
|
<table class="table">
|
|
<tbody>
|
|
<tr>
|
|
<td>SSID</td>
|
|
<td id="details-ssid"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Signal</td>
|
|
<td id="details-signal"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>IP Address</td>
|
|
<td id="details-ipaddr"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Gateway</td>
|
|
<td id="details-gateway"></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
-->
|
|
<div class="row">
|
|
<h2>Available Networks</h2>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-12">
|
|
|
|
<table class="table" id="networklisttable">
|
|
<thead>
|
|
<th>SSID</th>
|
|
<th>Signal</th>
|
|
<th>Encryption</th>
|
|
<th>Known</th>
|
|
<th>Prioritize</th>
|
|
<th>Password</th>
|
|
<th>Connect</th>
|
|
<th>Delete</td>
|
|
</thead>
|
|
<tbody id="networklist">
|
|
|
|
</tbody>
|
|
</table>
|
|
<br> <button id="scanbutton" type="button" class="btn btn-primary" onClick="getNetworks()">Rescan</button><br>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- <div class="row">Re-scan interval: <input type="text" id="rescaninterval" value="10"> Seconds</div>
|
|
-->
|
|
</div>
|
|
</body>
|