diff --git a/htdocs/css/openwebrx.css b/htdocs/css/openwebrx.css index 07de366..2997348 100644 --- a/htdocs/css/openwebrx.css +++ b/htdocs/css/openwebrx.css @@ -981,6 +981,7 @@ img.openwebrx-mirror-img .openwebrx-message-panel { height: 180px; + position: relative; } .openwebrx-message-panel tbody { diff --git a/htdocs/lib/MessagePanel.js b/htdocs/lib/MessagePanel.js index a46046d..a4c8b40 100644 --- a/htdocs/lib/MessagePanel.js +++ b/htdocs/lib/MessagePanel.js @@ -1,6 +1,7 @@ function MessagePanel(el) { this.el = el; this.render(); + this.initClearButton(); } MessagePanel.prototype.render = function() { @@ -14,17 +15,33 @@ MessagePanel.prototype.initClearTimer = function() { var me = this; if (me.removalInterval) clearInterval(me.removalInterval); me.removalInterval = setInterval(function () { - me.clearMessages(); + me.clearMessages(1000); }, 15000); -} +}; -MessagePanel.prototype.clearMessages = function() { +MessagePanel.prototype.clearMessages = function(toRemain) { var $elements = $(this.el).find('tbody tr'); // limit to 1000 entries in the list since browsers get laggy at some point - var toRemove = $elements.length - 1000; + var toRemove = $elements.length - toRemain; if (toRemove <= 0) return; $elements.slice(0, toRemove).remove(); -} +}; + +MessagePanel.prototype.initClearButton = function() { + var me = this; + me.clearButton = $( + '
Clear
' + ); + me.clearButton.css({ + position: 'absolute', + top: '10px', + right: '10px' + }); + me.clearButton.on('click', function() { + me.clearMessages(0); + }); + $(me.el).append(me.clearButton); +}; function WsjtMessagePanel(el) { MessagePanel.call(this, el); @@ -215,8 +232,8 @@ PocsagMessagePanel.prototype.pushMessage = function(msg) { var $b = $(this.el).find('tbody'); $b.append($( '' + - '' + msg.address + '' + - '' + msg.message + '' + + '' + msg.address + '' + + '' + msg.message + '' + '' )); $b.scrollTop($b[0].scrollHeight);