op25
/
op25
4
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

dark style, thx triptolemus

This commit is contained in:
Max 2021-02-12 18:25:01 -05:00
parent 59a631b700
commit e971078c55
5 changed files with 678 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
op25/gr-op25_repeater/www/images/op25-dark.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

484
op25/gr-op25_repeater/www/www-static/dark.css Executable file
View File

@ -0,0 +1,484 @@
/*
Copyright 2017, 2018 Max H. Parke KA1RBI
This file is part of OP25
OP25 is free software; you can redistribute it and/or modify it
under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 3, or (at your option)
any later version.
OP25 is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public
License for more details.
You should have received a copy of the GNU General Public License
along with OP25; see the file COPYING. If not, write to the Free
Software Foundation, Inc., 51 Franklin Street, Boston, MA
02110-1301, USA.
*/
body {
/* color: white; */
background-color: black;
}
#div_help {
color: #eee;
}
a {
color: #f00;
}
#div_status body {
background-color: black;
font-family: Arial, Helvetica, sans-serif;
}
#div_status table {
border-collapse: collapse;
font-family: "Courier New", Courier, Monospace;
}
#div_status th {
border-style: solid;
padding: 3px;
font-family: Arial, Helvetica, sans-serif;
color: #fff;
font-weight: bold;
background: #669999; /* For browsers that do not support gradients */
background: linear-gradient(#444, black);
}
#div_status td {
border: 1px solid #666;
padding: 3px;
}
#div_s2 td {
border-bottom: 1px solid #888;
border-top: 1px solid #888;
border-left: 0px;
border-right: 0px;
padding: 3px;
background: transparent;
}
hr {
width: 730px;
float: left;
padding: 0px;
}
.control-button { /* skip/hold/lockout buttons */
border-color: gray;
height: 42px;
color: yellow;
padding: 10px 10px;
text-decoration: none;
margin: 1px 1px;
cursor: pointer;
width: 100px;
font-size: 14px;
font-weight: bold;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2), 0 2px 5px 0 rgba(0,0,0,0.19);
background: #31687e; /* For browsers that do not support gradients */
background: linear-gradient(#666, black);
}
.control-button:hover {
background: linear-gradient(black, silver);
}
.controlsDisplay { /* holds buttons, and display */
width: 730px;
border: 0px solid #aaa;
vertical-align: top;
height: 178px;
padding: 2px;
box-shadow: 0 4px 8px 0 rgba(150,50,0,0.75), 0 3px 10px 0 rgba(0,0,150,0.4);
/* box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.19); */
background: LightGray; /* For browsers that do not support gradients */
background: linear-gradient(White, Silver);
}
.controls { /* skip/hold/lockout buttons (1) */
border: 1px solid #aaa;
width: 104px;
float: left;
height: 100%;
text-align: center;
}
.cfg_list {
border: 1px solid #000;
padding: 5px;
width: 260px;
}
.displaySettings {
border: 1px solid #000;
padding: 5px;
width: 720px;
}
.statDisplay { /* main display - freq, sys, tgid (2) */
padding: 0px;
width: 522px;
float: left;
position: relative;
display: inline-block;
border: 1px solid #aaa;
height: 100%;
background: LightGray; /* For browsers that do not support gradients */
background: linear-gradient(#222, Black, #222);
}
.sysMsg { /* OP25 logo and message box on right (3) */
padding: 0px;
/* display: inline-block; */
float: right; /* works left or right, right gives margin in between this & 2 */
width: 95px;
height: 100%;
background-color:#060606;
background-image: url("op25-dark.png");
background-repeat: no-repeat;
background-position: right;
border: 1px solid #aaa;
font-family: Arial, Helvetica, sans-serif;
color: #666;
font-size: 8pt;
}
div.info { /* main info container for the two tables */
width: 730px;
border: 0px solid #a00;
display: inline-block;
}
div.system { /* system frequencies container that holds the table */
float: left;
width: 48%;
height: auto;
border: 0px solid #d00;
}
div.adjacent { /* adjacent sites container that holds the table */
margin-left: 29px;
float: left;
width: 48%;
height: auto;
border: 0px solid #00f;
}
/* labels, values, system and tg text */
.copyr {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #484848;
float: right;
margin-top: 22px;
margin-right: 4px;
}
.label {
font-family: Arial, Helvetica, sans-serif;
color: gray;
}
.label-hold {
font-family: Arial, Helvetica, sans-serif;
color: #c00;
font-size: 8pt;
font-weight: bold;
text-align: center;
vertical-align: center;
height: 50%;
}
.label-sm {
font-family: Arial, Helvetica, sans-serif;
color: #ccc;
font-size: 8pt;
padding: 2px;
}
.label-lc { /* Last Command text */
font-family: Arial, Helvetica, sans-serif;
color: #aaa;
font-size: 8pt;
padding: 2px;
text-align: center;
}
.red_value {
font-family: Arial, Helvetica, sans-serif;
color: #f00000;
font-weight: bold;
}
.value {
font-family: Arial, Helvetica, sans-serif;
color: #8f8;
font-weight: bold;
}
.systgid { /* System and Talkgroup Text */
font-family: Arial, Helvetica, sans-serif;
color: #8f8;
font-weight: bold;
font-size: 24px;
}
.syscrypto { /* alg/key text */
font-family: Arial, Helvetica, sans-serif;
color: #f00000;
font-size: 24px;
}
.boxtitle {
font-weight: bold;
text-align: left;
}
.nac { /* the whole NAC string... NAC, freq tsbks, etc. */
font-family: Arial, Helvetica, sans-serif;
color: #8f8;
font-weight: bold;
font-size: 20px;
}
.s1 {
/* empty */
}
.s2 {
border: 0px solid #999;
position: relative;
display: inline-block;
max-height: 112px;
width: 512px;
padding: 5px;
margin: 0 0 0 2px;
}
.copyright-text {
font-family: Arial, Helvetica, sans-serif;
color: #eee;
/* font-size: 10pt; */
}
.nav-ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #bbb;
background: linear-gradient(#111, #222);
}
.nav-li {
float: left;
border-right: 1px solid #000;
background: linear-gradient(#333, #444);
}
.nav-li-active {
float: left;
background-color: #000;
color: #0080c0;
border-right: 0px solid #f00;
}
.nav-bar {
width: 730px;
padding: 0;
border: 1px solid #000;
}
.nav-button {
background-color: #bbb;
background: linear-gradient(#333, #444);
width: 85px;
color: #ddd;
border: 0px;
padding: 20px;
display: block;
font-size: 14px;
font-weight: bold;
}
.nav-button-active {
background-color: #666;
background: linear-gradient(#777, #888);
color: #fff;
border: 0px;
padding: 20px;
display: block;
font-size: 14px;
font-weight: bold;
}
.nav-button:hover {
background-color: #699;
background: linear-gradient(#999, #aaa);
color: #fff;
}
.nav-button-active:hover {
background-color: #699;
background: linear-gradient(#999, #aaa);
}
#div_settings table {
border-color: black;
}
#div_settings tr {
border-top: none;
border-bottom: solid;
}
#div_settings th.boxtitle-th {
text-align: left;
}
.div_settings th {
max-width: 75px;
border-style: none;
padding: 3px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000;
background: #eee;
text-align: right;
font-weight: normal;
}
#div_settings td {
max-width: 75px;
border-style: none;
font-weight: bold;
text-align: right;
}
#div_settings input[type=text] {
max-width: 75px;
border-top: none;
border-bottom-width: 1px;
border-bottom: dotted;
border-right: none;
border-left: none;
text-align: right;
}
#div_settings input[type=button] {
max-width: 75px;
padding: 10px;
color: red;
border: 0;
}
#div_settings select {
max-width: 100px;
padding: 0;
border: 0;
}
#div_settings option {
max-width: 100px;
padding: 0;
border: 0;
}
.boxtitle {
text-align: left;
}
div#cfg_list_area select {
width: 250px;
max-width: 250px;
}
#div_rx_opts td {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
border-style: none;
}
#div_rx_opts input[type=text] {
max-width: 75px;
border-top: none;
border-bottom-width: 1px;
border-bottom: dotted;
border-right: none;
border-left: none;
text-align: right;
}
.help {
max-width: 640px;
font-family: Arial, Helvetica, sans-serif;
}
.aboutTable {
width: 730px;
border: 1px solid #aaa;
vertical-align: top;
height: 178px;
padding: 2px;
box-shadow: 0 4px 8px 0 rgba(150,50,0,0.75), 0 3px 10px 0 rgba(0,0,150,0.4);
/* box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.19); */
background: LightGray; /* For browsers that do not support gradients */
background: linear-gradient(Black, #333);
}
}
.aboutLogo {
background-image: url("op25-dark.png");
}

