node-red-nodes/hardware/wemo/WeMoNG.html

<script type="text/x-red" data-template-name="wemo in">
    <div class="form-row">
        <label for="node-input-topic"><i class="fa fa-tasks"></i> Topic</label>
        <input type="text" id="node-input-topic" placeholder="Topic">
    </div>

    <br/>
    <div class="form-row">
        <label for="node-input-device"><i class="fa fa-tasks"></i> Device</label>
        <input type="text" id="node-input-device" placeholder="Device">
    </div>
    <br/>
    <!-- By convention, most nodes have a 'name' property. The following div -->
    <!-- provides the necessary field. Should always be the last option      -->
    <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>
</script>

<script type="text/x-red" data-help-name="wemo in">
  <p>A node that listens to event notifications from Belkin WeMo devices.</p>
  <p>Supported devices include:</p>
  <ul>
    <li>Sockets</li>
    <li>Insight Sockets</li>
    <li>Light Bulbs</li>
    <li>Light Groups</li>
    <li>Motion Detector</li>
  </ul>
  <p>Sockets will generate msg.payload with values of 0/1 for off or on, all other
  types will return an object like this:</p>
  <pre>
  {
    name: 'Bedroom light',
    type: 'light',
    id: '94103EA2B27803ED',
    capability: '1006',
    value: 1
  }
  </pre>
  <p>Current known capabilities</p>
  <ul>
    <li>10006 - on/off</li>
    <li>10008 - brightness</li>
  </ul>
</script>

<script type="text/javascript">
    RED.nodes.registerType('wemo in',{
        category: 'input',      // the palette category
        defaults: {             // defines the editable properties of the node
            name: {value:""},   //  along with default values.
            topic: {value:"wemo", required: true},
            device: {value:"", type: "wemo-dev"}
        },
        color: "LawnGreen",
        inputs:0,               // set the number of inputs - only 0 or 1
        outputs:1,              // set the number of outputs - 0 to n
        // set the icon (held in icons dir below where you save the node)
        icon: "belkin.png",     // saved in  icons/myicon.png
        label: function() {     // sets the default label contents
            return this.name||"wemo";
        },
        labelStyle: function() { // sets the class to apply to the label
            return this.name?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="wemo out">
    <div class="form-row">
        <label for="node-input-device"><i class="fa fa-tasks"></i> Device</label>
        <input type="text" id="node-input-device" placeholder="Device">
    </div>
    <br/>
    <!-- By convention, most nodes have a 'name' property. The following div -->
    <!-- provides the necessary field. Should always be the last option      -->
    <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>
</script>

<script type="text/x-red" data-help-name="wemo out">
  <p>A node to control Belkin WeMo Devices</p>
  <p>Supported devices include:</p>
  <ul>
    <li>Sockets</li>
    <li>Insight Sockets</li>
    <li>Light Bulbs</li>
  </ul>
  <p>Sets the device on or off based on the passed in msg.payload values of:</p>
  <ul>
    <li>on/off</li>
    <li>1/0</li>
    <li>true/false</li>
  </ul>
  <p>for light bulbs it also accepts an object with the following structure</p>
  <pre>
  {
    state: 1,
    dim: 255,
    color: '255,255,255',
    temperature: 25000
  }
  </pre>
</script>

<script type="text/javascript">
    RED.nodes.registerType('wemo out',{
        category: 'output',      // the palette category
        defaults: {             // defines the editable properties of the node
            name: {value:""},   //  along with default values.
            device: {type: "wemo-dev", required: true}
        },
        color: "LawnGreen",
        inputs: 1,               // set the number of inputs - only 0 or 1
        // set the icon (held in icons dir below where you save the node)
        icon: "belkin.png",     // saved in  icons/myicon.png
        label: function() {     // sets the default label contents
            return this.name||"wemo";
        },
        labelStyle: function() { // sets the class to apply to the label
            return this.name?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="wemo-dev">
    <div class="form-row">
        <label for="node-config-input-device"><i class="fa fa-tasks"></i> Device</label>
        <select size="4" id="node-config-input-device">
        </select>
    </div>
    <br/>
    <div class="form-row">
      <label for="node-config-input-type"><i class="fa fa-tasks"></i> Type</label>
      <input type="text" editable="false" id="node-config-input-type" placeholder="Type"/>
      <input type="hidden" editable="false"  id="node-config-input-name"/>
    </div>
</script>

<script type="text/javascript">
    RED.nodes.registerType('wemo-dev',{
        category: 'config',      // the palette category
        defaults: {             // defines the editable properties of the node
            device: {value:"", required: true},   //  along with default values.
            name: {value: ""}
        },
        label: function() {     // sets the default label contents
            return this.name;
        },
        oneditprepare: function() {
            var devices;
            $.getJSON('wemoNG/devices', function(data) {
                devices = data;
                var devs = Object.keys(data);
                if (devs.length !== 0) {
                    for (var d in devs) {
                        if (devs.hasOwnProperty(d)) {
                            $('<option/>',{
                                'value': devs[d],
                                'text': data[devs[d]].name
                            }).appendTo('#node-config-input-device');
                            console.log(data[devs[d]].name);
                        }
                    }
                }
            });

            $('#node-config-input-device').change(function() {
                var id = $( "#node-config-input-device option:selected" ).first().val();
                if (devices) {
                    $('#node-config-input-type').val(devices[id].type);
                    $('#node-config-input-name').val(devices[id].name);
                }
            });
        }
    });
</script>