refactor chat css into it's own css file, fix linting in gt.js start adding i18n in chat and bandactivity htmls

2021-10-19 20:57:05 -05:00 · 2021-10-19 20:57:05 -05:00 · 220fc036b8
commit 220fc036b8
--- a/package.nw/GridTracker.html
+++ b/package.nw/GridTracker.html
@ -31,7 +31,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 <html lang="en" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-    <title>GridTracker</title>
+    <title data-i18n="appname-title">GridTracker</title>
    <link rel="stylesheet" href="./lib/dp-dark.css" />
    <link rel="stylesheet" href="./lib/ol.css" />
    <link rel="stylesheet" href="./lib/style.css" />
@ -46,12 +46,10 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
    <script src="./lib/moment-timezone-with-data.js" type="text/javascript"></script>
    <script src="./lib/datepicker.js"></script>
    <script src="./lib/callsigns.js" type="text/javascript"></script>
-    <script
-            src="https://code.jquery.com/jquery-3.2.1.min.js"
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>
-    <script src="./lib/CLDRPluralRuleParser/src/CLDRPluralRuleParser.js"></script>
-    <!-- Source -->
+    <script src="./lib/CLDRPluralRuleParser.js"></script>
    <script src="./lib/jquery.i18n.js"></script>
    <script src="./lib/jquery.i18n.messagestore.js"></script>
    <script src="./lib/jquery.i18n.fallbacks.js"></script>
--- a/package.nw/gt_bandactivity.html
+++ b/package.nw/gt_bandactivity.html
@ -16,7 +16,7 @@
 <html lang="en" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-    <title>Band Activity</title>
+    <title data-i18n="bandactivity.title">Band Activity</title>
    <link rel="stylesheet" href="./lib/style.css" />
    <script src="./lib/protos.js" type="text/javascript"></script>
    <script src="./lib/screens.js" type="text/javascript"></script>
@ -70,7 +70,7 @@
      "
      title="PSK-Reporter Band Activity"
    >
-      <div id="graphDiv" style="bottom: 0; position: absolute; width: 100%; padding: 0px; margin-bottom: 2px">
+      <div data-i18n="bandactivity.noData" id="graphDiv" style="bottom: 0; position: absolute; width: 100%; padding: 0px; margin-bottom: 2px">
        <br />...no data yet...<br />
        &nbsp;
      </div>
--- a/package.nw/gt_chat.html
+++ b/package.nw/gt_chat.html
@ -15,117 +15,10 @@
 -->
 <html xmlns="http://www.w3.org/1999/xhtml" style="height: 100%; width: 100%">
  <head>
-    <title>Off-Air Message Service (OAMS)</title>
+    <title data-i18n="chat.title">Off-Air Message Service (OAMS)</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="./lib/style.css" />
-    <style type="text/css">
-      table,
-      th,
-      td,
-      body,
-      input {
-        color: #fff;
-        white-space: nowrap;
-        font-family: Sans-Serif;
-        font-size: 13px;
-        text-align: auto;
-      }
-      .boxDisplay {
-        margin: 1px;
-        padding: 2px;
-        border-width: 2px;
-        border-color: #aaa;
-        border-style: inset;
-        vertical-align: top;
-        -webkit-border-radius: 4px;
-      }
-      textarea {
-        width: 100%;
-        resize: none;
-        font-size: 15px;
-      }
-      .self {
-        color: #ffff00;
-        font-weight: bold;
-      }
-      .them {
-        color: #00ffff;
-        font-weight: bold;
-      }
-      .system {
-        color: #ff0000;
-        font-weight: bold;
-      }
-      .when {
-        color: #777777;
-        font-size: 12px;
-      }
-      .msgText {
-        color: #eeeeee;
-        font-size: 15px;
-      }
-      .msgTextUnicode {
-        color: #eeeeee;
-        font-size: 15px;
-      }
-
-      body {
-        background-image: url(img/gridtracker10.png);
-        background-repeat: no-repeat;
-        background-attachment: fixed;
-        background-position: center;
-      }
-      #callsign {
-        color: #00ffff;
-        font-weight: bold;
-      }
-      #country,
-      #dxcc {
-        color: #ffff00;
-        font-weight: bold;
-      }
-      #grid {
-        color: orange;
-        font-weight: bold;
-      }
-      #band {
-        color: #009900;
-        font-weight: bold;
-      }
-      #mode {
-        color: #ee0000;
-        font-weight: bold;
-      }
-
-      .rosterOn {
-        color: #ffffff;
-      }
-
-      .rosterOff {
-        color: #777777;
-      }
-
-      .imgGray {
-        -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
-      }
-
-      .imgNoFilter {
-      }
-
-      input:focus,
-      textarea:focus,
-      select:focus {
-        outline: none;
-      }
-
-      table {
-        border-collapse: collapse;
-      }
-
-      tr:hover td {
-        box-shadow: inset 0px 11px 6px -8px #888, inset 0px -11px 6px -8px #888;
-      }
-    </style>
+    <link rel="stylesheet" href="./lib/chat.css" />
    <script src="./lib/protos.js" type="text/javascript"></script>
    <script src="./lib/third-party.js" type="text/javascript"></script>
    <script src="./lib/screens.js"></script>