104
op25/gr-op25_repeater/www/www-static/index.html Normal file → Executable file
View File

@ -1,10 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>OP25</title> <title>OP25</title>
<link rel="stylesheet" type="text/css" href="main.css"> <link rel="stylesheet" type="text/css" id="style" href="main.css">
<script src="main.js"></script> <script src="main.js"></script>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
</head> </head>
@ -15,23 +13,36 @@
<!-- nav bar --> <!-- nav bar -->
<div class="nav-bar"> <div class="nav-bar" id="nav-bar">
<ul class="nav-ul"> <ul class="nav-ul">
<li id="li1" class="nav-li"><input id="b1" class="nav-button" type="button" name="B1" value="Home" onclick="javascript:f_select(&quot;status&quot;);"></li> <li id="li1" class="nav-li"><input id="b1" class="nav-button" type="button" name="B1" value="Home" onclick="javascript:f_select('status');"></li>
<li id="li2" class="nav-li"><input id="b2" class="nav-button" type="button" name="B2" value="Configuration" onclick="javascript:f_select(&quot;settings&quot;);"></li> <li id="li2" class="nav-li"><input id="b2" class="nav-button" type="button" name="B2" value="Config" onclick="javascript:f_select('settings');"></li>
<li id="li3" class="nav-li"><input id="b3" class="nav-button" type="button" name="B3" value="RX" onclick="javascript:f_select(&quot;rx&quot;);"></li> <li id="li3" class="nav-li"><input id="b3" class="nav-button" type="button" name="B3" value="RX" onclick="javascript:f_select('rx');"></li>
<li id="li4" class="nav-li"><input id="b4" class="nav-button" type="button" name="B4" value="Help" onclick="javascript:f_select(&quot;help&quot;);"></li> <li id="li4" class="nav-li"><input id="b4" class="nav-button" type="button" name="B4" value="Help" onclick="javascript:f_select('help');"></li>
<li id="li5" class="nav-li"><input id="b5" class="nav-button" type="button" name="B5" value="About" onclick="javascript:f_select(&quot;about&quot;);"></li> <li id="li5" class="nav-li"><input id="b5" class="nav-button" type="button" name="B5" value="View" onclick="javascript:toggleCSS();"></li>
<li id="li5"><div class="copyr">&copy; 2017&dash;2020 Max H. Parke KA1RBI</div></li> <li id="li5" class="nav-li"><input id="b6" class="nav-button" type="button" name="B6" value="Popout" onclick="javascript:this.blur(); popOut();"></li>
<li id="li5" class="nav-li"><input id="b7" class="nav-button" type="button" name="B7" value="About" onclick="javascript:f_select('about');"></li>
<li id="li5"> &nbsp; </li>
</ul> </ul>
</div> </div>
<br>
<div id="div_debug" style="display: none;"> <div id="div_debug" style="display: block;"></div>
</div>
<div id="div_help" class="help" style="display:none;"> <div id="div_help" class="help" style="display:none;">
<P> <P>
<h2>Keyboard Shortcuts</h2>
G - Go To <br>
L - Lockout<br>
H - Hold<br>
S - Skip<br>
V - View (light/dark toggle)<br>
R - RX Screen<br>
J - Home Screen<br>
M - Minify<br>
B - Make display text BOLD<br>
N - Make display text NORMAL<br>
<br>
<h2>Setup and Monitor a Trunked System</h2> <h2>Setup and Monitor a Trunked System</h2>
Before proceeding you will need to know the control channel frequency or frequencies for your system and the system NAC code. Also needed is the frequency correction (PPM) value for your SDR. Before proceeding you will need to know the control channel frequency or frequencies for your system and the system NAC code. Also needed is the frequency correction (PPM) value for your SDR.
<ul> <ul>
@ -66,17 +77,21 @@ Before proceeding you will need to know the control channel frequency or frequen
<!-- copyright / about div--> <!-- copyright / about div-->
<div id="div_about" style="display:none;"> <div id="div_about" style="display:none;">
<br>
<table class="aboutTable"><tr><td>
<div class="copyright-text"> <div class="copyright-text">
This program comes with ABSOLUTELY NO WARRANTY.<br> This program comes with ABSOLUTELY NO WARRANTY.<br>
OP25 is free software, and you are welcome to redistribute it<br> OP25 is free software, and you are welcome to redistribute it<br>
under certain conditions. For further details refer to the "License" under certain conditions. For further details refer to the "License"
link (below).<p> link (below).<p>
<table border=0> <table border=0>
<tr><td>Copyright:</td><td>&copy; 2017&dash;2021 Max H. Parke KA1RBI</td></tr>
<tr><td>License:</td><td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">https://www.gnu.org/licenses/gpl-3.0.en.html</a></td></tr> <tr><td>License:</td><td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">https://www.gnu.org/licenses/gpl-3.0.en.html</a></td></tr>
<tr><td>Mailing list:</td><td><a href="https://groups.yahoo.com/neo/groups/op25-dev" target="_blank2">https://groups.yahoo.com/neo/groups/op25-dev</a></td></tr> <tr><td>Mailing list:</td><td><a href="https://lists.osmocom.org/mailman/listinfo/op25-dev target="_blank2">https://lists.osmocom.org/mailman/listinfo/op25-dev</a></td></tr>
<tr><td>Download:</td><td><tt>git clone https://git.osmocom.org/op25</tt></td></tr> <tr><td>Download:</td><td><tt>git clone https://git.osmocom.org/op25</tt></td></tr>
<tr><td>Web site:</td><td><a href="http://op25.osmocom.org" target="_blank3">http://op25.osmocom.org</a></td></tr> <tr><td>Web site:</td><td><a href="http://op25.osmocom.org" target="_blank3">http://op25.osmocom.org</a></td></tr>
</table> </table>
</td><td><div class="sysMsg"> &nbsp; </div></td><tr></table>
</div> </div>
<br> <br>
</div> </div>
@ -102,56 +117,52 @@ Before proceeding you will need to know the control channel frequency or frequen
<input type="button" class="control-button" name="lockout" value="LOCKOUT" onclick="javascript:this.blur(); f_scan_button(&quot;lockout&quot;);"> <input type="button" class="control-button" name="lockout" value="LOCKOUT" onclick="javascript:this.blur(); f_scan_button(&quot;lockout&quot;);">
</div> </div>
<div> <div>
<input type="button" class="control-button" name="popout" value="GO TO" onclick="javascript:f_goto_button(&quot;goto&quot;);"> <input type="button" class="control-button" name="popout" value="GO TO" onclick="javascript:f_goto_button(&quot;goto&quot;);">
</div> </div>
</div> </div>
<div class="statDisplay"> <div class="statDisplay">
<div id="div_s2" class="s2" style="display: none;"> <div id="div_s2" class="s2" style="display: none;">
<!-- frequency, system, tg display --> <!-- frequency, system, tg display -->
</div> </div>
</div> </div>
<div class="sysMsg"> <!-- hold / last command box w/ logo--> <div class="sysMsg"> <!-- hold / last command box w/ logo-->
<div id="holdIndicator" class="label-hold" style="display: none;"><br>TG HOLD ON</div> <div id="holdIndicator" class="label-hold" style="display: none;"><br>TG HOLD ON</div>
<div id="lastCommand" class="label-lc"> &nbsp; </div> <div id="lastCommand" class="label-lc"> &nbsp; </div>
<div id="stx" class="label-lc"> &nbsp; </div>
</div> </div>
</div> </div>
<br> <div id="j"></div> <!-- for testing / debug -->
<div id="div_s1" class="s1"> <div id="div_s1" class="s1">
<!-- system freq and adjacent sites --> <!-- system freq and adjacent sites -->
<span class="label">Waiting for data...</span>
Waiting for data...
</div> </div>
<br>
<div id="div_images" class="s1"> <div id="div_images" class="s1">
<p> <table border=0 borderwidth=0 cellpadding=0 cellspacing=0 style="width: 730px;">
<table border=0 borderwidth=0 cellpadding=0 cellspacing=0 style="width: 730px;"> <tr><td align="center">
<tr><td>
<img src="1x1.png" id="img0" style="display:none;" alt="plot"> <img src="1x1.png" id="img0" style="display:none;" alt="plot">
</td><td> </td><td align="center">
<img src="1x1.png" id="img1" style="display:none;" alt="plot"> <img src="1x1.png" id="img1" style="display:none;" alt="plot">
</td></tr> </td></tr>
<tr><td> <tr><td align="center">
<img src="1x1.png" id="img2" style="display:none;" alt="plot"> <img src="1x1.png" id="img2" style="display:none;" alt="plot">
</td><td> </td><td align="center">
<img src="1x1.png" id="img3" style="display:none;" alt="plot"> <img src="1x1.png" id="img3" style="display:none;" alt="plot">
</td></tr> </td></tr>
<tr><td> <tr><td align="center">
<img src="1x1.png" id="img4" style="display:none;" alt="plot"> <img src="1x1.png" id="img4" style="display:none;" alt="plot">
</td><td> </td><td align="center">
<img src="1x1.png" id="img5" style="display:none;" alt="plot"> <img src="1x1.png" id="img5" style="display:none;" alt="plot">
</td></tr> </td></tr>
</table> </table>
<p>
</div> </div>
</div> <!-- closing div for div_status --> </div> <!-- closing div for div_status -->
@ -189,8 +200,6 @@ Before proceeding you will need to know the control channel frequency or frequen
</select>&nbsp;&nbsp;<span class="label">px (default = 24)</span><br><br> </select>&nbsp;&nbsp;<span class="label">px (default = 24)</span><br><br>
<span class="label">Truncate display strings to:&nbsp;&nbsp; <span class="label">Truncate display strings to:&nbsp;&nbsp;
<input name="firstname" type="text" id="valTruncate" style="width: 30px; text-align: center;" value="30"> characters (default = 30)<br><br> <input name="firstname" type="text" id="valTruncate" style="width: 30px; text-align: center;" value="30"> characters (default = 30)<br><br>
Font Style:&nbsp; Font Style:&nbsp;
<select name="valFontStyle" id="valFontStyle" style="width: 70px;"> <select name="valFontStyle" id="valFontStyle" style="width: 70px;">
@ -198,6 +207,17 @@ Before proceeding you will need to know the control channel frequency or frequen
<option value="bold" selected>Bold</option> <option value="bold" selected>Bold</option>
</select> </select>
</span> </span>
<br><br>
<!--
<span class="label">UI Update Interval:&nbsp;&nbsp;</span>
<select name="update_int" id="update_int" style="width: 85px;" onchange="update_interval()">
<option value="500">500</option>
<option value="750">750</option>
<option value="1000" selected>1000</option>
</select>&nbsp;&nbsp;<span class="label">ms (default = 1000)</span>&nbsp;&nbsp;<button onclick="ui()">Update</button><br><br>
-->
</div> </div>
<!-- End Main Display Settings --> <!-- End Main Display Settings -->
@ -210,12 +230,12 @@ Before proceeding you will need to know the control channel frequency or frequen
<div id="cfg_list_area" class="cfg_list"> <div id="cfg_list_area" class="cfg_list">
</div> </div>
<p> <p>
<input type="button" name="load" value="Edit" onclick="javascript:f_load();"></input> - Open configuration editor (any previous unsaved work will be lost)<br> <input type="button" class="plain-button" name="load" value="Edit" onclick="javascript:f_load();"></input><span class="label"> - Open configuration editor (any previous unsaved work will be lost)</span><br>
<input type="button" name="list" value="Refresh" onclick="javascript:f_list();"></input> - Reload selection list <input type="button" class="plain-button" name="list" value="Refresh" onclick="javascript:f_list();"></input><span class="label"> - Reload selection list</span>
<input type=checkbox id="include_tsv" name="include_tsv">Include old-style trunking TSV files <input type=checkbox id="include_tsv" name="include_tsv"> <span class="label">Include old-style trunking TSV files</span>
<br> <br>
<input type="button" name="start" value="Start" onclick="javascript:f_start();"></input> - Run flowgraph using selected configuration<br> <input type="button" class="plain-button" name="start" value="Start" onclick="javascript:f_start();"></input><span class="label"> - Run flowgraph using selected configuration</span><br>
<input type="button" name="stop" value="Stop" onclick="javascript:f_stop();"></input> - End running flowgraph<br> <input type="button" class="plain-button" name="stop" value="Stop" onclick="javascript:f_stop();"></input><span class="label"> - End running flowgraph</span><br>
<br> <br>
<div id="answer_area"> <div id="answer_area">
</div> </div>

