node-red-contrib-ramp-thermostat/ramp-thermostat/ramp-thermostat.html

<script type="text/x-red" data-template-name="ramp-thermostat">
    <div class="form-row">
        <label for="node-input-profile"><i class="fa fa-line-chart"></i> Profile</label>
        <input type="text" id="node-input-profile">
    </div>
    <div class="form-row">
        <label for="node-input-hysteresisplus"><i class="fa fa-arrows-v"></i> Hysteresis [+]</label>
        <input type="text" id="node-input-hysteresisplus" style="width:50px">
    </div>
    <div class="form-row">
        <label for="node-input-hysteresisminus"><i class="fa fa-arrows-v"></i> Hysteresis [-]</label>
        <input type="text" id="node-input-hysteresisminus" style="width:50px">
    </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-tips"><span>The Hysteresis is used to prevent osciliation. The [+] value is added to the target and the [-] (absolute) value is subtracted from the target. Within this neutral zone no action accurs.</span>
    </div>
</script>

<script type="text/x-red" data-help-name="ramp-thermostat">
    <p>A node that emulates a thermostat.</p>
    <p>The ramp-thermostat controls an actuator depending on the current input temperature and the target temperature.</p>
    <p>The target temperature is defined by a profile that
    provides the value depending on the current time <code>00:00-24:00</code>.
    The profile consists of several points whose connections build a sequence of lines.
    The switching moment can be optimized by defining a gradient line like a <code>ramp</code>.</p>
    <p>Input settings at runtime:</p>
      <ul>
        <li>msg.topic: setTarget, msg.payload: number</li>
        <li>msg.topic: setProfile, msg.payload: profile-name</li>
      </ul>

    <p>The node provides 3 outputs:</p>
      <ul>
        <li><code>state (boolean)</code></li>
        <li><code>current temperature</code></li>
        <li><code>target temperature</code></li>
      </ul>
</script>

<script type="text/javascript">
    RED.nodes.registerType('ramp-thermostat',{
        category: 'smart home',
        color: '#E9967A',
        defaults: {
            name: {value:""},
            profile: {value:"",type:"profile"},
            hysteresisplus: {value:""},
            hysteresisminus: {value:""}
        },
        inputs:1,
        outputs:3,
        icon: "trigger.png",
        label: function() {
            return this.name||"ramp-thermostat";
        },
        paletteLabel: 'thermostat'
    });
</script>

<script type="text/x-red" data-template-name="profile">
  <div class="form-row">
    <label for="node-config-input-name"><i class="fa fa-tag"></i> Name</label>
    <input type="text" id="node-config-input-name">
  </div>
  
  <div>
    <label style="float:left; margin-bottom:10px"><i class="fa fa-dot-circle-o"></i> Points:</label>
    <label style="float:left;margin-left:45px;"> Time (hh:mm)&nbsp;&nbsp&nbsp;Temp (°)</label>
  </div>
  <div class="form-row">
    <label for="node-config-input-time1"><i class="fa fa-dot-circle-o"></i> #1</label>
    <input class="input-append-left" type="text" id="node-config-input-time1" style="width:50px">
    <input type="text" id="node-config-input-temp1" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time2"><i class="fa fa-dot-circle-o"></i> #2</label>
    <input class="input-append-left" type="text" id="node-config-input-time2" style="width:50px">
    <input type="text" id="node-config-input-temp2" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time3"><i class="fa fa-dot-circle-o"></i> #3</label>
    <input class="input-append-left" type="text" id="node-config-input-time3" style="width:50px">
    <input type="text" id="node-config-input-temp3" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time4"><i class="fa fa-dot-circle-o"></i> #4</label>
    <input class="input-append-left" type="text" id="node-config-input-time4" style="width:50px">
    <input type="text" id="node-config-input-temp4" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time5"><i class="fa fa-dot-circle-o"></i> #5</label>
    <input class="input-append-left" type="text" id="node-config-input-time5" style="width:50px">
    <input type="text" id="node-config-input-temp5" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time6"><i class="fa fa-dot-circle-o"></i> #6</label>
    <input class="input-append-left" type="text" id="node-config-input-time6" style="width:50px">
    <input type="text" id="node-config-input-temp6" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time7"><i class="fa fa-dot-circle-o"></i> #7</label>
    <input class="input-append-left" type="text" id="node-config-input-time7" style="width:50px">
    <input type="text" id="node-config-input-temp7" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time8"><i class="fa fa-dot-circle-o"></i> #8</label>
    <input class="input-append-left" type="text" id="node-config-input-time8" style="width:50px">
    <input type="text" id="node-config-input-temp8" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time9"><i class="fa fa-dot-circle-o"></i> #9</label>
    <input class="input-append-left" type="text" id="node-config-input-time9" style="width:50px">
    <input type="text" id="node-config-input-temp9" style="margin-left:45px; width:50px">
  </div>
  <div class="form-row">
    <label for="node-config-input-time10"><i class="fa fa-dot-circle-o"></i> #10</label>
    <input class="input-append-left" type="text" id="node-config-input-time10" style="width:50px">
    <input type="text" id="node-config-input-temp10" style="margin-left:45px; width:50px">
  </div>
  <div class="form-tips"><span>A Profile has at least 2 Points and should typically start at 00:00 and end at 24:00.</span>
  </div>
</script>

<script type="text/javascript">
    RED.nodes.registerType('profile',{
        category: 'config',
        defaults: {
            name: {value:'',required:true},
            time1: {value:''},
            temp1: {value:''},
            time2: {value:''},
            temp2: {value:''},
            time3: {value:''},
            temp3: {value:''},
            time4: {value:''},
            temp4: {value:''},
            time5: {value:''},
            temp5: {value:''},
            time6: {value:''},
            temp6: {value:''},
            time7: {value:''},
            temp7: {value:''},
            time8: {value:''},
            temp8: {value:''},
            time9: {value:''},
            temp9: {value:''},
            time10: {value:''},
            temp10: {value:''},
        },
        label: function() {
            return this.name;
        }
    });
</script>