2023-06-24 11:17:53 -05:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< title > {{station_call}} Status< / title >
2024-01-15 17:04:13 -06:00
<!-- 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 >
2023-06-24 11:17:53 -05:00
< style >
table, th, td {
border: 1px solid black;
}
2024-01-15 17:04:13 -06:00
#map { height: 250px; }
2024-01-19 11:08:12 -06:00
.leaflet-tooltip.my-labels {
background-color: transparent;
border: transparent;
box-shadow: none;
}
2023-06-24 11:17:53 -05:00
< / style >
< / head >
< body >
2024-01-15 17:04:13 -06:00
< 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);
2023-08-26 16:23:55 -05:00
2024-01-15 17:04:13 -06:00
//{{markers|safe}}
// Show station location
2024-01-19 11:08:12 -06:00
var station = L.marker([{{station_lat}}, {{station_lon}}]).addTo(map).bindTooltip('{{station_call}}', {permanent: true}).openTooltip();
2024-01-15 17:04:13 -06:00
// Show GeoJSON of markers
var group = L.geoJSON({{geojs|safe}},
{
style: function (feature) {
return {color: feature.properties.color};
}
2024-01-19 11:08:12 -06:00
});
// 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);
2024-01-15 17:04:13 -06:00
// Zoom to show all
map.fitBounds(group.getBounds().pad(0.3));
< / script >
< / div >
< / div >
2023-06-24 11:17:53 -05:00
2023-07-09 11:22:23 -05:00
< h2 > Recent RF Packets < / h2 >
2024-11-20 19:56:21 -06:00
Query < a href = "{{path}}/packets?n=10" > 10< / a > | < a href = "{{path}}/packets?n=50" > 50< / a > | < a href = "{{path}}/packets?n=100" > 100< / a >
2023-06-24 11:17:53 -05:00
< table >
< tr >
< th > from < / th >
< th > object_name < / th >
2023-06-24 18:44:18 -05:00
< th > raw < / th >
2023-06-24 11:17:53 -05:00
< th > created (utc) < / th >
2023-08-26 16:05:09 -05:00
< th > relative < / th >
2023-06-24 11:17:53 -05:00
< th > more < / th >
< / tr >
2023-06-24 19:06:37 -05:00
{% for i in frames %}
2023-06-24 11:17:53 -05:00
< tr >
< td > < a href = "https://digi.w1cdn.net/aprs_api/packets?from={{ i['from'] }}" > {{ i['from'] }}< / a > < / td >
< td > {{ i['object_name'] }} < / td >
2023-06-24 18:44:18 -05:00
< td > {{ i['raw'] }} < / td >
2023-06-24 11:17:53 -05:00
< td > {{ i['created'] }} < / td >
2023-08-26 16:05:09 -05:00
< td > {{ i['time_ago'] }} < / td >
2023-06-27 21:43:14 -05:00
< 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 >
2023-06-24 11:17:53 -05:00
< / tr >
{% endfor %}
< / table >
2024-01-15 17:04:13 -06:00
2023-06-24 11:20:58 -05:00
< h2 > Recent Stations < / h2 >
2024-11-20 19:56:21 -06:00
Query < a href = "{{path}}/stations?n=10" > 10< / a > | < a href = "{{path}}/stations?n=50" > 50< / a > | < a href = "{{path}}/stations?n=100" > 100< / a >
2023-06-24 19:06:37 -05:00
< table >
< tr >
2023-06-24 21:30:05 -05:00
< th > from < / th >
< th > last heard (utc) < / th >
2023-08-26 16:05:09 -05:00
< th > relative < / th >
2023-06-24 21:30:05 -05:00
< th > count < / th >
2023-06-27 21:43:14 -05:00
< th > more < / th >
2023-06-24 19:06:37 -05:00
< / tr >
{% for i in stations %}
< tr >
2023-06-24 21:30:05 -05:00
< td > < a href = "https://digi.w1cdn.net/aprs_api/packets?from={{ i['from'] }}" > {{ i['from'] }}< / a > < / td >
2023-07-09 22:06:57 -05:00
< td > {{ i['last_heard'] }} < / td >
2023-08-26 16:05:09 -05:00
< td > {{ i['time_ago'] }} < / td >
2023-07-09 11:22:23 -05:00
< td > {{ i['count']}} < / td >
2023-06-27 21:43:14 -05:00
< td > < a href = "https://aprs.fi/#!mt=roadmap&z=12&call=a%2F{{ i['from'] }}" > aprs.fi< / a > < / td >
2023-06-24 19:06:37 -05:00
< / tr >
{% endfor %}
< / table >
2023-06-24 11:17:53 -05:00
< / body >
< / html >
