node-red-contrib-sunpos/sunpos/sunpos.html

A Node-RED node that provides the position of the sun

<!--
  Copyright 2015, 2016 Alisdair Smyth
  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at
  http://www.apache.org/licenses/LICENSE-2.0
  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->
<script type="text/x-red" data-template-name="sunpos">
    <div class="form-row">
        <label for="node-input-lat"><i class="fa fa-globe"></i> <span data-i18n="sunpos.label.lat"></span></label>
        <input type="text" id="node-input-lat" data-i18n="[placeholder]sunpos.placeholder.lat">
    </div>
    <div class="form-row">
        <label for="node-input-lon"><i class="fa fa-globe"></i> <span data-i18n="sunpos.label.lon"></span></label>
        <input type="text" id="node-input-lon" data-i18n="[placeholder]sunpos.placeholder.lon">
    </div>
    <div class="form-row">
        <label for="node-input-start"><i class="fa fa-clock-o"></i> <span data-i18n="sunpos.label.start"></span></label>
        <select id="node-input-start" style='width:70%'>
            <option value="sunrise">Sunrise</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-startoffset"><i class="fa fa-clock-o"></i> <span data-i18n="sunpos.label.startoffset"></span></label>
        <input type="number" id="node-input-startoffset" data-i18n="[placeholder]sunpos.placeholder.startoffset">
    </div>
    <div class="form-row">
        <label for="node-input-end"><i class="fa fa-clock-o"></i> <span data-i18n="sunpos.label.end"></span></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-endoffset"><i class="fa fa-clock-o"></i> <span data-i18n="sunpos.label.endoffset"></span></label>
        <input type="number" id="node-input-endoffset" data-i18n="[placeholder]sunpos.placeholder.endoffset">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="sunpos.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]sunpos.placeholder.name">
    </div>
</script>

<script type="text/javascript">
    RED.nodes.registerType("sunpos",{
        category: "advanced-input",
        color:"#FFCC66",
        defaults: {
            name:  {value:""},
            lon:   {value:"",        required:true,
                    validate: function (v) {
                var n = Number(v);
                return ((n >= -180) && (n <= 180));
                    }
            },
            lat:   {value:"",        required:true,
                    validate: function (v) {
                var n = Number(v);
                return ((n >= -90) && (n <= 90));
                    }
            },
            start: {value:"sunrise", required:true},
            startoffset:   {value:0,  required:false},
            end:   {value:"sunset",  required:true},
            endoffset:   {value:0,  required:false}
        },
        inputs: 1,
        outputs: 1,
        icon: "sun.png",
        label: function() {
            return this.name||"Sun Position";
        },
        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>