From c0ea503bf5d98f4522cf26e424ef73b8518e42b5 Mon Sep 17 00:00:00 2001
From: Marat Fayzullin <luarvique@gmail.com>
Date: Sat, 27 May 2023 00:04:42 -0400
Subject: [PATCH] Changing HTML stuff to accommodate generic paging display.

---
 htdocs/css/openwebrx.css       | 23 ++++++++++++++++-------
 htdocs/index.html              |  2 +-
 htdocs/lib/DemodulatorPanel.js |  2 +-
 htdocs/lib/MessagePanel.js     | 24 +++++++++++++-----------
 htdocs/openwebrx.js            |  4 ++--
 5 files changed, 33 insertions(+), 22 deletions(-)

diff --git a/htdocs/css/openwebrx.css b/htdocs/css/openwebrx.css
index db47dd0a..be4b8080 100644
--- a/htdocs/css/openwebrx.css
+++ b/htdocs/css/openwebrx.css
@@ -1198,23 +1198,32 @@ img.openwebrx-mirror-img
     white-space: pre;
 }
 
-#openwebrx-panel-flex-message {
+#openwebrx-panel-page-message {
     height: 310px;
 }
 
-#openwebrx-panel-flex-message tbody {
+#openwebrx-panel-page-message tbody {
     height: 280px;
 }
 
-#openwebrx-panel-flex-message .address {
-    width: 100px;
+#openwebrx-panel-page-message .address {
+    width: 120px;
     font-weight: bold;
     background-color: #fff;
+    text-align: center;
     color: #000;
 }
 
-#openwebrx-panel-flex-message .timestamp {
-    width: 486px;
+#openwebrx-panel-page-message .mode {
+    width: 120px;
+    font-weight: normal;
+    background-color: #fff;
+    text-align: center;
+    color: #000;
+}
+
+#openwebrx-panel-page-message .timestamp {
+    width: 346px;
     max-width: 486px;
     font-weight: bold;
     background-color: #fff;
@@ -1223,7 +1232,7 @@ img.openwebrx-mirror-img
     white-space: pre;
 }
 
-#openwebrx-panel-flex-message .message {
+#openwebrx-panel-page-message .message {
     width: 566px;
     max-width: 566px;
     column-span: all;
diff --git a/htdocs/index.html b/htdocs/index.html
index 53e06b9f..60c7da94 100644
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -83,7 +83,7 @@
                 <div class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-js8-message" style="display:none; width: 619px;" data-panel-name="js8-message"></div>
                 <div class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-packet-message" style="display: none; width: 619px;" data-panel-name="aprs-message"></div>
                 <div class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-pocsag-message" style="display: none; width: 619px;" data-panel-name="pocsag-message"></div>
-                <div class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-flex-message" style="display: none; width: 619px;" data-panel-name="flex-message"></div>
+                <div class="openwebrx-panel openwebrx-message-panel" id="openwebrx-panel-page-message" style="display: none; width: 619px;" data-panel-name="page-message"></div>
                 <div class="openwebrx-panel openwebrx-meta-panel" id="openwebrx-panel-metadata-m17" style="display: none;" data-panel-name="metadata-m17">
                     <div class="openwebrx-meta-slot">
                         <div class="openwebrx-meta-user-image">
