datasource.html

<style>
  .form-row.checkbox > input[type="checkbox"] {
    width:10%;
  }

  .form-row.checkbox > label {
    width:80%;
  }
</style>

<script type="text/javascript">
  RED.nodes.registerType( 'iot-datasource' , {
      category: 'GatewayKit',
      color: '#cd97d3',
      defaults: {
          name: { value : "" },
          tstampField : { value : "" },
          dataField : { value : "" },
          disableDiscover : { value : false }
      },
      inputs:1,
      outputs:1,
      icon: "db.png",
      label: function() {
          return this.name || "IoT Datasource";
      },
      align: "right"
  });
</script>

<script type="text/x-red" data-template-name="iot-datasource">
  <div class="form-row">
    <label for="node-input-name"><i class="icon-tag"></i> Name</label>
    <input type="text" id="node-input-name" placeholder="Name">
  </div>
  <div class="form-row checkbox">
    <input type="checkbox" id="node-input-disableDiscover">
    <label for="node-input-disableDiscover">Disable subcomponent discovery</label>
  </div>
  <h5>Timestamp Field</h5>
  <div class="form-row">
    msg.payload.<input type="text" id="node-input-tstampField" placeholder="tstamp">
  </div>
  <h5>Data Field</h5>
  <div class="form-row">
    msg.payload.<input type="text" id="node-input-dataField" placeholder="data">
  </div>
</script>

<script type="text/x-red" data-help-name="iot-datasource">
    <p>IoT Gateway Kit Datasource node.</p>
    <h4><strong>Configuration</strong></h4>
    <p><strong>Disable subcomponent discovery</strong> - If checked, the datasource will not attempt to look inside the data field and split it into subfields.
    For example, if your data format looks something like this...</p>
    <pre><code>msg.payload = {
  tstamp: 1438637044000,
  data: {
    x: 3.14,
    y: 1.41,
    z: 6.02
  }
}</code></pre>
    <p>... having discovery enabled will allow the datasource to go inside <code>msg.payload.data</code> and find the fields <code>x</code>, <code>y</code>, and
    <code>z</code>, and present them to the Dashboard as separate data points. If disabled, however, the Dashboard will receive the entire JSON Object
    <code>msg.payload.data</code> as one data point.<br>
    A line chart might need them split up so it can chart the data points separately, but a 3d scattered plot would need the data intact, since the entire object
    would represent just one data point on the plot.</p>
    <p><strong>Timestamp Field</strong> - The JSON field the UNIX timestamp is located at<br>(default: <code>msg.payload.tstamp</code>)</p>
    <p><strong>Data Field</strong> - The JSON field the data is located at<br>(default: <code>msg.payload.data</code>)</p>
</script>