Shelve.

Merge pull request 'Add custom message ability' (#47 ) from custom-message into main
2023-09-16 19:17:31 -05:00 · 2023-09-16 17:04:22 -05:00 · 2023-09-16 15:48:03 -05:00 · 2023-09-16 09:51:39 -05:00
1 changed files with 83 additions and 34 deletions
--- a/vulpes/src/main.cpp
+++ b/vulpes/src/main.cpp
@ -38,10 +38,10 @@ const int alarmPin = 4; // pin to monitor for RTC alarms
 const char* ssid = WIFI_SSID;
 const char* password = WIFI_PASSWORD;

-const char* PARAM_STRING = "inputString";
 const char* PARAM_SEND = "inputSend";
 const char* PARAM_WPM = "inputWPM";
 const char* PARAM_MSG = "inputMsg";
+const char* PARAM_CMSG = "inputCustomMsg";
 const char* PARAM_FLOAT = "inputFloat";
 const char* PARAM_TIME = "inputTimeUnix";
 const char* PARAM_START = "inputStartTimeUnix";
@ -51,11 +51,11 @@ const char* PARAM_CYCLEID = "inputCycleID";
 const char* PARAM_NTRANS = "inputNtransmitters";

 // Global variables
-String yourInputString;
 int yourInputSend;
 int yourInputWPM;
 int yourInputMsg;
 int yourInputMsg_old; // to save previous state and check changes
+String yourInputCustomMsg;
 float yourInputFloat;
 uint32_t yourInputTime; //to keep time
 uint32_t yourInputStartTimeUnix;
@ -68,11 +68,19 @@ long start_millis = 0;
 long stop_millis = 0;
 long pause_until_millis = 0;

-// HTML web page to handle 3 input fields (inputString, inputSend, inputFloat)
+// HTML web page to handle input fields 
 const char index_html[] PROGMEM = R"rawliteral(
 <!DOCTYPE HTML><html><head>
  <link rel="icon" href="data:,">
-  <title>ESP Input Form</title>
+  <title>Vulpes Radio Orienteering Controller</title>
+  <style>
+    .inv_message {
+      display: none;
+      }
+    .inv_program {
+      display: none;
+      }
+  </style>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script type="text/javascript">
    // Utility from https://webreflection.medium.com/using-the-input-datetime-local-9503e7efdce
@ -123,51 +131,89 @@ const char index_html[] PROGMEM = R"rawliteral(
    <h2>General Settings</h2>
    <p>Sending program:
    <select name="inputSend" id="send-program">
-      <option value="0" >0 - Off</option>
+      <option value="0">0 - Off</option>
      <option value="1">1 - Continuous</option>
      <option value="2">2 - Cycle</option>
    </select><br>

    Message:
    <select name="inputMsg" id="message">
-      <option value="0">0 - TEST TEST TEST DE W1CDN</option>
+      <option value="0">0 - Custom Message</option>
      <option value="1">1 - MOE</option>
      <option value="2">2 - MOI</option>
      <option value="3">3 - MOS</option>
      <option value="4">4 - MOH</option>
      <option value="5">5 - MO5</option>
    </select><br>
+
+    <!-- Hidden unless "0 - Custom Message" is selected -->
+    <span id="message0" class="inv_message">
+      Custom message: <input type="text" name="inputCustomMsg" value = "%inputCustomMsg%"><br>
+    </span>
    
    Speed: <input type="number" name="inputWPM" value = %inputWPM%> WPM
    </p>

-    <h2>Cycle Settings</h2>
-    <p>Only applies when <em>Sending Program</em> is set to "2 - Cycle". You cannot set a cycle start date more than a month in advance.</p>
-    <p>Cycle start time <input type="datetime-local" id="js_start_time_unix_entry" /><br>
-    Current value: <b><span id=current-start></span></b>
-    
-    <!-- JS converts the entered start time to a unix timestamp, and copies that value
-    to this hidden field so the user doesn't have to see it. -->
-    <input type="hidden" name="inputStartTimeUnix" id="js_start_time_unix" /></p>
-    <p>
-      Step length: <input type="number" name="inputStepLength" min=1000 step=1000 value = %inputStepLength%> milliseconds <br>
-      Cycle ID: <input type="number" name="inputCycleID" min=1 value = %inputCycleID%><br>
-      Number of transmitters: <input type="number" name="inputNtransmitters" min=1 value = %inputNtransmitters%><br>
-    </p>
+    <!-- Hidden unless "2 - Cycle" is selected -->
+    <span id="program2" class="inv_program">
+      <h2>Cycle Settings</h2>
+      <p>Only applies when <em>Sending Program</em> is set to "2 - Cycle". You cannot set a cycle start date more than a month in advance.<br>
+      Cycle start time <input type="datetime-local" id="js_start_time_unix_entry" /><br>
+      Current value: <b><span id=current-start></span></b><br>
+      
+      <!-- JS converts the entered start time to a unix timestamp, and copies that value
+      to this hidden field so the user doesn't have to see it. -->
+      <input type="hidden" name="inputStartTimeUnix" id="js_start_time_unix" /></p>
+        Step length: <input type="number" name="inputStepLength" min=1000 step=1000 value = %inputStepLength%> milliseconds <br>
+        Cycle ID: <input type="number" name="inputCycleID" min=1 value = %inputCycleID%><br>
+        Number of transmitters: <input type="number" name="inputNtransmitters" min=1 value = %inputNtransmitters%><br>
+      </p>
+    </span>
    
    <!-- This field is hidden so people don't change the submit time (it will be wrong).
    The value is automatically filled in with JS. -->
    <input type="hidden" name="inputTimeUnix" id="js_time_unix">

    <!-- Extra fields just in case I need them -->  
-    <input type="hidden" name="inputString" value = %inputString%>
    <input type="hidden" name="inputFloat" value = %inputFloat%>

    <input type="submit" value="Submit"">
  </form>
+
+  
+
  <iframe style="display:none" name="hidden-form" id="hidden-form"></iframe>
  <script type="text/javascript">
-    
+    // Show more stuff depending on selected values
+    // https://stackoverflow.com/a/24849350
+    show_message = function () {
+          'use strict';
+          var vis_message = document.querySelector('.vis_message'),   
+              target = document.getElementById("message"+this.value);
+          if (vis_message !== null) {
+              vis_message.className = 'inv_message';
+          }
+          if (target !== null ) {
+              target.className = 'vis_message';
+          }
+    }
+    show_program = function () {
+          'use strict';
+          var vis_program = document.querySelector('.vis_program'),   
+              target = document.getElementById("program"+this.value);
+          if (vis_program !== null) {
+              vis_program.className = 'inv_program';
+          }
+          if (target !== null ) {
+              target.className = 'vis_program';
+          }
+    }
+    document
+      .getElementById('message')
+      .addEventListener('change', show_message);
+    document
+      .getElementById('send-program')
+      .addEventListener('change', show_program);
  </script>
 </body></html>)rawliteral";

