mirror of
https://github.com/SpacehuhnTech/esp8266_deauther.git
synced 2025-12-11 17:19:58 +01:00
307 lines
8.6 KiB
JavaScript
307 lines
8.6 KiB
JavaScript
let nameJson = [];
|
|
let scanJson = {
|
|
aps: [],
|
|
stations: []
|
|
};
|
|
|
|
const drawScan = () => {
|
|
let html;
|
|
|
|
// Access Points
|
|
getE("apNum").innerHTML = scanJson.aps.length;
|
|
html = `
|
|
<tr>
|
|
<th class="id"></th>
|
|
<th class="ssid">SSID</th>
|
|
<th class="name">Name</th>
|
|
<th class="ch">Ch</th>
|
|
<th class="rssi">RSSI</th>
|
|
<th class="enc">Enc</th>
|
|
<th class="lock"></th>
|
|
<th class="mac">MAC</th>
|
|
<th class="vendor">Vendor</th>
|
|
<th class="selectColumn"></th>
|
|
<th class="remove"></th>
|
|
</tr>
|
|
`
|
|
|
|
scanJson.aps.forEach((item, index) => {
|
|
const selected = item[item.length - 1];
|
|
const width = parseInt(item[3]) + 130;
|
|
let color = '';
|
|
|
|
if (width < 50) color = "meter_red";
|
|
else if (width < 70) color = "meter_orange";
|
|
else color = "meter_green";
|
|
|
|
html += `
|
|
<tr ${selected ? "class='selected'>" : ""}>
|
|
<td class="id">${index}</td>
|
|
<td class="ssid">${esc(item[0])}</td>
|
|
<td class="name">
|
|
${item[1].length > 0 ? esc(item[1]) : `<button onclick="add(0, ${i})">lang("add")</button>`}
|
|
</td>
|
|
<td class="ch">${esc(item[2])}</td>"
|
|
<td class="rssi">
|
|
<div class="meter_background">
|
|
<div class="meter_forground ${color}" style="width: ${width}%;">
|
|
<div class="meter_value">
|
|
item[3]
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="enc">${esc(item[4])}</td>
|
|
<td class="lock">${item[4] === "-" ? "" : "🔒"}</td>
|
|
<td class="mac">${esc(item[5])}</td>
|
|
<td class="vendor">${esc(item[6])}</td>
|
|
<td class="selectColumn">
|
|
<label class="checkBoxContainer">
|
|
<input type="checkbox ${selected ? "checked" : ""}" onclick="selectRow(0, ${i}, ${selected})">
|
|
<span class="checkmark"></span>
|
|
</label>
|
|
</td>
|
|
<td class="remove">
|
|
<button class='red' onclick="remove(0, ${i})">X</button>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
})
|
|
|
|
getE("apTable").innerHTML = html;
|
|
|
|
// Stations
|
|
getE("stNum").innerHTML = scanJson.stations.length;
|
|
|
|
html = `
|
|
<tr>
|
|
<th class="id"></th>
|
|
<th class="vendor">Vendor</th>
|
|
<th class="mac">MAC</th>
|
|
<th class="ch">Ch</th>
|
|
<th class="name">Name</th>
|
|
<th class="pkts">Pkts</th>
|
|
<th class="ap">AP</th>
|
|
<th class="lastseen">Last seen</th>
|
|
<th class="selectColumn"></th>
|
|
<th class="remove"></th>
|
|
</tr>
|
|
`;
|
|
|
|
scanJson.stations.forEach((item, index) => {
|
|
const selected = item[item.length - 1];
|
|
const ap = item[5] >= 0 ? esc(scanJson.aps[item[5]][0]) : "";
|
|
|
|
html += `
|
|
<tr ${selected ? "class='selected'>" : ""}>
|
|
<td class="id">${i}</td>
|
|
<td class="vendor">${esc(item[3])}</td>
|
|
<td class="mac">${esc(item[0])}</td>
|
|
<td class="ch">${esc(item[1])}</td>
|
|
<td class="name">
|
|
${item[2].length > 0 ? esc(item[2]) : `<button onclick="add(1, ${index})">lang("add")</button>`}
|
|
</td>
|
|
<td class="pkts">${esc(item[4])}</td>
|
|
<td class="ap">${ap}</td>
|
|
<td class="lastseen">${esc(item[6])}</td>
|
|
<td class="selectColumn">
|
|
<label class="checkBoxContainer">
|
|
<input type="checkbox" ${selected ? "checked" : ""} onclick="selectRow(1, ${index}, ${selected})">
|
|
<span class="checkmark"></span>
|
|
</label>
|
|
</td>
|
|
<td class="remove">
|
|
<button class="red" onclick="remove(1, ${index})">X</button>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
})
|
|
|
|
getE("stTable").innerHTML = html;
|
|
}
|
|
|
|
const drawNames = () => {
|
|
getE("nNum").innerHTML = nameJson.length;
|
|
let html = `
|
|
<tr>
|
|
<th class="id"></th>
|
|
<th class="mac">MAC</th>
|
|
<th class="vendor">Vendor</th>
|
|
<th class="name">Name</th>
|
|
<th class="ap">AP-BSSID</th>
|
|
<th class="ch">Ch</th>
|
|
<th class="save"></th>
|
|
<th class="selectColumn"></th>
|
|
<th class="remove"></th>
|
|
</tr>`
|
|
|
|
nameJson.forEach((item, index) => {
|
|
const selected = item[item.length - 1];
|
|
|
|
html += `
|
|
<tr ${selected ? "class='selected'>" : ""}>
|
|
<td class="id">${index}</td>
|
|
<td class="mac" contentEditable="true" id="name_${index}_mac">${esc(item[0])}</td>
|
|
<td class="vendor">${esc(item[1])}</td>
|
|
<td class="name" contentEditable="true" id="name_${index}_name">${esc(item[2].substring(0,16))}</td>
|
|
<td class="ap" contentEditable="true" id="name_${index}_apbssid">${esc(item[3])}</td>
|
|
<td class="ch" contentEditable="true" id="name_${index}_ch">${esc(item[4])}</td>
|
|
<td class="save">
|
|
<button class="green" onclick="save(${index})">${lang("save")}</button>
|
|
</td>
|
|
<td class="selectColumn">
|
|
<label class="checkBoxContainer">
|
|
<input type="checkbox" ${selected ? "checked" : ""} onclick="selectRow(2, ${index}, ${selected})">
|
|
<span class="checkmark"></span>
|
|
</label>
|
|
</td>
|
|
<td class="remove">
|
|
<button class="red" onclick="remove(2, ${index})">X</button>
|
|
</td>
|
|
</tr>
|
|
`;
|
|
})
|
|
|
|
getE("nTable").innerHTML = html;
|
|
}
|
|
|
|
const scan = type => {
|
|
getFile(`run?cmd=scan ${type == 0 ? "aps" : "stations -t"} ${getE("scanTime").value}s -ch ${getE("ch").options[getE("ch").selectedIndex].value}`);
|
|
}
|
|
|
|
const load = () => {
|
|
// APs and Stations
|
|
getFile("run?cmd=save scan", () =>
|
|
getFile("scan.json", res => {
|
|
scanJson = JSON.parse(res);
|
|
drawScan();
|
|
})
|
|
);
|
|
|
|
// Names
|
|
getFile("run?cmd=save names", () =>
|
|
getFile("names.json", res => {
|
|
nameJson = JSON.parse(res);
|
|
drawNames();
|
|
})
|
|
);
|
|
}
|
|
|
|
const selectRow = (type, id, selected) => {
|
|
if (type === 0 || type === 1) {
|
|
scanJson.aps[id][7] = selected;
|
|
drawScan();
|
|
} else if (type === 2) {
|
|
save(id);
|
|
nameJson[id][5] = selected;
|
|
drawNames();
|
|
}
|
|
|
|
switch(type) {
|
|
case 0:
|
|
return getFile(`run?cmd=${selected ? "" : "de" } select ap ${id}`);
|
|
case 1:
|
|
return getFile(`run?cmd=${selected ? "" : "de" } select station ${id}`);
|
|
case 2:
|
|
return getFile(`run?cmd=${selected ? "" : "de" } select name ${id}`);
|
|
}
|
|
}
|
|
|
|
const remove = (type, id) => {
|
|
if (type === 0 || type === 1) {
|
|
scanJson.aps.splice(id, 1);
|
|
drawScan();
|
|
} else if (type === 2) {
|
|
nameJson.splice(id, 1);
|
|
drawNames();
|
|
}
|
|
|
|
switch(type) {
|
|
case 0:
|
|
getFile(`run?cmd=remove ap ${id}`);
|
|
break;
|
|
case 1:
|
|
getFile(`run?cmd=remove station ${id}`);
|
|
break;
|
|
case 2:
|
|
getFile(`run?cmd=remove name ${id}`);
|
|
}
|
|
}
|
|
|
|
const save = id => {
|
|
const mac = getE(`name_${id}_mac`).innerHTML.replace("<br>" ,"");
|
|
const name = getE(`name_${id}_name`).innerHTML.replace("<br>", "");
|
|
const apbssid = getE(`name_${id}_apbssid`).innerHTML.replace("<br>", "");
|
|
const ch = getE(`name_${id}_ch`).innerHTML.replace("<br>", "");
|
|
const changed = mac !== nameJson[id][0] || name !== nameJson[id][2] || apbssid !== nameJson[id][3] || ch !== nameJson[id][4];
|
|
|
|
if (changed) {
|
|
nameJson[id][0] = mac;
|
|
nameJson[id][2] = name;
|
|
nameJson[id][3] = apbssid;
|
|
nameJson[id][4] = ch;
|
|
|
|
if (nameJson[id][0].length !== 17) {
|
|
return showMessage("ERROR: MAC invalid");
|
|
}
|
|
|
|
getFile(`run?cmd=replace name ${id} -n "${nameJson[id][2]}" -m "${nameJson[id][0]}" -ch ${nameJson[id][4]} -b "${nameJson[id][3]}" ${nameJson[id][5] ? "-s" : ""}`);
|
|
|
|
drawNames();
|
|
}
|
|
}
|
|
|
|
const add = (type, id) => {
|
|
if(nameJson.length >= 25){
|
|
return showMessage("Device Name List is full!");
|
|
}
|
|
|
|
switch(type) {
|
|
case 0:
|
|
getFile(`run?cmd=add name "${scanJson.aps[id][0]}" -ap ${id}`);
|
|
scanJson.aps[id][1] = scanJson.aps[id][0]; // name = SSID
|
|
nameJson.push([scanJson.aps[id][5], scanJson.aps[id][6], scanJson.aps[id][0], "", scanJson.aps[id][2], false]);
|
|
drawScan();
|
|
break;
|
|
case 1:
|
|
getFile(`run?cmd=add name "${scanJson.stations[id][0]}" station ${id}`);
|
|
scanJson.stations[id][2] = `device_${nameJson.length}`; // name = device_
|
|
nameJson.push([scanJson.stations[id][0], scanJson.stations[id][3], `device_${nameJson.length}`, scanJson.aps[scanJson.stations[id][5]][5], scanJson.stations[id][1], false]);
|
|
drawScan();
|
|
break;
|
|
case 2:
|
|
getFile(`run?cmd=add name device_${nameJson.length} -m 00:00:00:00:00:00 -ch 1`);
|
|
nameJson.push(["00:00:00:00:00:00", "", `device_${nameJson.length}`, "", 1, false]);
|
|
drawNames();
|
|
}
|
|
|
|
drawNames();
|
|
}
|
|
|
|
const selectAll = (type, select) => {
|
|
switch(type) {
|
|
case 0:
|
|
getFile(`run?cmd=${select ? "" : "de"}select aps`);
|
|
scanJson.aps.forEach(item => {
|
|
item[7] = select;
|
|
return item
|
|
})
|
|
drawScan();
|
|
break;
|
|
case 1:
|
|
getFile(`run?cmd=${select ? "" : "de"}select stations`);
|
|
scanJson.stations.forEach(item => {
|
|
item[7] = select;
|
|
return item
|
|
})
|
|
drawScan();
|
|
break;
|
|
case 2:
|
|
getFile(`run?cmd=${select ? "" : "de"}select names`);
|
|
nameJson.stations.forEach(item => {
|
|
item[5] = select;
|
|
return item
|
|
})
|
|
drawNames();
|
|
}
|
|
} |