1
0
mirror of https://github.com/node-red/node-red-nodes.git synced 2023-10-10 13:36:58 +02:00
node-red-nodes/hardware/blink1/77-blink1.html
2021-06-23 12:21:19 +01:00

112 lines
4.3 KiB
HTML

<script type="text/html" data-template-name="blink1">
<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-row">
<label for="node-input-serial"><i class="fa fa-random"></i> Device ID</label>
<input type="text" id="node-input-serial" placeholder="defaults to first found" style="width:60%">
<a id="node-lookup-serial" class="btn"><i id="node-lookup-serial-icon" class="fa fa-search"></i></a>
</div>
<div class="form-row">
<label for="node-input-fade"><i class="fa fa-signal"></i> Fade (mS)</label>
<input type="text" id="node-input-fade" placeholder="between 0 and 60,000 mS (1 min)">
</div>
</script>
<script type="text/html" data-help-name="blink1">
<p>ThingM Blink1 output node.</p>
<p>Expects a <code>msg.payload</code> with either a three part csv string of
<i>r,g,b</i> or a hex colour <i>#rrggbb</i></p>
<p>You can also use the <a href="http://www.cheerlights.com/control-cheerlights" target="_new">@cheerlights</a>
colour names - red, green, blue, cyan, magenta, yellow, orange, pink,
purple, white, oldlace (warmwhite), and also amber and black (off).</p>
</script>
<script type="text/javascript">
RED.nodes.registerType('blink1',{
category: "blink1",
color:"GoldenRod",
paletteLabel: "blink1 out",
defaults: {
serial: {value:""},
fade: {value:"500",required:true,validate:RED.validators.number()},
name: {value:""}
},
inputs:1,
outputs:0,
icon: "light.png",
align: "right",
label: function() {
return this.name||"blink1";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
},
oneditprepare: function() {
$("#node-lookup-serial").click(function() {
$.getJSON('blink1list',function(data) {
$("#node-input-serial").autocomplete({
source:data,
minLength:0,
close: function( event, ui ) {
$("#node-input-serial").autocomplete( "destroy" );
}
}).autocomplete("search","");
});
});
}
});
</script>
<script type="text/html" data-template-name="blink1 in">
<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-row">
<label for="node-input-serial"><i class="fa fa-random"></i> Device ID</label>
<input type="text" id="node-input-serial" placeholder="defaults to first found" style="width:60%">
<a id="node-lookup-serial" class="btn"><i id="node-lookup-serial-icon" class="fa fa-search"></i></a>
</div>
</script>
<script type="text/html" data-help-name="blink1 in">
<p>ThingM Blink1 input node.</p>
<p>Outputs the current RGB value as array <code>[r,g,b]</code> or "off" as string if RGB is 0,0,0 to <code>msg.payload</code>.</p>
</script>
<script type="text/javascript">
RED.nodes.registerType('blink1 in',{
category: 'blink1',
color:"GoldenRod",
paletteLabel:"blink1 in",
defaults: {
serial: {value:""}
},
inputs:1,
outputs:1,
icon: "light.png",
align: "left",
label: function() {
return this.name||"blink1 in";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
},
oneditprepare: function() {
$("#node-lookup-serial").click(function() {
$.getJSON('blink1list',function(data) {
$("#node-input-serial").autocomplete({
source:data,
minLength:0,
close: function( event, ui ) {
$("#node-input-serial").autocomplete( "destroy" );
}
}).autocomplete("search","");
});
});
}
});
</script>