--- a/package.nw/lib/chat.css
+++ b/package.nw/lib/chat.css
@ -0,0 +1,106 @@
+table,
+th,
+td,
+body,
+input {
+        color: #fff;
+        white-space: nowrap;
+        font-family: Sans-Serif;
+        font-size: 13px;
+        text-align: auto;
+      }
+      .boxDisplay {
+        margin: 1px;
+        padding: 2px;
+        border-width: 2px;
+        border-color: #aaa;
+        border-style: inset;
+        vertical-align: top;
+        -webkit-border-radius: 4px;
+      }
+      textarea {
+        width: 100%;
+        resize: none;
+        font-size: 15px;
+      }
+      .self {
+        color: #ffff00;
+        font-weight: bold;
+      }
+      .them {
+        color: #00ffff;
+        font-weight: bold;
+      }
+      .system {
+        color: #ff0000;
+        font-weight: bold;
+      }
+      .when {
+        color: #777777;
+        font-size: 12px;
+      }
+      .msgText {
+        color: #eeeeee;
+        font-size: 15px;
+      }
+      .msgTextUnicode {
+        color: #eeeeee;
+        font-size: 15px;
+      }
+
+      body {
+        background-image: url(img/gridtracker10.png);
+        background-repeat: no-repeat;
+        background-attachment: fixed;
+        background-position: center;
+      }
+      #callsign {
+        color: #00ffff;
+        font-weight: bold;
+      }
+      #country,
+      #dxcc {
+        color: #ffff00;
+        font-weight: bold;
+      }
+      #grid {
+        color: orange;
+        font-weight: bold;
+      }
+      #band {
+        color: #009900;
+        font-weight: bold;
+      }
+      #mode {
+        color: #ee0000;
+        font-weight: bold;
+      }
+
+      .rosterOn {
+        color: #ffffff;
+      }
+
+      .rosterOff {
+        color: #777777;
+      }
+
+      .imgGray {
+        -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
+      }
+
+      .imgNoFilter {
+      }
+
+      input:focus,
+      textarea:focus,
+      select:focus {
+        outline: none;
+      }
+
+      table {
+        border-collapse: collapse;
+      }
+
+      tr:hover td {
+        box-shadow: inset 0px 11px 6px -8px #888, inset 0px -11px 6px -8px #888;
+      }
--- a/package.nw/lib/gt.js
+++ b/package.nw/lib/gt.js
@ -5,7 +5,6 @@ const pjson = require("./package.json");
 var gtVersion = parseInt(pjson.version.replace(/\./g, ""));
 var gtBeta = pjson.betaVersion;

-
 var g_startVersion = 0;
 if (typeof localStorage.currentVersion != "undefined") { g_startVersion = localStorage.currentVersion; }

@ -13650,10 +13649,12 @@ function startupVersionInit()

 function loadi18n()
 {
-  $.i18n().load( {
-    en: 'i18n/en.json',
-    es: 'i18n/es.json'
-  } );
+  $.i18n().load(
+    {
+      en: "i18n/en.json",
+      es: "i18n/es.json"
+    }
+  );
 }

 function startupButtonsAndInputs()
@ -13748,8 +13749,7 @@ function postInit()

 function renderI18n()
 {
-  $('body').i18n();
-
+  $("body").i18n();
 }

 document.addEventListener("dragover", function (event)
@ -13765,7 +13765,7 @@ document.addEventListener("drop", function (event)

 var g_startupTable = [
  [startupVersionInit, "Completed Version Check"],
-  [loadi18n,"Loading Locale"],
+  [loadi18n, "Loading Locale"],
  [qsoBackupFileInit, "QSO Backup Initialized"],
  [callsignServicesInit, "Callsign Services Initialized"],
  [loadMapSettings, "Map Settings Initialized"],