threading frontend implementation

This commit is contained in:
Jakob Ketterl 2020-04-19 22:10:32 +02:00
parent 32bd1bb4aa
commit 4287387a5e
5 changed files with 129 additions and 24 deletions

View File

@ -924,37 +924,23 @@ img.openwebrx-mirror-img
display: inline-block;
}
#openwebrx-panel-wsjt-message,
#openwebrx-panel-packet-message,
#openwebrx-panel-pocsag-message
{
.openwebrx-message-panel {
height: 180px;
}
#openwebrx-panel-wsjt-message tbody,
#openwebrx-panel-packet-message tbody,
#openwebrx-panel-pocsag-message tbody
{
.openwebrx-message-panel tbody {
display: block;
overflow: auto;
height: 150px;
width: 100%;
}
#openwebrx-panel-wsjt-message thead tr,
#openwebrx-panel-packet-message thead tr,
#openwebrx-panel-pocsag-message thead tr
{
.openwebrx-message-panel thead tr {
display: block;
}
#openwebrx-panel-wsjt-message th,
#openwebrx-panel-wsjt-message td,
#openwebrx-panel-packet-message th,
#openwebrx-panel-packet-message td,
#openwebrx-panel-pocsag-message th,
#openwebrx-panel-pocsag-message td
{
.openwebrx-message-panel th,
.openwebrx-message-panel td {
width: 50px;
text-align: left;
padding: 1px 3px;
@ -973,6 +959,25 @@ img.openwebrx-mirror-img
width: 70px;
}
#openwebrx-panel-js8-message .message {
width: 470px;
max-width: 470px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
direction: rtl;
text-aligh: left;
}
#openwebrx-panel-js8-message .decimal {
text-align: right;
width: 35px;
}
#openwebrx-panel-js8-message .decimal.freq {
width: 70px;
}
#openwebrx-panel-packet-message .message {
width: 410px;
max-width: 410px;

View File

@ -32,6 +32,7 @@
<script src="static/lib/ProgressBar.js"></script>
<script src="static/lib/Measurement.js"></script>
<script src="static/lib/FrequencyDisplay.js"></script>
<script src="static/lib/Js8Threads.js"></script>
<link rel="stylesheet" type="text/css" href="static/lib/nanoscroller.css" />
<link rel="stylesheet" type="text/css" href="static/css/openwebrx.css" />
<meta charset="utf-8">
@ -67,7 +68,7 @@
</div>
</div>
</div>
<table class="openwebrx-panel" id="openwebrx-panel-wsjt-message" style="display: none; width: 619px;" data-panel-name="wsjt-message">
<table class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-wsjt-message" style="display: none; width: 619px;" data-panel-name="wsjt-message">
<thead><tr>
<th>UTC</th>
<th class="decimal">dB</th>
@ -77,7 +78,15 @@
</tr></thead>
<tbody></tbody>
</table>
<table class="openwebrx-panel" id="openwebrx-panel-packet-message" style="display: none; width: 619px;" data-panel-name="aprs-message">
<table class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-js8-message" style="display:none; width: 619px;" data-panel-name="js8-message">
<thead><tr>
<th>UTC</th>
<th class="decimal freq">Freq</th>
<th class="message">Message</th>
</tr></thead>
<tbody></tbody>
</table>
<table class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-packet-message" style="display: none; width: 619px;" data-panel-name="aprs-message">
<thead><tr>
<th>UTC</th>
<th class="callsign">Callsign</th>
@ -86,7 +95,7 @@
</tr></thead>
<tbody></tbody>
</table>
<table class="openwebrx-panel" id="openwebrx-panel-pocsag-message" style="display: none; width: 619px;" data-panel-name="pocsag-message">
<table class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-pocsag-message" style="display: none; width: 619px;" data-panel-name="pocsag-message">
<thead><tr>
<th class="address">Address</th>
<th class="message">Message</th>

86
htdocs/lib/Js8Threads.js Normal file
View File

@ -0,0 +1,86 @@
Js8Thread = function(el){
this.messages = [];
this.el = el;
}
Js8Thread.prototype.getAverageFrequency = function(){
var total = this.messages.map(function(message){
return message.freq;
}).reduce(function(t, f){
return t + f;
}, 0);
return total / this.messages.length;
}
Js8Thread.prototype.pushMessage = function(message) {
this.messages.push(message);
this.render();
}
Js8Thread.prototype.render = function() {
this.el.html(
'<td>' + this.renderTimestamp(this.getLatestTimestamp()) + '</td>' +
'<td class="decimal freq">' + Math.round(this.getAverageFrequency()) + '</td>' +
'<td class="message">' + this.renderMessages() + '</td>'
);
}
Js8Thread.prototype.getLatestTimestamp() {
return this.messages(this.messages.length - 1).timestamp;
}
Js8Thread.prototype.renderMessages = function() {
res = []
for (var i = 0; i < this.messages.length; i++) {
var msg = this.messages[i];
if (msg.thread_type & 1) {
res.push('[ ');
} else if (i > 0 && msg.timestamp - this.messages[i - 1].timestamp > 15000) {
res.push(' ... ');
}
res.push(msg.msg);
if (msg.thread_type & 2) {
res.push(' ]');
}
}
return res.join('');
}
Js8Thread.prototype.renderTimestamp = function(timestamp) {
var t = new Date(timestamp);
var pad = function (i) {
return ('' + i).padStart(2, "0");
};
return pad(t.getUTCHours()) + pad(t.getUTCMinutes()) + pad(t.getUTCSeconds());
}
Js8Threader = function(el){
this.threads = [];
this.tbody = $(el).find('tbody');
console.info(this.tbody);
};
Js8Threader.prototype.findThread = function(freq) {
var matching = this.threads.filter(function(thread) {
return Math.abs(thread.getAverageFrequency() - freq) <= 5;
});
return matching[0] || false;
}
Js8Threader.prototype.pushMessage = function(message) {
var thread = this.findThread(message.freq);
if (!thread) {
var line = $("<tr></tr>")
this.tbody.append(line);
var thread = new Js8Thread(line);
this.threads.push(thread);
}
thread.pushMessage(message);
}
$.fn.js8 = function() {
if (!this.data('threader')) {
this.data('threader', new Js8Threader(this));
}
return this.data('threader');
}

View File

@ -1132,8 +1132,10 @@ function on_ws_recv(evt) {
case "metadata":
update_metadata(json['value']);
break;
case "wsjt_message":
case "js8_message":
$("#openwebrx-panel-js8-message").js8().pushMessage(json['value']);
break;
case "wsjt_message":
update_wsjt_panel(json['value']);
break;
case "dial_frequencies":
@ -2047,7 +2049,8 @@ function demodulator_digital_replace(subtype) {
demodulator_buttons_update();
$('#openwebrx-panel-digimodes').attr('data-mode', subtype);
toggle_panel("openwebrx-panel-digimodes", true);
toggle_panel("openwebrx-panel-wsjt-message", ['ft8', 'wspr', 'jt65', 'jt9', 'ft4', 'js8'].indexOf(subtype) >= 0);
toggle_panel("openwebrx-panel-wsjt-message", ['ft8', 'wspr', 'jt65', 'jt9', 'ft4'].indexOf(subtype) >= 0);
toggle_panel("openwebrx-panel-js8-message", subtype == "js8");
toggle_panel("openwebrx-panel-packet-message", subtype === "packet");
toggle_panel("openwebrx-panel-pocsag-message", subtype === "pocsag");
updateHash();
@ -2141,6 +2144,7 @@ function secondary_demod_close_window() {
toggle_panel("openwebrx-panel-wsjt-message", false);
toggle_panel("openwebrx-panel-packet-message", false);
toggle_panel("openwebrx-panel-pocsag-message", false);
toggle_panel("openwebrx-panel-js8-message", false);
}
function secondary_demod_waterfall_add(data) {

View File

@ -341,6 +341,7 @@ class OpenWebRxReceiverClient(Client):
"db": frame.db,
"dt": frame.dt,
"freq": freq + frame.freq,
"thread_type": frame.thread_type
}})