125 lines
No EOL
3.1 KiB
JavaScript
125 lines
No EOL
3.1 KiB
JavaScript
var addr = '';
|
|
var stop = false;
|
|
var portMap = {};
|
|
var portArray = [];
|
|
|
|
// Run, when page loadad
|
|
window.addEventListener('load', function() {
|
|
loadSavedPorts();
|
|
});
|
|
|
|
function delRow(id) {
|
|
document.getElementById(id).innerHTML = "";
|
|
}
|
|
|
|
function stopScan() {
|
|
stop = true;
|
|
}
|
|
|
|
async function scanAddr() {
|
|
let begin = document.getElementById("begin").value;
|
|
let end = document.getElementById("end").value;
|
|
let savedPorts = [];
|
|
|
|
if (begin == "") {
|
|
begin = 1
|
|
}
|
|
if (end == "") {
|
|
end = 65535
|
|
}
|
|
let port = {};
|
|
stop = false;
|
|
|
|
if (portMap != null) {
|
|
savedPorts = Object.keys(portMap);
|
|
}
|
|
// console.log("Saved ports:", savedPorts);
|
|
|
|
document.getElementById('stopBtn').style.visibility = "visible";
|
|
|
|
for (let i = begin ; i <= end; i++) {
|
|
|
|
if (stop) {
|
|
break;
|
|
}
|
|
|
|
let url = '/api/port/'+addr+'/'+i;
|
|
port = await (await fetch(url)).json();
|
|
|
|
document.getElementById("curPort").innerHTML = "Scanning port "+i;
|
|
|
|
if ((port.State) && (!savedPorts.includes(port.Port.toString()))) {
|
|
html = createHTML(port, '', true);
|
|
document.getElementById('tBody').insertAdjacentHTML('afterbegin', html);
|
|
}
|
|
}
|
|
|
|
document.getElementById('stopBtn').style.visibility = "hidden";
|
|
}
|
|
|
|
function createHTML(port, i, found) {
|
|
let state = ``;
|
|
let checked = ``;
|
|
let sup = ``;
|
|
|
|
if (found) {
|
|
sup = ` <sup style="background-color:var(--bs-danger);">new</sup>`;
|
|
}
|
|
|
|
if (port.Watch) {
|
|
checked = `checked`;
|
|
|
|
if (port.State) {
|
|
state = `<i class="bi bi-check-circle-fill" style="color:var(--bs-success);"></i>`;
|
|
} else {
|
|
state = `<i class="bi bi-dash-circle-fill" style="color:var(--bs-danger);"></i>`;
|
|
}
|
|
} else {
|
|
state = `<i class="bi bi-circle-fill" style="color:var(--bs-gray-500);"></i>`;
|
|
}
|
|
|
|
let html = `
|
|
<tr id="row${port.Port}">
|
|
<td style="opacity: 45%;">${i}.</td>
|
|
<td>
|
|
<input name="name" type="text" class="form-control" value="${port.Name}">
|
|
</td>
|
|
<td>
|
|
<a href="http://${addr}:${port.Port}">${port.Port}</a>${sup}
|
|
<input name="port" type="hidden" value="${port.Port}">
|
|
<input name="state" type="hidden" value="${port.State}">
|
|
</td>
|
|
<td>
|
|
${state}
|
|
</td>
|
|
<td>
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" value="${port.Port}" name="watch" ${checked}>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<a href="#" onclick="delRow('row${port.Port}')">
|
|
<i class="bi bi-x-circle"></i>
|
|
</a>
|
|
</td>
|
|
</tr>`;
|
|
|
|
return html;
|
|
}
|
|
|
|
async function loadSavedPorts() {
|
|
|
|
addr = document.getElementById("pageAddr").value;
|
|
|
|
let url = '/api/port/'+addr;
|
|
portMap = await (await fetch(url)).json();
|
|
if (portMap != null) {
|
|
portArray = Object.values(portMap);
|
|
}
|
|
|
|
displayArrayData(portArray); // sort.js
|
|
}
|
|
|
|
function sortBy(field) {
|
|
sortByAny(portArray, field); // sort.js
|
|
} |