dominic/MMDVMHost-Websocketboard
1
0
Fork 0
Code Releases Activity

Presenting RSSI-values in nicer optics (like on the old dashboard).

Browse source
This commit is contained in:
Kim Huebel 2021-02-02 23:01:58 +00:00
parent f5fe39f27b
commit 2725d817ec
9 changed files with 74 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
html/css/tooltip.css Normal file
View file

@ -0,0 +1,46 @@
/* Tooltip container */
.tooltip2 {
position: relative;
display: inline-block;
border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}
/* Tooltip text */
.tooltip2 .tooltip2text {
visibility: hidden;
width: 200px;
background-color: #555;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
/* Position the tooltip text */
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -60px;
/* Fade in tooltip */
opacity: 0;
transition: opacity 1s;
}
/* Tooltip arrow */
.tooltip2 .tooltip2text::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip2:hover .tooltip2text {
visibility: visible;
opacity: 1;
}

BIN
html/images/0.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 394 B

BIN
html/images/1.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 452 B

BIN
html/images/2.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 493 B

BIN
html/images/3.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 531 B

BIN
html/images/4.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 571 B

1
html/index.html
View file

@ -24,6 +24,7 @@
<script type="text/javascript" src="metar.js/metar.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/tooltip.css">
<title>DG9VH - MMDVM-Dashboard by DG9VH</title>
</head>
<body>

27
html/js/functions.js
View file

@ -149,9 +149,34 @@ function getLoss(logline) {
}
}
function getRSSI(logline) {
rssi_raw = logline.substring(logline.lastIndexOf("RSSI:"));
rssi = parseInt(rssi_raw.substring(rssi_raw.lastIndexOf("/")+1, rssi_raw.lastIndexOf("dBm")-1));
if (rssi > "-53") retval = "<img src=\"images/4.png\" \> <div class=\"tooltip2\">S9<sup> +40dB</sup> (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-63") retval = "<img src=\"images/4.png\" \> <div class=\"tooltip2\">S9<sup> +30dB</sup> (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-73") retval = "<img src=\"images/4.png\" \> <div class=\"tooltip2\">S9<sup> +20dB</sup> (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-83") retval = "<img src=\"images/4.png\" \> <div class=\"tooltip2\">S9<sup> +10dB</sup> (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-93") retval = "<img src=\"images/4.png\" \> <div class=\"tooltip2\">S9 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-99") retval = "<img src=\"images/3.png\" \> <div class=\"tooltip2\">S8 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-105") retval = "<img src=\"images/3.png\" \> <div class=\"tooltip2\">S7 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-111") retval = "<img src=\"images/2.png\" \> <div class=\"tooltip2\">S6 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-117") retval = "<img src=\"images/2.png\" \> <div class=\"tooltip2\">S5 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-123") retval = "<img src=\"images/1.png\" \> <div class=\"tooltip2\">S4 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-129") retval = "<img src=\"images/1.png\" \> <div class=\"tooltip2\">S3 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-135") retval = "<img src=\"images/0.png\" \> <div class=\"tooltip2\">S2 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
else if (rssi > "-141") retval = "<img src=\"images/0.png\" \> <div class=\"tooltip2\">S1 (" + rssi + " dBm)<span class=\"tooltip2text\">(min/max/avg)<br>" + rssi_raw + "</span></div>";
return retval;
}
function getBER(logline) {
if(logline.lastIndexOf("BER") > 0) {
return logline.substring(logline.lastIndexOf("BER") + 4);
if(logline.lastIndexOf("RSSI:") > 0) {
retval = logline.substring(logline.lastIndexOf("BER") + 4, logline.lastIndexOf("RSSI:"));
retval += " " + getRSSI(logline);
return retval;
} else {
return logline.substring(logline.lastIndexOf("BER") + 4);
}
} else {
return "";
}

2
html/js/version.js
View file

@ -1 +1 @@
var dashboard_version = "2021-02-02 21:16:56";
var dashboard_version = "2021-02-02 23:01:58";