From 7db0e8ff1163675865a153527373cad030d00833 Mon Sep 17 00:00:00 2001 From: "Hansi, dl9rdz" Date: Sat, 13 Feb 2021 12:23:21 +0100 Subject: [PATCH] web ui usability enhancements --- RX_FSK/RX_FSK.ino | 65 ++++++++++++++++++++++++++++--------- RX_FSK/data/index.html | 53 ++++++++++++------------------ RX_FSK/data/rdz.js | 28 ++++++++++++++++ RX_FSK/data/style.css | 59 ++++++++++++++++++++++++++++++--- RX_FSK/version.h | 4 +-- libraries/SondeLib/RS41.cpp | 2 +- 6 files changed, 155 insertions(+), 56 deletions(-) create mode 100644 RX_FSK/data/rdz.js diff --git a/RX_FSK/RX_FSK.ino b/RX_FSK/RX_FSK.ino index 520110a..00cb44c 100644 --- a/RX_FSK/RX_FSK.ino +++ b/RX_FSK/RX_FSK.ino @@ -214,9 +214,24 @@ void setupChannelList() { file.close(); } +const char *HTMLHEAD=" "; +void HTMLBODY(char *ptr, const char *which) { + strcat(ptr, "
"); +} +void HTMLBODYEND(char *ptr) { + strcat(ptr, "
"); +} +void HTMLSAVEBUTTON(char *ptr) { + strcat(ptr, "
"); +} + const char *createQRGForm() { char *ptr = message; - strcpy(ptr, ""); + strcpy(ptr, HTMLHEAD); + strcat(ptr, ""); +/* strcat(ptr, ""); - - strcat(ptr, "
"); +*/ + HTMLBODY(ptr, "qrg.html"); + //strcat(ptr, "
IDActiveFreqLaunchsiteMode
"); + strcat(ptr, "
IDActiveFreqLaunchsiteMode
"); for (int i = 0; i < sonde.config.maxsonde; i++) { //String s = sondeTypeSelect(i >= sonde.nSonde ? 2 : sonde.sondeList[i].type); String site = sonde.sondeList[i].launchsite; sprintf(ptr + strlen(ptr), "" - "" + "" "" //"", "
IDActiveFreqLaunchsiteMode
%d", @@ -258,7 +275,10 @@ const char *createQRGForm() { i + 1, i >= sonde.nSonde ? 2 : sondeTypeChar[sonde.sondeList[i].type] ); //i + 1, s.c_str()); } - strcat(ptr, "
"); + strcat(ptr, ""); + //
"); + HTMLSAVEBUTTON(ptr); + HTMLBODYEND(ptr); Serial.printf("QRG form: size=%d bytes\n", strlen(message)); return message; } @@ -353,7 +373,9 @@ void setupWifiList() { const char *createWIFIForm() { char *ptr = message; char tmp[4]; - strcpy(ptr, "
"); + strcpy(ptr, HTMLHEAD); strcat(ptr, ""); + HTMLBODY(ptr, "wifi.html"); + strcat(ptr, "
NrSSIDPassword
"); for (int i = 0; i < MAX_WIFI; i++) { sprintf(tmp, "%d", i); sprintf(ptr + strlen(ptr), "" @@ -362,7 +384,10 @@ const char *createWIFIForm() { i + 1, i < nNetworks ? networks[i].id.c_str() : "", i + 1, i < nNetworks ? networks[i].pw.c_str() : ""); } - strcat(ptr, "
NrSSIDPassword
%s
"); + strcat(ptr, ""); + //
"); + HTMLSAVEBUTTON(ptr); + HTMLBODYEND(ptr); Serial.printf("WIFI form: size=%d bytes\n", strlen(message)); return message; } @@ -436,7 +461,8 @@ void addSondeStatus(char *ptr, int i) const char *createStatusForm() { char *ptr = message; - strcpy(ptr, ""); + strcpy(ptr, HTMLHEAD); + strcat(ptr, ""); for (int i = 0; i < sonde.nSonde; i++) { int snum = (i + sonde.currentSonde) % sonde.nSonde; @@ -607,7 +633,9 @@ void addConfigInt8List(char *ptr, int idx, const char *label, int8_t *list) { const char *createConfigForm() { char *ptr = message; - strcpy(ptr, "
"); + strcpy(ptr, HTMLHEAD); strcat(ptr, ""); + HTMLBODY(ptr, "config.html"); + strcat(ptr, "
OptionValue
"); for (int i = 0; i < N_CONFIG; i++) { switch (config_list[i].type) { case -5: // Heading @@ -636,7 +664,10 @@ const char *createConfigForm() { break; } } - strcat(ptr, "
OptionValue
"); + strcat(ptr, ""); + //
"); + HTMLSAVEBUTTON(ptr); + HTMLBODYEND(ptr); Serial.printf("Config form: size=%d bytes\n", strlen(message)); return message; } @@ -695,21 +726,23 @@ const char *handleConfigPost(AsyncWebServerRequest *request) { const char *ctrlid[] = {"rx", "scan", "spec", "wifi", "rx2", "scan2", "spec2", "wifi2"}; -const char *ctrllabel[] = {"Receiver (short keypress)", "Scanner (double keypress)", "Spectrum (medium keypress)", "WiFi (long keypress)", - "Button 2 (short keypress)", "Button 2 (double keypress)", "Button 2 (medium keypress)", "Button 2 (long keypress)" +const char *ctrllabel[] = {"Receiver/next freq. (short keypress)", "Scanner (double keypress)", "Spectrum (medium keypress)", "WiFi (long keypress)", + "Button 2/next screen (short keypress)", "Button 2 (double keypress)", "Button 2 (medium keypress)", "Button 2 (long keypress)" }; const char *createControlForm() { char *ptr = message; - strcpy(ptr, "
"); + strcpy(ptr, HTMLHEAD); strcat(ptr, ""); + HTMLBODY(ptr, "control.html"); for (int i = 0; i < 8; i++) { - strcat(ptr, "
"); + strcat(ptr, "\">"); + if(i==3) { strcat(ptr, "

"); } } - strcat(ptr, "
"); + HTMLBODYEND(ptr); Serial.printf("Control form: size=%d bytes\n", strlen(message)); return message; } diff --git a/RX_FSK/data/index.html b/RX_FSK/data/index.html index e0acb1d..1bc15ae 100644 --- a/RX_FSK/data/index.html +++ b/RX_FSK/data/index.html @@ -1,64 +1,50 @@ - RDZSonde Server + rdzTTGOsonde Server + -

RDZSonde Server

- +
+

RDZSonde Server

-
+
-

QRG - Setup

- +
-

WiFi - Settings

- +
-

Data

- +
- -
-

Configuration

- +
-

Control

- +
-

About

+
%VERSION_NAME%
- Copyright © 2019-2020 by Hansi Reiser, DL9RDZ
+ Copyright © 2019-2021 by Hansi Reiser, DL9RDZ
(version %VERSION_ID%)

with contributions by Vigor and Xavier (M20 support), Meinhard Guenther, DL2MF, Johannes, Robert Stefanowicz, @@ -68,14 +54,16 @@
Autodetect info: %AUTODETECT_INFO%

- This program 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 2 of
+ This program 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 2 of the License, or (at your option) any later version.
- see https://www.gnu.org/licenses/gpl-2.0.txt - for details + See https://www.gnu.org/licenses/gpl-2.0.txt + for details. +
+
+ diff --git a/RX_FSK/data/rdz.js b/RX_FSK/data/rdz.js new file mode 100644 index 0000000..e041dec --- /dev/null +++ b/RX_FSK/data/rdz.js @@ -0,0 +1,28 @@ +let stypes=new Map(); +stypes.set('4', 'RS41'); +stypes.set('R', 'RS92'); +stypes.set('9', 'DFM9 (old)'); +stypes.set('6', 'DFM6 (old)'); +stypes.set('D', 'DFM'); +stypes.set('M', 'M10'); +stypes.set('2', 'M20'); + +/* Used by qrg.html in RX_FSK.ino */ +function prep() { + var stlist=document.querySelectorAll("input.stype"); + for(txt of stlist){ + var val=txt.getAttribute('value'); var nam=txt.getAttribute('name'); + var sel=document.createElement('select'); + sel.setAttribute('name',nam); + for(stype of stypes) { + var opt=document.createElement('option'); + opt.value=stype[0]; + opt.innerHTML=stype[1]; + if(stype[0]==val) { opt.setAttribute('selected','selected'); } + sel.appendChild(opt); + } + txt.replaceWith(sel); + } +} + +window.onload = prep; diff --git a/RX_FSK/data/style.css b/RX_FSK/data/style.css index 63e9b6b..e098874 100644 --- a/RX_FSK/data/style.css +++ b/RX_FSK/data/style.css @@ -4,6 +4,18 @@ body, html { font-family: Arial; } +.wrapper { + height: 100%; + display: flex; + flex-direction: column; + margin: 0; +} +.tci { + flex-grow: 1; border: none; margin: 0; padding: 0; +} +.footer { +} + table, th, td { border: 1px solid black; border-collapse: collapse; @@ -31,7 +43,8 @@ td#sfreq { border: none; outline: none; cursor: pointer; - padding: 14px 16px; + padding: 10px 10px; + width: 16vw; transition: 0.3s; } @@ -42,13 +55,21 @@ td#sfreq { .tab button.active { background-color: #ccc; } - +.content { + display: flex; + flex: 1; + flex-direction: column; + overflow: auto; + height: 100%; +} .tabcontent { display: none; + flex: 1; padding: 6px 12px; border: 1px solid #ccc; border-top: none; - height: 100%; + flex-direction: column; + overflow: auto; } html { @@ -59,12 +80,12 @@ html { } h1{ color: #0F3376; - padding: 2vh; + font-size: 24px } p{ font-size: 1.5rem; } -.button { +.canberemoved_button { display: inline-block; background-color: #008CBA; border: none; @@ -79,3 +100,31 @@ p{ .button2 { background-color: #f44336; } +.save { + background-color: #0F3376; + border: black; + border-width: 1; + color: white; + padding: 8px 30px; + text-align: center; + text-decoration: none; + display: block; + font-size: 14px; + margin: 0 +} +.ctlbtn { + background-color: #ccc; + border: black; + border-width: 1; + color: black; + padding: 4px 30px; + text-align: center; + text-decoration: none; + display: block; + margin: 2; + font-size: 4vh; +} +.update { + margin: 0; + display: block; +} diff --git a/RX_FSK/version.h b/RX_FSK/version.h index e5049d5..e8cc738 100644 --- a/RX_FSK/version.h +++ b/RX_FSK/version.h @@ -1,4 +1,4 @@ const char *version_name = "rdzTTGOsonde"; -const char *version_id = "devel20210209"; +const char *version_id = "devel20210213"; const int SPIFFS_MAJOR=2; -const int SPIFFS_MINOR=9; +const int SPIFFS_MINOR=10; diff --git a/libraries/SondeLib/RS41.cpp b/libraries/SondeLib/RS41.cpp index a71c9ac..6047914 100644 --- a/libraries/SondeLib/RS41.cpp +++ b/libraries/SondeLib/RS41.cpp @@ -357,7 +357,7 @@ static void posrs41(const byte b[], uint32_t b_len, uint32_t p) sonde.si()->dir = dir; Serial.print(" "); sonde.si()->hs = sqrt((float)(vn*vn+ve*ve)); - Serial.print(sonde.si()->hs); + Serial.print(sonde.si()->hs*3.6); Serial.print("km/h "); Serial.print(dir); Serial.print("deg ");