diff --git a/aprsd/flask.py b/aprsd/flask.py index 160d150..b4c15ae 100644 --- a/aprsd/flask.py +++ b/aprsd/flask.py @@ -170,7 +170,7 @@ def setup_logging(config, flask_app, loglevel, quiet): def init_flask(config, loglevel, quiet): flask_app = flask.Flask( "aprsd", - static_url_path="", + static_url_path="/static", static_folder="web/static", template_folder="web/templates", ) diff --git a/aprsd/web/static/css/index.css b/aprsd/web/static/css/index.css index 95e4c8a..829b781 100644 --- a/aprsd/web/static/css/index.css +++ b/aprsd/web/static/css/index.css @@ -74,3 +74,11 @@ footer { background-color: lightcoral; text-align: left; } + +.aprsd_1 { + background-image: url(/static/images/aprs-symbols-16-0.png); + background-repeat: no-repeat; + background-position: -160px -48px; + width: 16px; + height: 16px; +} diff --git a/aprsd/web/static/images/aprs-symbols-16-0.png b/aprsd/web/static/images/aprs-symbols-16-0.png new file mode 100644 index 0000000..81eec3d Binary files /dev/null and b/aprsd/web/static/images/aprs-symbols-16-0.png differ diff --git a/aprsd/web/static/images/aprs-symbols-16-1.png b/aprsd/web/static/images/aprs-symbols-16-1.png new file mode 100644 index 0000000..5af31d9 Binary files /dev/null and b/aprsd/web/static/images/aprs-symbols-16-1.png differ diff --git a/aprsd/web/static/images/aprs-symbols-64-0.png b/aprsd/web/static/images/aprs-symbols-64-0.png new file mode 100644 index 0000000..81eec3d Binary files /dev/null and b/aprsd/web/static/images/aprs-symbols-64-0.png differ diff --git a/aprsd/web/static/images/aprs-symbols-64-1.png b/aprsd/web/static/images/aprs-symbols-64-1.png new file mode 100644 index 0000000..5af31d9 Binary files /dev/null and b/aprsd/web/static/images/aprs-symbols-64-1.png differ diff --git a/aprsd/web/static/images/aprs-symbols-64-2.png b/aprsd/web/static/images/aprs-symbols-64-2.png new file mode 100644 index 0000000..1f940d4 Binary files /dev/null and b/aprsd/web/static/images/aprs-symbols-64-2.png differ diff --git a/aprsd/web/static/js/charts.js b/aprsd/web/static/js/charts.js index e2b3a7f..8490e7d 100644 --- a/aprsd/web/static/js/charts.js +++ b/aprsd/web/static/js/charts.js @@ -185,97 +185,4 @@ function update_stats( data ) { updateQuadData(message_chart, short_time, data["stats"]["messages"]["sent"], data["stats"]["messages"]["recieved"], data["stats"]["messages"]["ack_sent"], data["stats"]["messages"]["ack_recieved"]); updateDualData(email_chart, short_time, data["stats"]["email"]["sent"], data["stats"]["email"]["recieved"]); updateDualData(memory_chart, short_time, data["stats"]["aprsd"]["memory_peak"], data["stats"]["aprsd"]["memory_current"]); - - // Update the watch list - var watchdiv = $("#watchDiv"); - var html_str = '' - watchdiv.html('') - jQuery.each(data["stats"]["aprsd"]["watch_list"], function(i, val) { - html_str += '' - }); - html_str += "
HAM CallsignAge since last seen by APRSD
' + i + '' + val["last"] + '
"; - watchdiv.append(html_str); -} - - -function update_packets( data ) { - var packetsdiv = $("#packetsDiv"); - //nuke the contents first, then add to it. - if (size_dict(packet_list) == 0 && size_dict(data) > 0) { - packetsdiv.html('') - } - jQuery.each(data, function(i, val) { - if ( packet_list.hasOwnProperty(val["ts"]) == false ) { - // Store the packet - packet_list[val["ts"]] = val; - ts_str = val["ts"].toString(); - ts = ts_str.split(".")[0]*1000; - var d = new Date(ts).toLocaleDateString("en-US") - var t = new Date(ts).toLocaleTimeString("en-US") - if (val.hasOwnProperty('from') == false) { - from = val['fromcall'] - title_id = 'title_tx' - } else { - from = val['from'] - title_id = 'title_rx' - } - var from_to = d + " " + t + "    " + from + " > " - - if (val.hasOwnProperty('addresse')) { - from_to = from_to + val['addresse'] - } else if (val.hasOwnProperty('tocall')) { - from_to = from_to + val['tocall'] - } else if (val.hasOwnProperty('format') && val['format'] == 'mic-e') { - from_to = from_to + "Mic-E" - } - - from_to = from_to + "  -  " + val['raw'] - - json_pretty = Prism.highlight(JSON.stringify(val, null, '\t'), Prism.languages.json, 'json'); - pkt_html = '
' + from_to + '
' + json_pretty + '

' - packetsdiv.prepend(pkt_html); - } - }); - - $('.ui.accordion').accordion('refresh'); - - // Update the count of messages shown - cnt = size_dict(packet_list); - console.log("packets list " + cnt) - $('#packets_count').html(cnt); - - const html_pretty = Prism.highlight(JSON.stringify(data, null, '\t'), Prism.languages.json, 'json'); - $("#packetsjson").html(html_pretty); -} - - -function start_update() { - - (function statsworker() { - $.ajax({ - url: "/stats", - type: 'GET', - dataType: 'json', - success: function(data) { - update_stats(data); - }, - complete: function() { - setTimeout(statsworker, 10000); - } - }); - })(); - - (function packetsworker() { - $.ajax({ - url: "/packets", - type: 'GET', - dataType: 'json', - success: function(data) { - update_packets(data); - }, - complete: function() { - setTimeout(packetsworker, 10000); - } - }); - })(); } diff --git a/aprsd/web/static/js/main.js b/aprsd/web/static/js/main.js new file mode 100644 index 0000000..9d3f930 --- /dev/null +++ b/aprsd/web/static/js/main.js @@ -0,0 +1,143 @@ +// watchlist is a dict of ham callsign => symbol, packets +var watchlist = {}; + +function aprs_img(item, x_offset, y_offset) { + var x = x_offset * -16; + if (y_offset > 5) { + y_offset = 5; + } + var y = y_offset * -16; + var loc = x + 'px '+ y + 'px' + item.css('background-position', loc); +} + +function show_aprs_icon(item, symbol) { + var offset = ord(symbol) - 33; + var col = Math.floor(offset / 16); + var row = offset % 16; + //console.log("'" + symbol+"' off: "+offset+" row: "+ row + " col: " + col) + aprs_img(item, row, col); +} + +function ord(str){return str.charCodeAt(0);} + + +function update_watchlist( data ) { + // Update the watch list + var watchdiv = $("#watchDiv"); + var html_str = '' + watchdiv.html('') + jQuery.each(data["stats"]["aprsd"]["watch_list"], function(i, val) { + html_str += '' + }); + html_str += "
HAM CallsignAge since last seen by APRSD
' + i + '' + val["last"] + '
"; + watchdiv.append(html_str); + + jQuery.each(watchlist, function(i, val) { + //update the symbol + var call_img = $('#callsign_'+i); + show_aprs_icon(call_img, val['symbol']) + }); +} + +function update_watchlist_from_packet(callsign, val) { + if (!watchlist.hasOwnProperty(callsign)) { + watchlist[callsign] = { + "symbol": '[', + "packets": {}, + } + } else { + if (val.hasOwnProperty('symbol')) { + //console.log("Updating symbol for "+callsign + " to "+val["symbol"]) + watchlist[callsign]["symbol"] = val["symbol"] + } + } + if (watchlist[callsign]["packets"].hasOwnProperty(val['ts']) == false) { + watchlist[callsign]["packets"][val['ts']]= val; + } + //console.log(watchlist) +} + +function update_packets( data ) { + var packetsdiv = $("#packetsDiv"); + //nuke the contents first, then add to it. + if (size_dict(packet_list) == 0 && size_dict(data) > 0) { + packetsdiv.html('') + } + jQuery.each(data, function(i, val) { + update_watchlist_from_packet(val['from'], val); + if ( packet_list.hasOwnProperty(val["ts"]) == false ) { + // Store the packet + packet_list[val["ts"]] = val; + ts_str = val["ts"].toString(); + ts = ts_str.split(".")[0]*1000; + var d = new Date(ts).toLocaleDateString("en-US") + var t = new Date(ts).toLocaleTimeString("en-US") + if (val.hasOwnProperty('from') == false) { + from = val['fromcall'] + title_id = 'title_tx' + } else { + from = val['from'] + title_id = 'title_rx' + } + var from_to = d + " " + t + "    " + from + " > " + + if (val.hasOwnProperty('addresse')) { + from_to = from_to + val['addresse'] + } else if (val.hasOwnProperty('tocall')) { + from_to = from_to + val['tocall'] + } else if (val.hasOwnProperty('format') && val['format'] == 'mic-e') { + from_to = from_to + "Mic-E" + } + + from_to = from_to + "  -  " + val['raw'] + + json_pretty = Prism.highlight(JSON.stringify(val, null, '\t'), Prism.languages.json, 'json'); + pkt_html = '
' + from_to + '
' + json_pretty + '

' + packetsdiv.prepend(pkt_html); + } + }); + + $('.ui.accordion').accordion('refresh'); + + // Update the count of messages shown + cnt = size_dict(packet_list); + //console.log("packets list " + cnt) + $('#packets_count').html(cnt); + + const html_pretty = Prism.highlight(JSON.stringify(data, null, '\t'), Prism.languages.json, 'json'); + $("#packetsjson").html(html_pretty); +} + + +function start_update() { + + (function statsworker() { + $.ajax({ + url: "/stats", + type: 'GET', + dataType: 'json', + success: function(data) { + update_stats(data); + update_watchlist(data); + }, + complete: function() { + setTimeout(statsworker, 10000); + } + }); + })(); + + (function packetsworker() { + $.ajax({ + url: "/packets", + type: 'GET', + dataType: 'json', + success: function(data) { + update_packets(data); + }, + complete: function() { + setTimeout(packetsworker, 10000); + } + }); + })(); +} diff --git a/aprsd/web/templates/index.html b/aprsd/web/templates/index.html index d77d762..44ce2f6 100644 --- a/aprsd/web/templates/index.html +++ b/aprsd/web/templates/index.html @@ -12,10 +12,11 @@ - - - - + + + + +