128 lines
4.7 KiB
HTML
128 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>{{station_call}} Status</title>
|
|
|
|
<!-- Leaflet's CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
|
|
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
|
|
crossorigin=""/>
|
|
<!-- Make sure you put this AFTER Leaflet's CSS -->
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
|
|
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
|
|
crossorigin=""></script>
|
|
|
|
<style>
|
|
table, th, td {
|
|
border: 1px solid black;
|
|
}
|
|
#map { height: 250px; }
|
|
.leaflet-tooltip.my-labels {
|
|
background-color: transparent;
|
|
border: transparent;
|
|
box-shadow: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div style="width: 100%; overflow: hidden;">
|
|
<div style="width: 50%; float: left;">
|
|
|
|
<h1>{{station_call}} Status</h1>
|
|
Station location: {{station_lat}}, {{station_lon}}
|
|
|
|
<h2> About </h2>
|
|
This is a work in progress. See <a href="https://amiok.net/gitea/W1CDN/aprs_tool">https://amiok.net/gitea/W1CDN/aprs_tool</a> for usage.
|
|
</div>
|
|
<div style="margin-left: 50%;">
|
|
<div id="map"></div>
|
|
<script>
|
|
var map = L.map('map').setView([{{station_lat}}, {{station_lon}}], 10);
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '© <a href=\"https://www.openstreetmap.org/copyright\">OpenStreetMap</a> contributors'}).addTo(map);
|
|
|
|
//{{markers|safe}}
|
|
|
|
// Show station location
|
|
var station = L.marker([{{station_lat}}, {{station_lon}}]).addTo(map).bindTooltip('{{station_call}}', {permanent: true}).openTooltip();
|
|
|
|
// Show GeoJSON of markers
|
|
var group = L.geoJSON({{geojs|safe}},
|
|
{
|
|
style: function (feature) {
|
|
return {color: feature.properties.color};
|
|
}
|
|
});
|
|
|
|
// group.bindTooltip(function (layer) {
|
|
// return 'Object '+layer.feature.properties.object_name+' from '+layer.feature.properties.from;
|
|
// }, {permanent: false}).openTooltip().addTo(map);
|
|
// Hacked together from https://gis.stackexchange.com/a/246919
|
|
var pointLayer = L.geoJSON(null, {
|
|
pointToLayer: function(feature,latlng){
|
|
//(true condition) ? "true" : "false"
|
|
label = (feature.properties.object_name === null) ? String(feature.properties.from) : String(feature.properties.object_name)
|
|
//label = String('Object '+feature.properties.object_name+' from '+feature.properties.from) // Must convert to string, .bindTooltip can't use straight 'feature.properties.attribute'
|
|
return new L.CircleMarker(latlng, {
|
|
radius: 1,
|
|
}).bindTooltip(label, {permanent: true, opacity: 0.7, className: "my-labels"}).openTooltip();
|
|
}
|
|
});
|
|
pointLayer.addData({{geojs|safe}});
|
|
map.addLayer(pointLayer);
|
|
|
|
|
|
// Zoom to show all
|
|
map.fitBounds(group.getBounds().pad(0.3));
|
|
</script>
|
|
</div>
|
|
</div>
|
|
|
|
<h2> Recent RF Packets </h2>
|
|
<table>
|
|
<tr>
|
|
<th> from </th>
|
|
<th> object_name </th>
|
|
<th> raw </th>
|
|
<th> created (utc) </th>
|
|
<th> relative </th>
|
|
<th> more </th>
|
|
</tr>
|
|
{% for i in frames %}
|
|
<tr>
|
|
<td> <a href="https://digi.w1cdn.net/aprs_api/packets?from={{ i['from'] }}">{{ i['from'] }}</a> </td>
|
|
<td> {{ i['object_name'] }} </td>
|
|
<td> {{ i['raw'] }} </td>
|
|
<td> {{ i['created'] }} </td>
|
|
<td> {{ i['time_ago'] }} </td>
|
|
<td> <a href="https://digi.w1cdn.net/aprs_api/packets?id={{ i['id'] }}">query</a>,
|
|
<a href="https://aprs.fi/#!mt=roadmap&z=12&call=a%2F{{ i['from'] }}">aprs.fi</a></td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
|
|
|
|
|
|
<h2> Recent Stations </h2>
|
|
<table>
|
|
<tr>
|
|
<th> from </th>
|
|
<th> last heard (utc) </th>
|
|
<th> relative </th>
|
|
<th> count </th>
|
|
<th> more </th>
|
|
</tr>
|
|
{% for i in stations %}
|
|
<tr>
|
|
<td> <a href="https://digi.w1cdn.net/aprs_api/packets?from={{ i['from'] }}">{{ i['from'] }}</a> </td>
|
|
<td> {{ i['last_heard'] }} </td>
|
|
<td> {{ i['time_ago'] }} </td>
|
|
<td> {{ i['count']}} </td>
|
|
<td> <a href="https://aprs.fi/#!mt=roadmap&z=12&call=a%2F{{ i['from'] }}">aprs.fi</a></td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
|
|
</body>
|
|
</html>
|