24
op25/gr-op25_repeater/www/www-static/main.css Normal file → Executable file
View File

@ -70,7 +70,7 @@ hr {
.control-button { /* skip/hold/lockout buttons */ .control-button { /* skip/hold/lockout buttons */
border-color: gray; border-color: gray;
height: 38px; height: 42px;
color: white; color: white;
padding: 10px 10px; padding: 10px 10px;
text-decoration: none; text-decoration: none;
@ -84,6 +84,7 @@ hr {
background: linear-gradient(#31687e, #56a0bd); background: linear-gradient(#31687e, #56a0bd);
} }
.control-button:hover { .control-button:hover {
background: linear-gradient(#56a0bd, #31687e); background: linear-gradient(#56a0bd, #31687e);
@ -289,7 +290,7 @@ div.adjacent { /* adjacent sites container that holds the table */
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
color: #000060; color: #000060;
font-size: 10pt; /* font-size: 10px; */
} }
.nav-ul { .nav-ul {
@ -324,6 +325,7 @@ div.adjacent { /* adjacent sites container that holds the table */
background-color: #bbb; background-color: #bbb;
background: linear-gradient(#bbbbbb, #cccccc); background: linear-gradient(#bbbbbb, #cccccc);
color: #000; color: #000;
width: 85px;
border: 0px; border: 0px;
padding: 20px; padding: 20px;
display: block; display: block;
@ -399,7 +401,7 @@ div.adjacent { /* adjacent sites container that holds the table */
#div_settings input[type=button] { #div_settings input[type=button] {
max-width: 75px; max-width: 75px;
padding: 10px; padding: 10px;
color: blue; color: red;
border: 0; border: 0;
} }
@ -444,3 +446,19 @@ div#cfg_list_area select {
max-width: 640px; max-width: 640px;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
.aboutTable {
width: 730px;
border: 1px solid #aaa;
vertical-align: top;
height: 178px;
padding: 2px;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.19);
background: LightGray; /* For browsers that do not support gradients */
background: linear-gradient(White, Silver);
}
.aboutLogo {
background-image: url("op25.png");
}

135
op25/gr-op25_repeater/www/www-static/main.js Normal file → Executable file
View File

@ -2,23 +2,24 @@
// Copyright 2017, 2018 Max H. Parke KA1RBI // Copyright 2017, 2018 Max H. Parke KA1RBI
// //
// This file is part of OP25 // This file is part of OP25
// //
// OP25 is free software; you can redistribute it and/or modify it // OP25 is free software; you can redistribute it and/or modify it
// under the terms of the GNU General Public License as published by // under the terms of the GNU General Public License as published by
// the Free Software Foundation; either version 3, or (at your option) // the Free Software Foundation; either version 3, or (at your option)
// any later version. // any later version.
// //
// OP25 is distributed in the hope that it will be useful, but WITHOUT // OP25 is distributed in the hope that it will be useful, but WITHOUT
// ANY WARRANTY; without even the implied warranty of MERCHANTABILITY // ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
// or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public // or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public
// License for more details. // License for more details.
// //
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with OP25; see the file COPYING. If not, write to the Free // along with OP25; see the file COPYING. If not, write to the Free
// Software Foundation, Inc., 51 Franklin Street, Boston, MA // Software Foundation, Inc., 51 Franklin Street, Boston, MA
// 02110-1301, USA. // 02110-1301, USA.
var d_debug = 1; var d_debug = 0;
var update_interval = 500; // UI update interval, ms (default=1000)
var http_req = new XMLHttpRequest(); var http_req = new XMLHttpRequest();
var counter1 = 0; var counter1 = 0;
@ -80,7 +81,7 @@ function edit_d(d, to_ui) {
var hexints = {"nac":1}; var hexints = {"nac":1};
var ints = {"if_rate":1, "ppm":1, "rate":1, "offset":1, "nac":1, "logfile-workers":1, "decim-amt":1, "seek":1, "hamlib-model":1 }; var ints = {"if_rate":1, "ppm":1, "rate":1, "offset":1, "nac":1, "logfile-workers":1, "decim-amt":1, "seek":1, "hamlib-model":1 };
var bools = {"active":1, "trunked":1, "rate":1, "offset":1, "phase2_tdma": 1, "phase2-tdma":1, "wireshark":1, "udp-player":1, "audio-if":1, "tone-detect":1, "vocoder":1, "audio":1, "pause":1 }; var bools = {"active":1, "trunked":1, "rate":1, "offset":1, "phase2_tdma": 1, "phase2-tdma":1, "wireshark":1, "udp-player":1, "audio-if":1, "tone-detect":1, "vocoder":1, "audio":1, "pause":1 };
var floats = {"costas-alpha":1, "gain-mu":1, "calibration":1, "fine-tune":1, "gain":1, "excess-bw":1, "offset":1, "excess_bw":1} var floats = {"costas-alpha":1, "gain-mu":1, "calibration":1, "fine-tune":1, "gain":1, "excess-bw":1, "offset":1, "excess_bw":1};
var lists = {"blacklist":1, "whitelist":1, "cclist":1}; var lists = {"blacklist":1, "whitelist":1, "cclist":1};
var freqs = {"frequency":1, "cclist":1}; var freqs = {"frequency":1, "cclist":1};
@ -216,8 +217,8 @@ function amend_d(myrow, mytbl, command) {
} }
function nav_update(command) { function nav_update(command) {
var names = ["b1", "b2", "b3", "b4", "b5"]; var names = ["b1", "b2", "b3", "b4", "b5", "b7"];
var bmap = { "status": "b1", "settings": "b2", "rx": "b3", "help": "b4", "about": "b5" }; var bmap = { "status": "b1", "settings": "b2", "rx": "b3", "help": "b4", "view": "b5", "about": "b7" };
var id = bmap[command]; var id = bmap[command];
for (var id1 in names) { for (var id1 in names) {
b = document.getElementById(names[id1]); b = document.getElementById(names[id1]);
@ -277,12 +278,20 @@ function rx_update(d) {
} }
} }
error_val = d["error"]; error_val = d["error"];
fine_tune = d["fine_tune"]; // displays Fine Tune value as supplied in the command line arguments
} }
// frequency, system, and talkgroup display // frequency, system, and talkgroup display
function change_freq(d) { function change_freq(d) {
var xj = document.getElementById("stx"); // display FDMA or TDMA (untested, no P2 system here)
xj.innerHTML = " $nbsp; "; // trip 01/2021
t = "TDMA"; //
if (!d['tdma']) //
t = "FDMA"; //
xj.innerHTML = t; //
var displayTgid = "&mdash;"; var displayTgid = "&mdash;";
var displayTag = "&nbsp;"; var displayTag = "&nbsp;";
var display_src = "&mdash;"; var display_src = "&mdash;";
@ -390,7 +399,7 @@ function trunk_summary(d) {
var html = ""; var html = "";
html += "<br><div class=\"summary\">"; html += "<br><div class=\"summary\">";
html += "<form>"; html += "<form>";
html += "<table border=1 borderwidth=0 cellpadding=0 cellspacing=0>"; html += "<table border=1 width=732 borderwidth=0 cellpadding=0 cellspacing=0>";
html += "<tr><th>Enabled</th><th>NAC</th><th>System</th><th>Last Active</th><th>TSBK Count</th></tr>"; html += "<tr><th>Enabled</th><th>NAC</th><th>System</th><th>Last Active</th><th>TSBK Count</th></tr>";
for (nac in d) { for (nac in d) {
if (!is_digit(nac.charAt(0))) if (!is_digit(nac.charAt(0)))
@ -418,12 +427,12 @@ function trunk_summary(d) {
var ns = parseInt(nac).toString(16); var ns = parseInt(nac).toString(16);
html += "<tr>"; html += "<tr>";
var checked = enable_status[nac] ? "checked" : ""; var checked = enable_status[nac] ? "checked" : "";
html += "<td><span class=\"value\"><input type=\"checkbox\" id=\"enabled-" + nac + "\" " + checked + " onchange=\"javascript: f_enable_changed(this, " + nac + ");\"></input></span></td>"; html += "<td align=center><span class=\"value\"><input type=\"checkbox\" id=\"enabled-" + nac + "\" " + checked + " onchange=\"javascript: f_enable_changed(this, " + nac + ");\"></input></span></td>";
html += "<td><span class=\"value\">" + ns + "</span></td>"; html += "<td align=center><span class=\"value\">" + ns + "</span></td>";
html += "<td><span class=\"value\">" + d[nac]['sysname'] + "</span></td>"; html += "<td align=center><span class=\"value\">" + d[nac]['sysname'] + "</span></td>";
html += "<td><span class=\"value\">" + times + "</span></td>"; html += "<td align=center><span class=\"value\">" + times + "</span></td>";
html += "<td><span class=\"value\">" + d[nac]['tsbks'] + "</span></td>"; html += "<td align=center><span class=\"value\">" + comma(d[nac]['tsbks']) + "</span></td>";
html += "</tr>"; html += "</tr>";
} }
var display = ""; var display = "";
@ -464,14 +473,14 @@ function trunk_detail(d) {
last_alg[nac] = d[nac]['alg']; last_alg[nac] = d[nac]['alg'];
last_algid[nac] = d[nac]['algid']; last_algid[nac] = d[nac]['algid'];
last_keyid[nac] = d[nac]['keyid']; last_keyid[nac] = d[nac]['keyid'];
html += "<div class=\"content\">"; // open div-content html += "<div class=\"content\">"; // open div-content
html += "<span class=\"nac\">"; html += "<span class=\"nac\">";
html += d[nac]["sysname"] + " . . . . . . . . "; html += "<br>" + d[nac]["sysname"] + " <br> ";
html += "NAC " + "0x" + parseInt(nac).toString(16) + " "; html += "NAC " + "0x" + parseInt(nac).toString(16) + " &nbsp; &nbsp; &nbsp; ";
html += d[nac]['rxchan'] / 1000000.0; html += d[nac]['rxchan'] / 1000000.0;
html += " / "; html += " / ";
html += d[nac]['txchan'] / 1000000.0; html += d[nac]['txchan'] / 1000000.0;
html += " tsbks " + d[nac]['tsbks']; html += " &nbsp; &nbsp; &nbsp; tsbks " + comma(d[nac]['tsbks']);
html += "</span><br>"; html += "</span><br>";
html += "<span class=\"label\">WACN: </span>" + "<span class=\"value\">0x" + parseInt(d[nac]['wacn']).toString(16) + " </span>"; html += "<span class=\"label\">WACN: </span>" + "<span class=\"value\">0x" + parseInt(d[nac]['wacn']).toString(16) + " </span>";
@ -482,12 +491,13 @@ function trunk_detail(d) {
html += "<span class=\"label\">Secondary control channel(s): </span><span class=\"value\"> "; html += "<span class=\"label\">Secondary control channel(s): </span><span class=\"value\"> ";
for (i=0; i<d[nac]["secondary"].length; i++) { for (i=0; i<d[nac]["secondary"].length; i++) {
html += d[nac]["secondary"][i] / 1000000.0; html += d[nac]["secondary"][i] / 1000000.0;
html += " "; html += "&nbsp;&nbsp;&nbsp;";
} }
html += "</span><br>"; html += "</span><br>";
} }
if (error_val != null) { if (error_val != null) {
html += "<span class=\"label\">Frequency error: </span><span class=\"value\">" + error_val + " Hz. (approx) </span><br>"; html += "<span class=\"label\">Frequency error: </span><span class=\"value\">" + error_val + " Hz. </span> &nbsp; ";
html += "<span class=\"label\">Fine tune: </span><span class=\"value\">" + fine_tune + "</span><br>";
} }
// system frequencies table // system frequencies table
@ -654,7 +664,7 @@ function http_req_cb() {
function do_onload() { function do_onload() {
var ele = document.getElementById("div_status"); var ele = document.getElementById("div_status");
ele.style["display"] = ""; ele.style["display"] = "";
setInterval(do_update, 1000); var intv = setInterval(do_update, update_interval); // UI update interval
b = document.getElementById("b1"); b = document.getElementById("b1");
b.className = "nav-button-active"; b.className = "nav-button-active";
} }
@ -707,7 +717,7 @@ function f_goto_button(command) {
command = "hold" command = "hold"
if (current_tgid != null) if (current_tgid != null)
_tgid = current_tgid; _tgid = current_tgid;
_tgid = parseInt(prompt("Enter tgid to hold!!!", _tgid)); _tgid = parseInt(prompt("Enter tgid to hold.", _tgid));
if (isNaN(_tgid) || (_tgid < 0) || (_tgid > 65535)) if (isNaN(_tgid) || (_tgid < 0) || (_tgid > 65535))
_tgid = 0; _tgid = 0;
@ -717,16 +727,18 @@ function f_goto_button(command) {
function f_debug() { function f_debug() {
if (!d_debug) return; if (!d_debug) return;
var html = "busy " + send_busy; var html = "<div class='label'><br>";
html += "busy " + send_busy;
html += " qfull " + send_qfull; html += " qfull " + send_qfull;
html += " sendq size " + send_queue.length; html += " sendq size " + send_queue.length;
html += " requests " + request_count; html += " requests " + request_count;
html += "<br>callbacks:"; html += " update int=" + update_interval;
html += " <br>callbacks: ";
html += " total=" + req_cb_count; html += " total=" + req_cb_count;
html += " incomplete=" + nfinal_count; html += " incomplete=" + nfinal_count;
html += " error=" + n200_count; html += " error=" + n200_count;
html += " OK=" + r200_count; html += " OK=" + r200_count;
html += "<br>"; html += "</div>";
var div_debug = document.getElementById("div_debug"); var div_debug = document.getElementById("div_debug");
div_debug.innerHTML = html; div_debug.innerHTML = html;
} }
@ -951,3 +963,78 @@ function f_tags(o) {
var tbl = mydiv.querySelector(".tgtable"); var tbl = mydiv.querySelector(".tgtable");
toggle_show_hide(o, tbl); toggle_show_hide(o, tbl);
} }
// added UI functions - triptolemus
// popout the UI to a minimal browser window
function popOut() {
var myWindow = window.open(window.location.href, "", "width=760,height=400");
}
// toggle dark/light mode
function toggleCSS() {
var a = document.getElementById("style");
a.x = 'dark' == a.x ? 'main' : 'dark'; // short if
a.href = a.x + '.css';
}
// add comma formatting to number (tsbk)
function comma(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// keyboard shortcuts
document.onkeydown = function(evt) {
evt = evt || window.event;
if (evt.keyCode == 71) { // 'g' key - GOTO
f_goto_button("goto");
}
if (evt.keyCode == 76) { // 'l' key - LOCKOUT
f_scan_button("lockout");
}
if (evt.keyCode == 72) { // 'h' key - HOLD
f_scan_button("hold");
}
if (evt.keyCode == 83) { // 's' key - SKIP
f_scan_button("skip");
}
if (evt.keyCode == 86) { // 'v' key - VIEW (light/dark)
toggleCSS();
}
if (evt.keyCode == 82) { // 'r' key - RX screen
f_select("rx");
}
if (evt.keyCode == 74) { // 'j' key - HOME screen
f_select("status");
}
if (evt.keyCode == 77) { // 'm' key - MINIFY
minify("nav-bar");
minify("div_images");
minify("div_s1");
}
if (evt.keyCode == 66) { // 'b' key - bold
document.getElementById("valFontStyle").value="bold"
}
if (evt.keyCode == 78) { // 'n' key - normal
document.getElementById("valFontStyle").value="normal"
}
}
function minify(div) {
var x = document.getElementById(div);
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}