diff --git a/htdocs/lib/DemodulatorPanel.js b/htdocs/lib/DemodulatorPanel.js
index 85feee0f..9814fe24 100644
--- a/htdocs/lib/DemodulatorPanel.js
+++ b/htdocs/lib/DemodulatorPanel.js
@@ -166,7 +166,7 @@ DemodulatorPanel.prototype.updatePanels = function() {
     toggle_panel("openwebrx-panel-js8-message", modulation == "js8");
     toggle_panel("openwebrx-panel-packet-message", ["packet", "ais"].indexOf(modulation) >= 0);
     toggle_panel("openwebrx-panel-pocsag-message", modulation === "pocsag");
-    toggle_panel("openwebrx-panel-flex-message", modulation === "flex");
+    toggle_panel("openwebrx-panel-page-message", modulation === "page");
     toggle_panel("openwebrx-panel-sstv-message", modulation === "sstv");
     toggle_panel("openwebrx-panel-fax-message", modulation === "fax");
 
diff --git a/htdocs/lib/MessagePanel.js b/htdocs/lib/MessagePanel.js
index 04aac284..5ca2e2dd 100644
--- a/htdocs/lib/MessagePanel.js
+++ b/htdocs/lib/MessagePanel.js
@@ -270,29 +270,30 @@ $.fn.pocsagMessagePanel = function() {
     return this.data('panel');
 };
 
-FlexMessagePanel = function(el) {
+PageMessagePanel = function(el) {
     MessagePanel.call(this, el);
     this.initClearTimer();
+    this.modes = ['FLEX', 'POCSAG'];
 }
 
-FlexMessagePanel.prototype = new MessagePanel();
+PageMessagePanel.prototype = new MessagePanel();
 
-FlexMessagePanel.prototype.supportsMessage = function(message) {
-    return message['mode'] === 'FLEX';
+PageMessagePanel.prototype.supportsMessage = function(message) {
+    return this.modes.indexOf(message['mode']) >= 0;
 };
 
-FlexMessagePanel.prototype.render = function() {
+PageMessagePanel.prototype.render = function() {
     $(this.el).append($(
         '<table>' +
             '<thead><tr>' +
-                '<th>FLEX</th>' +
+                '<th>Paging</th>' +
             '</tr></thead>' +
             '<tbody></tbody>' +
         '</table>'
     ));
 };
 
-FlexMessagePanel.prototype.pushMessage = function(msg) {
+PageMessagePanel.prototype.pushMessage = function(msg) {
     var html_escape = function(input) {
         return $('<div/>').text(input).html()
     };
@@ -300,14 +301,15 @@ FlexMessagePanel.prototype.pushMessage = function(msg) {
     var $b = $(this.el).find('tbody');
     $b.append($(
         '<tr>' +
-            '<td class="address">' + msg.capcode + '</td>' +
+            '<td class="address">' + msg.address + '</td>' +
+            '<td class="mode">' + msg.mode + msg.baud + '</td>' +
             '<td class="timestamp">' + msg.timestamp + '</td>' +
         '</tr>'
     ));
 
     if (msg.hasOwnProperty('message')) {
         $b.append($(
-            '<tr><td class="message" colspan="2">' +
+            '<tr><td class="message" colspan="3">' +
             html_escape(msg.message) +
             '</td></tr>'
         ));
@@ -315,9 +317,9 @@ FlexMessagePanel.prototype.pushMessage = function(msg) {
     $b.scrollTop($b[0].scrollHeight);
 };
 
-$.fn.flexMessagePanel = function() {
+$.fn.pageMessagePanel = function() {
     if (!this.data('panel')) {
-        this.data('panel', new FlexMessagePanel(this));
+        this.data('panel', new PageMessagePanel(this));
     }
     return this.data('panel');
 };
diff --git a/htdocs/openwebrx.js b/htdocs/openwebrx.js
index b55aca09..3246d4f7 100644
--- a/htdocs/openwebrx.js
+++ b/htdocs/openwebrx.js
@@ -1169,7 +1169,7 @@ function on_ws_recv(evt) {
                             $("#openwebrx-panel-wsjt-message").wsjtMessagePanel(),
                             $('#openwebrx-panel-packet-message').packetMessagePanel(),
                             $('#openwebrx-panel-pocsag-message').pocsagMessagePanel(),
-                            $('#openwebrx-panel-flex-message').flexMessagePanel(),
+                            $('#openwebrx-panel-page-message').pageMessagePanel(),
                             $('#openwebrx-panel-sstv-message').sstvMessagePanel(),
                             $('#openwebrx-panel-fax-message').faxMessagePanel(),
                             $("#openwebrx-panel-js8-message").js8()
@@ -1844,7 +1844,7 @@ function secondary_demod_init() {
     $('#openwebrx-panel-wsjt-message').wsjtMessagePanel();
     $('#openwebrx-panel-packet-message').packetMessagePanel();
     $('#openwebrx-panel-pocsag-message').pocsagMessagePanel();
-    $('#openwebrx-panel-flex-message').flexMessagePanel();
+    $('#openwebrx-panel-page-message').pageMessagePanel();
     $('#openwebrx-panel-sstv-message').sstvMessagePanel();
     $('#openwebrx-panel-fax-message').faxMessagePanel();
     $('#openwebrx-panel-js8-message').js8();