nighttime.html

<script type="text/x-red" data-template-name="nighttime">
    <div class="form-row">
      <label for="node-input-lat"><i class="fa fa-globe"></i> Latitude</label>
      <input type="text" id="node-input-lat" placeholder="51.025">
    </div>
    <div class="form-row">
      <label for="node-input-lon"><i class="fa fa-globe"></i> Longitude</label>
      <input type="text" id="node-input-lon" placeholder="-1.4">
    </div>
    <div class="form-row">
      <label for="node-input-start"><i class="fa fa-clock-o"></i> Sunrise</label>
      <select id="node-input-start" style='width:70%'>
        <option value="sunrise">Sunrise start</option>
        <option value="sunriseEnd">Sunrise end</option>
        <option value="dawn">Dawn, morning civil twilight starts</option>
        <option value="goldenHourEnd">End of morning golden hour</option>
        <option value="nauticalDawn">Morning nautical twilight starts</option>
        <option value="nightEnd">Morning astronomical twilight starts</option>
      </select>
    </div>
    <div class="form-row">
      <label for="node-input-end"><i class="fa fa-clock-o"></i> Sunset</label>
      <select id="node-input-end" style='width:70%'>
        <option value="sunset">Sunset, civil twilight starts</option>
        <option value="sunsetStart">Sunset start</option>
        <option value="goldenHour">Start of evening golden hour</option>
        <option value="dusk">Dusk, Evening astronomical twilight starts</option>
        <option value="nauticalDusk">Evening nautical twilight starts</option>
        <option value="night">Dark enough for astronomy</option>
      </select>
    </div>
    <div class="form-row">
      <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
      <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row">
        <p style="margin-top: 10px;"<span>lat and long will autofill if you allowed location service. If not,</span></p>
        <p style="margin-top: 10px;"<span>Get your lat long coordinates from:  </span> <a href="https://www.latlong.net/" target="_blank" style="text-decoration:underline;">www.latlong.net</a></p>
    </div>
  </script>
  
  <script type="text/x-red" data-help-name="nighttime">
    <p>A simple node indicating if it's day or night.</p>
    <p>The node sets: <code>msg.payload</code> to boolean <code>true</code> or <code>false</code> payloads.</p>
    <p>It also sets a global <code>isNight</code> accessible in all flows.</p>
    <p>The node checks every minute to poll new data.</p>
    <p>it sends a <code>true</code> payload if it is dark and <code>false</code> if not dark.</p>
    <p>The second output emits only on the transition between night to day or day to night.</p>
</script>
  
  <script type="text/javascript">
      RED.nodes.registerType('nighttime',{
          category: 'advanced-input',
          color:"#ffcc66",
          defaults: {
          name: {value:""},
              lon: {value:"", validate:function(v) {return ((v>=-180) && (v<=180));} },
              lat: {value:"", validate:function(v) {return ((v>=-90) && (v<=90));} },
              start: {value:"sunrise", required:true},
              end: {value:"sunset", required:true}
          },
          inputs:0,
          outputs:2,
          outputLabels: ["once per minute","only on change"],
          icon: "sun.png",
          label: function() {
              return this.name||"nighttime";
          },
          labelStyle: function() {
              return this.name?"node_label_italic":"";
          },
          oneditprepare: function() {
              if (($("#node-input-lat").val() === "") && ($("#node-input-lon").val() === "")) {
                  if ("geolocation" in navigator) {
                      navigator.geolocation.getCurrentPosition(function(position) {
                          $("#node-input-lat").val(Number(position.coords.latitude.toFixed(5)));
                          $("#node-input-lon").val(Number(position.coords.longitude.toFixed(5)));
                      });
                  }
              }
          }
      });
  </script>