ui additions thx Trip
This commit is contained in:
parent
3c50b3c54b
commit
384c8c28d0
|
@ -104,6 +104,51 @@
|
|||
</div>
|
||||
|
||||
<div id="div_settings" class="div_settings" style="display: none;">
|
||||
|
||||
<!-- Main Display Settings -->
|
||||
<div id = "displaySettings" class="displaySettings">
|
||||
<span class="nac"><b>Display Settings</b></span><br><br>
|
||||
<span class="label">System Font Size: </span>
|
||||
<select name="valSystemFont" id="valSystemFont" style="width: 50px;">
|
||||
<option value="28">28</option>
|
||||
<option value="26">26</option>
|
||||
<option value="24" selected>24</option>
|
||||
<option value="20">20</option>
|
||||
<option value="18">18</option>
|
||||
<option value="16">16</option>
|
||||
<option value="14">14</option>
|
||||
<option value="12">12</option>
|
||||
</select> <span class="label">px (default = 24)</span><br><br>
|
||||
|
||||
<span class="label">Talkgroup Tag Font Size: </span>
|
||||
<select name="valTagFont" id="valTagFont" style="width: 50px;">
|
||||
<option value="28">28</option>
|
||||
<option value="26">26</option>
|
||||
<option value="24" selected>24</option>
|
||||
<option value="20">20</option>
|
||||
<option value="18">18</option>
|
||||
<option value="16">16</option>
|
||||
<option value="14">14</option>
|
||||
<option value="12">12</option>
|
||||
</select> <span class="label">px (default = 24)</span><br><br>
|
||||
|
||||
<span class="label">Truncate display strings to:
|
||||
|
||||
|
||||
<input name="firstname" type="text" id="valTruncate" style="width: 30px; text-align: center;" value="30"> characters (default = 30)<br><br>
|
||||
Font Style:
|
||||
<select name="valFontStyle" id="valFontStyle" style="width: 70px;">
|
||||
<option value="normal">Normal</option>
|
||||
<option value="bold" selected>Bold</option>
|
||||
</select>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- End Main Display Settings -->
|
||||
|
||||
|
||||
|
||||
|
||||
<img src="temp.png"><br>
|
||||
<form method="post" action="#" id="form_settings">
|
||||
<div id="cfg_list_area">
|
||||
|
@ -193,7 +238,7 @@
|
|||
<tr id="devrow" class="dynrow" style="display: none">
|
||||
<td><input type="checkbox" name="active" checked></input></td>
|
||||
<td><input type="text" name="name" value="Device1"></td>
|
||||
<td><input type="text" name="args" value="rtl:0"></td>
|
||||
<td><input type="text" name="args" value="rtl"></td>
|
||||
<td><input type="text" name="frequency" value="500.0"></td>
|
||||
<td><input type="text" name="gains" value="lna:45"></td>
|
||||
<td><input type="text" name="offset" value="0"></td>
|
||||
|
|
|
@ -1,3 +1,26 @@
|
|||
/*
|
||||
|
||||
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.
|
||||
|
||||
*/
|
||||
|
||||
#div_status body {
|
||||
|
||||
background-color: LightGray;
|
||||
|
@ -6,8 +29,6 @@
|
|||
|
||||
#div_status table {
|
||||
|
||||
border-style: solid;
|
||||
background-color: #336699;
|
||||
border-collapse: collapse;
|
||||
font-family: "Courier New", Courier, Monospace;
|
||||
}
|
||||
|
@ -25,24 +46,27 @@
|
|||
|
||||
#div_status td {
|
||||
|
||||
border-style: solid;
|
||||
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;
|
||||
}
|
||||
|
||||
hr.disp { /* hr in main display */
|
||||
|
||||
width: 97%;
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
}
|
||||
|
||||
.control-button { /* skip/hold/lockout buttons */
|
||||
|
||||
border-color: gray;
|
||||
|
@ -58,7 +82,6 @@ hr.disp { /* hr in main display */
|
|||
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(#31687e, #56a0bd);
|
||||
/* background: linear-gradient(#669999, #82B0B0); --- the green */
|
||||
}
|
||||
|
||||
.control-button:hover {
|
||||
|
@ -87,6 +110,14 @@ hr.disp { /* hr in main display */
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.displaySettings {
|
||||
|
||||
border: 1px solid #000;
|
||||
padding: 5px;
|
||||
width: 720px;
|
||||
|
||||
}
|
||||
.statDisplay { /* main display - freq, sys, tgid (2) */
|
||||
|
||||
padding: 0px;
|
||||
|
@ -119,9 +150,6 @@ hr.disp { /* hr in main display */
|
|||
|
||||
div.info { /* main info container for the two tables */
|
||||
|
||||
/* min-height: 50px;
|
||||
overflow: hidden;
|
||||
position: relative; */
|
||||
width: 730px;
|
||||
border: 0px solid #a00;
|
||||
display: inline-block;
|
||||
|
@ -198,7 +226,7 @@ div.adjacent { /* adjacent sites container that holds the table */
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
.systgid {
|
||||
.systgid { /* System and Talkgroup Text */
|
||||
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #000060;
|
||||
|
@ -285,7 +313,6 @@ div.adjacent { /* adjacent sites container that holds the table */
|
|||
.nav-button-active {
|
||||
background-color: #9cc;
|
||||
background: linear-gradient(#31687e, #56a0bd);
|
||||
/* background: linear-gradient(#8bb, #9cc); */
|
||||
color: #fff;
|
||||
border: 0px;
|
||||
padding: 20px;
|
||||
|
@ -296,14 +323,12 @@ div.adjacent { /* adjacent sites container that holds the table */
|
|||
|
||||
.nav-button:hover {
|
||||
background-color: #699;
|
||||
/* background: linear-gradient(#588, #699); */
|
||||
background: linear-gradient(#56a0bd, #31687e);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.nav-button-active:hover {
|
||||
background-color: #699;
|
||||
/* background: linear-gradient(#588, #699); */
|
||||
background: linear-gradient(#56a0bd, #31687e);
|
||||
}
|
||||
|
||||
|
|
|
@ -254,26 +254,55 @@ function rx_update(d) {
|
|||
// frequency, system, and talkgroup display
|
||||
|
||||
function change_freq(d) {
|
||||
var html = "<span class=\"label\">Frequency: </span><span class=\"value\">" + d['freq'] / 1000000.0;
|
||||
html += "</span> <span class=\"systgid\"> " + d['system'] + " </span><br><br><hr id=\"disphr\" class=\"disp\"><br>";
|
||||
|
||||
var displayTgid = "—";
|
||||
var displayTag = " ";
|
||||
|
||||
var doTruncate = document.getElementById("valTruncate").value; // get truncate value from Configuration
|
||||
|
||||
if (d['tgid'] != null) {
|
||||
html += "<span class=\"label\">Talkgroup ID: </span><span class=\"value\"> " + d['tgid'];
|
||||
html += "</span> <span class=\"systgid\"> " + d['tag'] + " </span>";
|
||||
displayTgid = d['tgid'];
|
||||
displayTag = d['tag'].substring(0,doTruncate);
|
||||
}
|
||||
html += "";
|
||||
|
||||
var html = "<table style=\"width: 512px; height: 112px;\">";
|
||||
html += "<tr>";
|
||||
html += "<td style=\"width: 422px;\"><span class=\"systgid\" id=\"dSys\">" + d['system'].substring(0,doTruncate) + "</span></td>";
|
||||
html += "<td align=\"center\" style=\"width: 88px;\">";
|
||||
html += "<span class=\"label-sm\">Frequency</span><br><span class=\"value\">" + d['freq'] / 1000000.0 + "</span></td>";
|
||||
html += "</tr>";
|
||||
html += "<tr>";
|
||||
html += "<td style=\"width: 422px;\"><span class=\"systgid\" id=\"dTag\">" + displayTag + "</span></td>";
|
||||
html += "<td align=\"center\" style=\"width: 88px;\">";
|
||||
html += "<span class=\"label-sm\">Talkgroup ID</span><br><span class=\"value\">" + displayTgid + "</span>";
|
||||
html += "</td>";
|
||||
html += "</tr></table>";
|
||||
|
||||
var div_s2 = document.getElementById("div_s2");
|
||||
div_s2.innerHTML = html;
|
||||
div_s2.style["display"] = "";
|
||||
if (d['tgid'] != null)
|
||||
|
||||
if (d['tgid'] != null) {
|
||||
current_tgid = d['tgid'];
|
||||
}
|
||||
var fstyle = document.getElementById("valFontStyle").value;
|
||||
var z1 = document.getElementById("valTagFont").value; // set font size of TG Tag
|
||||
var z = document.getElementById("dTag");
|
||||
z.style = "font-size: " + z1 + "px; " + "font-weight: " + fstyle + ";";
|
||||
|
||||
var z1 = document.getElementById("valSystemFont").value; // set font size of System
|
||||
var z = document.getElementById("dSys");
|
||||
z.style = "font-size: " + z1 + "px; " + "font-weight: " + fstyle + ";";
|
||||
|
||||
}
|
||||
|
||||
|
||||
// adjacent sites table
|
||||
|
||||
function adjacent_data(d) {
|
||||
if (Object.keys(d).length < 1)
|
||||
return "";
|
||||
var html = "<div class=\"adjacent\">";
|
||||
var html = "<div class=\"adjacent\">"; // open div-adjacent
|
||||
html += "<table border=1 borderwidth=0 cellpadding=0 cellspacing=0 width=100%>";
|
||||
html += "<tr><th colspan=99 style=\"align: center\">Adjacent Sites</th></tr>";
|
||||
html += "<tr><th>Frequency</th><th>Sys ID</th><th>RFSS</th><th>Site</th><th>Uplink</th></tr>";
|
||||
|
@ -285,8 +314,7 @@ function adjacent_data(d) {
|
|||
ct += 1;
|
||||
html += "<tr style=\"background-color: " + color + ";\"><td>" + freq / 1000000.0 + "</td><td>" + d[freq]['sysid'].toString(16) + "</td><td>" + d[freq]["rfid"] + "</td><td>" + d[freq]["stid"] + "</td><td>" + (d[freq]["uplink"] / 1000000.0) + "</td></tr>";
|
||||
}
|
||||
html += "</table></div>";
|
||||
// box br // end trunk_update HTML
|
||||
html += "</table></div>"; // close div-adjacent // end trunk_update HTML
|
||||
|
||||
// end adjacent sites table
|
||||
|
||||
|
@ -302,7 +330,7 @@ function trunk_update(d) {
|
|||
for (var nac in d) {
|
||||
if (!is_digit(nac.charAt(0)))
|
||||
continue;
|
||||
html += "<div class=\"content\">";
|
||||
html += "<div class=\"content\">"; // open div-content
|
||||
html += "<span class=\"nac\">";
|
||||
html += "NAC " + "0x" + parseInt(nac).toString(16) + " ";
|
||||
html += d[nac]['rxchan'] / 1000000.0;
|
||||
|
@ -329,7 +357,7 @@ function trunk_update(d) {
|
|||
|
||||
// system frequencies table
|
||||
|
||||
html += "<br><div class=\"info\"><div class=\"system\">";
|
||||
html += "<br><div class=\"info\"><div class=\"system\">"; // open div-info open div-system
|
||||
html += "<table border=1 borderwidth=0 cellpadding=0 cellspacing=0 width=100%>";
|
||||
html += "<tr><th colspan=99 style=\"align: center\">System Frequencies</th></tr>";
|
||||
html += "<tr><th>Frequency</th><th>Last Seen</th><th colspan=2>Talkgoup ID</th><th>Count</th></tr>";
|
||||
|
@ -344,10 +372,10 @@ function trunk_update(d) {
|
|||
ct += 1;
|
||||
html += "<tr style=\"background-color: " + color + ";\"><td>" + parseInt(freq) / 1000000.0 + "</td><td>" + d[nac]['frequency_data'][freq]['last_activity'] + "</td><td>" + d[nac]['frequency_data'][freq]['tgids'][0] + "</td><td>" + tg2 + "</td><td>" + d[nac]['frequency_data'][freq]['counter'] + "</td></tr>";
|
||||
}
|
||||
html += "</table></div>"; // end system freqencies table
|
||||
html += "</table></div>"; // close div-system // end system freqencies table
|
||||
|
||||
html += adjacent_data(d[nac]['adjacent_data']);
|
||||
html += "</div><br></div><hr><br>";
|
||||
html += "</div><br></div><hr><br>"; // close div-content close div-info box-br hr-separating each NAC
|
||||
}
|
||||
var div_s1 = document.getElementById("div_s1");
|
||||
div_s1.innerHTML = html;
|
||||
|
|
Loading…
Reference in New Issue