`;
}
case "TUN":
case "WIREGUARD":
{
if (dloc.lat && dloc.lon && hloc.lat && hloc.lon) {
return `
${chostname}
${l.linkType}`;
}
case "DTD":
case "SUPER":
if (dloc.lat && dloc.lon && hloc.lat && hloc.lon) {
return `
`;
}
return `
${chostname} ${l.linkType}
`;
default:
return `
${chostname}
`;
}
});
neighbors.sort();
const todayStart = new Date().setHours(0, 0, 0, 0) / 1000;
const yesterdayStart = todayStart - 24 * 60 * 60;
const weekStart = todayStart - 7 * 24 * 60 * 60;
const t = new Date(d.lastseen * 1000);
const h = t.getHours();
const m = t.getMinutes();
const lastseen = `${h == 0 ? 12 : h > 12 ? h - 12 : h}:${m < 10 ? "0" + m : m}${h < 12 ? "am" : "pm"}`
const lines = `
${i.description ? "| Description | " + i.description.replace("°", "\u00B0") + " |
" : ""}
| Location | ${rloc.lat},${rloc.lon} |
${rf.antenna && rf.antenna.description ? "| Antenna | " + rf.antenna.description.replace("°", "\u00B0") + " |
" : ""}
${rf.polarization ? "| Polarization | " + rf.polarization + " |
" : ""}
${!isNaN(rf.azimuth) ? "| Azimuth | " + rf.azimuth + "° |
" : ""}
${!isNaN(rf.height) ? "| Height | " + rf.height + " m |
" : ""}
${!isNaN(rf.elevation) ? "| Elevation | " + rf.elevation + "° |
" : ""}
| Last seen | ${
d.lastseen > todayStart ? lastseen + " today" :
d.lastseen > yesterdayStart ? lastseen + " yesterday" :
d.lastseen > weekStart ? "The last 7 days" : "A long time ago..."
}
|
| RF Status | ${rf.status} |
${rf.status === 'on' ?
"| SSID | " + rf.ssid + " |
" +
"| Channel | " + rf.channel + " |
" +
"| Mode | " + getRfMode(rf.mode) + " |
" +
(!isNaN(rf.freq) ? "| Frequency | " + getFreqRange(rf.freq, rf.chanbw) + " |
" : "") +
"| Bandwidth | " + rf.chanbw + " MHz |
" +
"| MAC | " + d.interfaces[0].mac + " |
" : ""
}
| Hardware | ${i.hardware || ""} |
| Firmware | ${i.firmware_version || ""} |
| Neighbors | ${neighbors.join("") || " None "} |
`;
const pop = new maplibregl.Popup({
className: "description",
closeButton: false,
maxWidth: "500px",
focusAfterOpen: false,
anchor: "left",
offset: [ 8, -4 ]
}).setHTML(lines);
pop._channel = rf.channel;
return pop;
}
function createMeasurementTool() {
map.on("click", e => {
if (getMode() !== "measure") {
return;
}
const point = {
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [ e.lngLat.lng, e.lngLat.lat ]
},
properties: {}
};
switch (measurements.features.length) {
case 0:
case 1:
case 3:
measurements.features.length = 1;
measurements.features[0] = point;
map.getSource('measurement').setData(measurements);
break;
case 2:
measurements.features[2] = point;
map.getSource('measurement').setData(measurements);
break;
default:
break;
}
});
map.on("mousemove", e => {
if (getMode() !== "measure") {
return;
}
switch (measurements.features.length) {
case 1:
case 2:
const start = measurements.features[0].geometry.coordinates;
measurements.features[1] = {
type: 'Feature',
geometry: {
type: 'LineString',
coordinates: [ start, [ e.lngLat.lng, e.lngLat.lat ] ]
},
properties: {}
};
map.getSource('measurement').setData(measurements);
const bd = bearingAndDistance( [ start[1], start[0] ], [ e.lngLat.lat, e.lngLat.lng ] );
document.getElementById("mb").innerHTML = bd.bearing;
document.getElementById("md").innerHTML = bd.distance;
break;
default:
break;
}
});
document.addEventListener("keydown", e => {
if (e.key === "Escape" && getMode() === "measure") {
toggleMeasure();
}
});
}
function toggleMeasure() {
if (getMode() === "measure") {
setMode("normal");
}
else {
setMode("measure");
}
}
function createLinkTool() {
const size = 10;
map.on("click", e => {
if (getMode() === "measure" || e.originalEvent === lastMarkerClickEvent) {
return;
}
const features = map.queryRenderedFeatures([
[e.point.x - size / 2, e.point.y - size / 2],
[e.point.x + size / 2, e.point.y + size / 2]
], {
layers: [ "rfh", "rf9", "rf2", "rf3", "rf5", "tun", "xlink", "supertun", "longdtd" ]
});
if (features.length) {
const p = features[0].properties;
let details = "";
let pfrom = p.from;
let pto = p.to;
let from = nodes[pfrom];
if (from) {
let floc = getVirtualLatLon(from.data);
for (mac in from.data.link_info) {
let l = from.data.link_info[mac];
if (pto === canonicalHostname(l.hostname)) {
let to = nodes[pto];
let tloc = getVirtualLatLon(to && to.data);
const fname = canonicalHostname(from.data.node);
let hl = Object.values(to.data.link_info).find(info => canonicalHostname(info.hostname) === fname);
if (floc.lon > tloc.lon) {
const _pfrom = pfrom;
const _from = from;
const _floc = floc;
const _l = l;
pfrom = pto;
from = to;
floc = tloc;
l = hl;
pto = _pfrom;
to = _from;
tloc = _floc;
hl = _l;
}
let bd = null;
if (floc.lat && floc.lon && tloc.lat && tloc.lon) {
bd = bearingAndDistance([ floc.lat, floc.lon ], [ tloc.lat, tloc.lon ]);
}
switch (l.linkType || "X") {
case "RF":
let sigf = l ? l.signal - l.noise : '-';
if (isNaN(sigf)) {
sigf = '-';
}
let sigt = hl ? hl.signal - hl.noise : '-';
if (isNaN(sigt)) {
sigt = '-';
}
details = `
wireless link, channel ${from.data.meshrf.channel}, SNR ${sigf}/${sigt}${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
case "XLINK":
details = `
xlink${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
case "TUN":
details = `
legacy tunnel${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
case "WIREGUARD":
details = `
wireguard tunnel${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
case "SUPER":
details = `
supernode interconnect${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
case "DTD":
details = `
long distance device to device link${bd ? ", " + bd.distance + " miles" : ""}
`;
break;
default:
}
break;
}
}
}
openPopup();
linkPopup = new maplibregl.Popup({
className: "link-description",
closeButton: false,
maxWidth: "500px",
focusAfterOpen: false,
anchor: "bottom",
}).setHTML(`
${pfrom} ↔
${pto}${details}`);
linkPopup.setLngLat(e.lngLat);
linkPopup.addTo(map);
}
});
map.on("mousemove", e => {
if (getMode() === "measure") {
return;
}
if (!map.getSource("rf5")) {
return;
}
const features = map.queryRenderedFeatures([
[e.point.x - size / 2, e.point.y - size / 2],
[e.point.x + size / 2, e.point.y + size / 2]
], {
layers: [ "rfh", "rf9", "rf2", "rf3", "rf5", "tun", "xlink", "supertun", "longdtd" ]
});
if (features.length) {
map.getCanvas().style.cursor = "pointer";
}
else {
map.getCanvas().style.cursor = null;
}
});
}
function createFindTool() {
document.addEventListener("keydown", e => {
if (e.key === "Escape" && getMode() === "find") {
toggleFind();
}
});
}
function toggleFind() {
if (getMode() === "find") {
setMode("normal");
}
else {
setMode("find");
}
}
function findNode(name) {
name = canonicalHostname(name.trim());
if (nodes[name]) {
openPopup(name, 13);
toggleFind();
}
else if (config.geoapify) {
fetch(`https://api.geoapify.com/v1/geocode/search?text=${encodeURIComponent(name)}&apiKey=${config.geoapify}`, { method: "GET" })
.then(r => r.json())
.then(r => {
openPopup();
if (r.features[0].bbox) {
map.fitBounds(r.features[0].bbox, { speed: 1, maxZoom: 13 });
}
else {
map.flyTo({ center: r.features[0].geometry.coordinates, speed: 1, zoom: 13 });
}
toggleFind();
})
;
}
}
function start() {
const gps = (location.hash === "#here" && location.protocol === "https:" && navigator.geolocation && navigator.geolocation.getCurrentPosition);
if (!embed) {
document.getElementById("key").style.display = null;
document.getElementById("ctrl").style.display = null;
}
out.nodeInfo.forEach(node => {
nodes[canonicalHostname(node.data.node)] = node;
});
updateLinks();
countRadios();
updateKey();
updateChannels();
loadMap();
createMeasurementTool();
createLinkTool();
createFindTool();
if (typeof walk === "function") {
document.getElementById("ctrl-data").style.display = "none";
walk(() => {
if (!map.getSource("rf5")) {
return;
}
out.nodeInfo.forEach(node => {
const cname = canonicalHostname(node.data.node);
if (!nodes[cname]) {
nodes[cname] = node;
}
});
updateLinks();
countRadios();
updateKey();
updateChannels();
createMarkers();
updateMarkers();
updateSources();
});
}
if (gps) {
navigator.geolocation.getCurrentPosition(
pos => map.flyTo({ center: [ pos.coords.longitude, pos.coords.latitude ], speed: 1, zoom: 11 }),
_ => {},
{}
);
}
if (typeof idle === "function") {
idle();
}
}
window.addEventListener("load", start);