node-red-nodes/hardware/Arduino/35-arduino.html

<!--
  Copyright 2013,2016 IBM Corp.

  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="arduino in">
    <div class="form-row">
        <label for="node-input-arduino"><i class="fa fa-tasks"></i> Arduino</label>
        <input type="text" id="node-input-arduino">
    </div>
    <div class="form-row">
        <label for="node-input-state"><i class="fa fa-wrench"></i> <span data-i18n="arduino.label.type"></span></label>
        <select type="text" id="node-input-state" style="width: 150px;">
            <option value="INPUT" data-i18n="arduino.state.in.digital"></option>
            <option value="ANALOG" data-i18n="arduino.state.in.analogue"></option>
            <option value="STRING" data-i18n="arduino.state.in.string"></option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-pin"><i class="fa fa-circle"></i> <span data-i18n="arduino.label.pin"></span></label>
        <input type="text" id="node-input-pin" placeholder="2">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
    <div class="form-tips"><span data-i18n="[html]arduino.tip.io"></span></div>
</script>

<script type="text/x-red" data-help-name="arduino in">
    <p>Arduino input node. Connects to a local Arduino and monitors the selected pin for changes. Uses <a href="http://firmata.org/" target="_new"><i>Firmata</i>.</a></p>
    <p>The Arduino must be loaded with the Standard Firmata sketch available in the Arduino examples.</p>
    <p>You can select either Digital or Analogue input. Outputs the value read as <code>msg.payload</code> and the pin number as <code>msg.topic</code>.</p>
    <p>It only outputs on a change of value - fine for digital inputs, but you can get a lot of data from analogue pins which you must then handle.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('arduino in',{
        category: 'Arduino',
        color:"#3fadb5",
        defaults: {
            name: {value:""},
            pin: {value:"",validate: function(v) {
                    var ct = $("#node-input-state").val() || this.state;
                    return ct === 'STRING' || (v !== '');
                }},
            state: {value:"INPUT",required:true},
            arduino: {type:"arduino-board"}
        },
        inputs:0,
        outputs:1,
        icon: "arduino.png",
        label: function() {
            if (this.state === "STRING") { return "String"; }
            var a = "";
            if (this.state === "ANALOG") { a = "A"; }
            return this.name||"Pin: "+a+this.pin;
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        }
    });
</script>

<script type="text/x-red" data-template-name="arduino out">
    <div class="form-row">
        <label for="node-input-arduino"><i class="fa fa-tasks"></i> <span data-i18n="arduino.label.arduino"></span></label>
        <input type="text" id="node-input-arduino">
    </div>
    <div class="form-row">
        <label for="node-input-state"><i class="fa fa-wrench"></i> <span data-i18n="arduino.label.type"></span></label>
        <select type="text" id="node-input-state" style="width: 200px;">
            <option value="OUTPUT" data-i18n="arduino.state.out.digital"></option>
            <option value="PWM" data-i18n="arduino.state.out.analogue"></option>
            <option value="SERVO" data-i18n="arduino.state.out.servo"></option>
            <option value="STRING" data-i18n="arduino.state.out.string"></option>
        </select>
    </div>
    <div class="form-row">
        <label for="node-input-pin"><i class="fa fa-circle"></i> <span data-i18n="arduino.label.pin"></span></label>
        <input type="text" id="node-input-pin" placeholder="13">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="node-red:common.label.name"></span></label>
        <input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
    </div>
    <div class="form-tips"><span data-i18n="[html]arduino.tip.io"></span></div>
</script>

<script type="text/x-red" data-help-name="arduino out">
    <p>Arduino output node. Connects to local Arduino and writes to the selected digital
    pin. Uses <a href="http://firmata.org/" target="_new"><i>Firmata</i>.</a></p>
    <p>The Arduino must be loaded with the Standard Firmata sketch available in the Arduino examples.</p>
    <p>You can select Digital, Analogue (PWM) or Servo type outputs. Expects an integer numeric
    value in <code>msg.payload</code>. The pin number is set in the properties panel.</p>
</script>

<script type="text/javascript">
    RED.nodes.registerType('arduino out', {
        category: 'Arduino',
        color:"#3fadb5",
        defaults: {
            name: {value:""},
            pin: {value:"",validate: function(v) {
                    var ct = $("#node-input-state").val() || this.state;
                    return ct === 'STRING' || (v !== '');
                }},
            state: {value:"",required:true},
            arduino: {type:"arduino-board"}
        },
        inputs:1,
        outputs:0,
        icon: "arduino.png",
        align: "right",
        label: function() {
            if (this.state === "STRING") { return "String"; }
            return this.name||"Pin: "+this.pin;
        },
        labelStyle: function() {
            return this.name?"node_label_italic":"";
        }
    });
</script>


<script type="text/x-red" data-template-name="arduino-board">
    <div class="form-row">
        <label for="node-config-input-device"><i class="fa fa-random"></i> <span data-i18n="arduino.label.port"></span></label>
        <input type="text" id="node-config-input-device" style="width:60%;" data-i18n="[placeholder]arduino.placeholder.port"/>
        <a id="node-config-lookup-serial" class="btn"><i id="node-config-lookup-serial-icon" class="fa fa-search"></i></a>
    </div>
    <div class="form-tips"><span data-i18n="[html]arduino.tip.conf"></span></div>
</script>

<script type="text/javascript">
    RED.nodes.registerType('arduino-board',{
        category: 'config',
        defaults: {
            device: {value:""}
        },
        label: function() {
            return this.device||"arduino";
        },
        oneditprepare: function() {
            try {
                $("#node-config-input-device").autocomplete( "destroy" );
            } catch(err) { }
            $("#node-config-lookup-serial").click(function() {
                $("#node-config-lookup-serial-icon").removeClass('fa-search');
                $("#node-config-lookup-serial-icon").addClass('spinner');
                $("#node-config-lookup-serial").addClass('disabled');

                $.getJSON('arduinoports',function(data) {
                    $("#node-config-lookup-serial-icon").addClass('fa-search');
                    $("#node-config-lookup-serial-icon").removeClass('spinner');
                    $("#node-config-lookup-serial").removeClass('disabled');
                    var ports = [];
                    $.each(data, function(i, port) {
                        ports.push(port.comName);
                    });
                    $("#node-config-input-device").autocomplete({
                        source:ports,
                        minLength:0,
                        close: function( event, ui ) {
                            $("#node-config-input-device").autocomplete( "destroy" );
                        }
                    }).autocomplete("search","");
                });
            });
        }
    });
</script>