@ -211,8 +257,8 @@ void writeFile(fs::FS &fs, const char * path, const char * message){
 // Replaces placeholder in web UI with stored values
 String processor(const String& var){
  //Serial.println(var);
-  if(var == "inputString"){
-    return readFile(SPIFFS, "/inputString.txt");
+  if(var == "inputCustomMsg"){
+    return readFile(SPIFFS, "/inputCustomMsg.txt");
  }
  else if(var == "inputSend"){
    return readFile(SPIFFS, "/inputSend.txt");
@ -308,7 +354,7 @@ void setup() {
    }

  // Read in existing data
-  yourInputString = readFile(SPIFFS, "/inputString.txt");
+  yourInputCustomMsg = readFile(SPIFFS, "/inputCustomMsg.txt");
  yourInputSend = readFile(SPIFFS, "/inputSend.txt").toInt();
  yourInputWPM = readFile(SPIFFS, "/inputWPM.txt").toFloat();
  yourInputMsg = readFile(SPIFFS, "/inputMsg.txt").toInt();
@ -324,8 +370,8 @@ void setup() {
  // On restart, keep doing what you were doing before
  yourInputMsg_old = yourInputMsg;
  if(yourInputMsg == 0){
-    sender_blink.setMessage(String("test test test de w1cdn  "));
-    sender_key.setMessage(String("test test test de w1cdn  "));
+    sender_blink.setMessage(yourInputCustomMsg);
+    sender_key.setMessage(yourInputCustomMsg);
  } else if(yourInputMsg == 1){
    sender_blink.setMessage(String("moe "));
    sender_key.setMessage(String("moe "));
@ -358,14 +404,17 @@ void setup() {
    request->send_P(200, "text/html", index_html, processor);
  });

-  // Send a GET request to <ESP_IP>/get?inputString=<inputMessage>
+  // Send a GET request to <ESP_IP>/get?inputCustomMsg=<inputMessage>
  server.on("/get", HTTP_GET, [] (AsyncWebServerRequest *request) {
    String inputMessage;
-    // GET inputString value on <ESP_IP>/get?inputString=<inputMessage>
-    if (request->hasParam(PARAM_STRING)) {
-      inputMessage = request->getParam(PARAM_STRING)->value();
-      writeFile(SPIFFS, "/inputString.txt", inputMessage.c_str());
-      yourInputString = inputMessage;
+    // GET inputCustomMsg value on <ESP_IP>/get?inputCustomMsg=<inputMessage>
+    if (request->hasParam(PARAM_CMSG)) {
+      inputMessage = request->getParam(PARAM_CMSG)->value();
+      // arduinomorse needs lowercase characters
+      std::transform(inputMessage.begin(), inputMessage.end(), inputMessage.begin(), ::tolower);
+      writeFile(SPIFFS, "/inputCustomMsg.txt", inputMessage.c_str());
+      yourInputCustomMsg = inputMessage;
+      
    }
    // GET inputSend value on <ESP_IP>/get?inputSend=<inputMessage>
    if (request->hasParam(PARAM_SEND)) {
@ -397,8 +446,8 @@ void setup() {

      // Check the message every time the form is submitted.
      if(yourInputMsg == 0){
-        sender_blink.setMessage(String("test test test de w1cdn  "));
-        sender_key.setMessage(String("test test test de w1cdn  "));
+        sender_blink.setMessage(yourInputCustomMsg);
+        sender_key.setMessage(yourInputCustomMsg);
      } else if(yourInputMsg == 1){
        sender_blink.setMessage(String("moe "));
        sender_key.setMessage(String("moe "));
Author	SHA1	Message	Date
mattbk	269cbfdd22	Shelve.	2023-09-16 19:17:31 -05:00
mattbk	c48c624f71	Shelve.	2023-09-16 17:04:22 -05:00
W1CDN	dccd3d27f4	Merge pull request 'Add custom message ability' (#47 ) from custom-message into main Reviewed-on: #47	2023-09-16 15:48:03 -05:00
mattbk	2618d82e12	Add custom message ability	2023-09-16 09:51:39 -05:00