Compare commits
	
		
			2 Commits
		
	
	
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 
						 | 
					269cbfdd22 | ||
| 
						 | 
					c48c624f71 | 
@@ -72,7 +72,15 @@ long pause_until_millis = 0;
 | 
			
		||||
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,7 +131,7 @@ 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>
 | 
			
		||||
@@ -138,24 +146,29 @@ const char index_html[] PROGMEM = R"rawliteral(
 | 
			
		||||
      <option value="5">5 - MO5</option>
 | 
			
		||||
    </select><br>
 | 
			
		||||
 | 
			
		||||
    Custom message: <input type="text" name="inputCustomMsg" value = "%inputCustomMsg%"><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. -->
 | 
			
		||||
@@ -166,9 +179,41 @@ const char index_html[] PROGMEM = R"rawliteral(
 | 
			
		||||
 | 
			
		||||
    <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";
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user