<script type="text/html" data-template-name="pi-gpiod in"> <style> .pinTable { width: 300px; display: inline-table; font-size: 13px; height: 380px; min-height: 380px; max-height: 380px; } .pinTableBody { width: 300px; display: table-row-group; line-height: 12px; } .pinTableRow { width: 300; display: table-row; height: 14px; } .pinTableCellL { width: 150px; display: table-cell; text-align: right; padding-right: 4px; vertical-align: top; border: 1px solid #444; } .pinTableCellR { width: 150px; display: table-cell; text-align: left; padding-left: 4px; vertical-align: top; border: 1px solid #000; } .pinColorPower { background-color:#FECBCE; } .pinColorGround { background-color:#DDDDDD; } .pinColorGPIO { background-color:#BFEBBF; } .pinColorDual { background-color:#D0E6F4; } .pinColorSD { background-color:#FFFDD0; } </style> <div class="form-row"> <label><i class="fa fa-circle"></i> <span data-i18n="pi-gpiod.label.gpiopin"></span></label> <input type="text" id="node-input-pin" style="display:none;"> <div class="pinTable"> <div class="pinTableBody"><form id="pinform" style="height:380px; max-height:380px; margin:initial;"> <div class="pinTableRow"> <div class="pinTableCellL pinColorPower">3.3V Power - 1 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorPower"><input disabled type="radio" name="pins" value="" style="width:auto;"> 2 - 5V Power</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SDA1 - GPIO02 - 3 <input type="radio" name="pins" value="2" style="width:auto;"></div> <div class="pinTableCellR pinColorPower"><input disabled type="radio" name="pins" value="" style="width:auto;"> 4 - 5V Power</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SCL1 - GPIO03 - 5 <input type="radio" name="pins" value="3" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 6 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO04 - 7 <input type="radio" name="pins" value="4" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="14" style="width:auto;"> 8 - GPIO14 - TxD</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 9 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="15" style="width:auto;"> 10 - GPIO15 - RxD</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO17 - 11 <input type="radio" name="pins" value="17" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="18" style="width:auto;"> 12 - GPIO18</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO27 - 13 <input type="radio" name="pins" value="27" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 14 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO22 - 15 <input type="radio" name="pins" value="22" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="23" style="width:auto;"> 16 - GPIO23</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorPower">3.3V Power - 17 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="24" style="width:auto;"> 18 - GPIO24</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">MOSI - GPIO10 - 19 <input type="radio" name="pins" value="10" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 20 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">MISO - GPIO09 - 21 <input type="radio" name="pins" value="9" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="25" style="width:auto;"> 22 - GPIO25</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SCLK - GPIO11 - 23 <input type="radio" name="pins" value="11" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="8" style="width:auto;"> 24 - GPIO8 - CE0</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 25 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="7" style="width:auto;"> 26 - GPIO7 - CE1</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorSD">SD - 27 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorSD"><input disabled type="radio" name="pins" value="" style="width:auto;"> 28 - SC</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO05 - 29 <input type="radio" name="pins" value="5" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 30 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO06 - 31 <input type="radio" name="pins" value="6" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="12" style="width:auto;"> 32 - GPIO12</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO13 - 33 <input type="radio" name="pins" value="13" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 34 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO19 - 35 <input type="radio" name="pins" value="19" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="16" style="width:auto;"> 36 - GPIO16</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO26 - 37 <input type="radio" name="pins" value="26" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="20" style="width:auto;"> 38 - GPIO20</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 39 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="21" style="width:auto;"> 40 - GPIO21</div> </div> </form></div> </div> </div> <div class="form-row"> <label for="node-input-intype"><i class="fa fa-level-up"></i> <span data-i18n="pi-gpiod.label.resistor"></span></label> <select type="text" id="node-input-intype" style="width:100px;"> <option value="PUD_OFF" data-i18n="pi-gpiod.resistor.none"></option> <option value="PUD_UP" data-i18n="pi-gpiod.resistor.pullup"></option> <option value="PUD_DOWN" data-i18n="pi-gpiod.resistor.pulldown"></option> </select> <span data-i18n="pi-gpiod.label.debounce"></span> <input type="text" id="node-input-debounce" style="width:47px; text-align:right"/> mS </div> <div class="form-row"> <label> </label> <input type="checkbox" id="node-input-read" style="display:inline-block; width:auto; vertical-align:top;"> <label for="node-input-read" style="width:70%;"><span data-i18n="pi-gpiod.label.readinitial"></span></label> </div> <div class="form-row"> <label for="node-input-host"><i class="fa fa-globe"></i> <span data-i18n="pi-gpiod.label.host"></label> <input type="text" id="node-input-host" data-i18n="[placeholder]pi-gpiod.place.host" style="width:250px;"> <input type="number" id="node-input-port" data-i18n="[placeholder]pi-gpiod.place.port" style="width:65px;"> </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]pi-gpiod.tip.in"></span></div> <div class="form-tips" id="pin-tip"><span data-i18n="[html]pi-gpiod.tip.dual"></span></div> </script> <script type="text/javascript"> var bcm2pin = { "2":"3", "3":"5", "4":"7", "14":"8", "15":"10", "17":"11", "18":"12", "27":"13", "22":"15", "23":"16", "24":"18", "10":"19", "9":"21", "25":"22", "11":"23", "8":"24", "7":"26", "5":"29", "6":"31", "12":"32", "13":"33", "19":"35", "16":"36", "26":"37", "20":"38", "21":"40" }; RED.nodes.registerType('pi-gpiod in',{ category: 'Raspberry Pi', color:"#c6dbef", defaults: { name: { value:"" }, host: { value:"localhost" }, port: { value:8888 }, pin: { value:"", required:true, validate:RED.validators.number() }, intype: { value:"PUD_OFF" }, debounce: { value:"25" }, read: { value:false } }, inputs:0, outputs:1, icon: "rpi.png", label: function() { var suf = ""; if (this.intype === "PUD_UP") { suf = "โ "} if (this.intype === "PUD_DOWN") { suf = "โ "} return this.name || "PIN: "+suf+bcm2pin[this.pin] ; }, labelStyle: function() { return this.name?"node_label_italic":""; }, outputLabels: function() { return "GPIO"+this.pin; }, paletteLabel: "pi gpiod", oneditprepare: function() { var pinnow = this.pin; var pintip = this._("pi-gpiod.tip.pin"); var pinname = this._("pi-gpiod.pinname"); $('#pinform input').on('change', function() { this.pin = $("#pinform input[type='radio']:checked").val(); $("#node-input-pin").val(this.pin); }); $("#node-input-pin").change(function () { if ($("#node-input-pin").val()) { $("#pinform input[value="+$("#node-input-pin").val()+"]").prop('checked', true); } }); } }); </script> <script type="text/html" data-template-name="pi-gpiod out"> <style> .pinTable { width: 300px; display: inline-table; font-size: 13px; height: 380px; min-height: 380px; max-height: 380px; } .pinTableBody { width: 300px; display: table-row-group; line-height: 12px; } .pinTableRow { width: 300; display: table-row; height: 14px; } .pinTableCellL { width: 150px; display: table-cell; text-align: right; padding-right: 4px; vertical-align: top; border: 1px solid #444; } .pinTableCellR { width: 150px; display: table-cell; text-align: left; padding-left: 4px; vertical-align: top; border: 1px solid #000; } .pinColorPower { background-color:#FECBCE; } .pinColorGround { background-color:#DDDDDD; } .pinColorGPIO { background-color:#BFEBBF; } .pinColorDual { background-color:#D0E6F4; } .pinColorSD { background-color:#FFFDD0; } </style> <div class="form-row"> <label><i class="fa fa-circle"></i> <span data-i18n="pi-gpiod.label.gpiopin"></span></label> <input type="text" id="node-input-pin" style="display:none;"> <div class="pinTable"> <div class="pinTableBody"><form id="pinform" style="height:380px; max-height:380px; margin:initial;"> <div class="pinTableRow"> <div class="pinTableCellL pinColorPower">3.3V Power - 1 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorPower"><input disabled type="radio" name="pins" value="" style="width:auto;"> 2 - 5V Power</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SDA1 - GPIO02 - 3 <input type="radio" name="pins" value="2" style="width:auto;"></div> <div class="pinTableCellR pinColorPower"><input disabled type="radio" name="pins" value="" style="width:auto;"> 4 - 5V Power</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SCL1 - GPIO03 - 5 <input type="radio" name="pins" value="3" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 6 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO04 - 7 <input type="radio" name="pins" value="4" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="14" style="width:auto;"> 8 - GPIO14 - TxD</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 9 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="15" style="width:auto;"> 10 - GPIO15 - RxD</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO17 - 11 <input type="radio" name="pins" value="17" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="18" style="width:auto;"> 12 - GPIO18</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO27 - 13 <input type="radio" name="pins" value="27" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 14 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO22 - 15 <input type="radio" name="pins" value="22" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="23" style="width:auto;"> 16 - GPIO23</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorPower">3.3V Power - 17 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="24" style="width:auto;"> 18 - GPIO24</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">MOSI - GPIO10 - 19 <input type="radio" name="pins" value="10" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 20 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">MISO - GPIO09 - 21 <input type="radio" name="pins" value="9" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="25" style="width:auto;"> 22 - GPIO25</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorDual">SCLK - GPIO11 - 23 <input type="radio" name="pins" value="11" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="8" style="width:auto;"> 24 - GPIO8 - CE0</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 25 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorDual"><input type="radio" name="pins" value="7" style="width:auto;"> 26 - GPIO7 - CE1</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorSD">SD - 27 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorSD"><input disabled type="radio" name="pins" value="" style="width:auto;"> 28 - SC</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO05 - 29 <input type="radio" name="pins" value="5" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 30 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO06 - 31 <input type="radio" name="pins" value="6" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="12" style="width:auto;"> 32 - GPIO12</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO13 - 33 <input type="radio" name="pins" value="13" style="width:auto;"></div> <div class="pinTableCellR pinColorGround"><input disabled type="radio" name="pins" value="" style="width:auto;"> 34 - Ground</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO19 - 35 <input type="radio" name="pins" value="19" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="16" style="width:auto;"> 36 - GPIO16</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGPIO">GPIO26 - 37 <input type="radio" name="pins" value="26" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="20" style="width:auto;"> 38 - GPIO20</div> </div> <div class="pinTableRow"> <div class="pinTableCellL pinColorGround">Ground - 39 <input disabled type="radio" name="pins" value="" style="width:auto;"></div> <div class="pinTableCellR pinColorGPIO"><input type="radio" name="pins" value="21" style="width:auto;"> 40 - GPIO21</div> </div> </form></div> </div> </div> <div class="form-row" id="node-set-pwm"> <label> <span data-i18n="pi-gpiod.label.type"></span></label> <select id="node-input-out" style="width: 250px;"> <option value="out" data-i18n="pi-gpiod.digout"></option> <option value="pwm" data-i18n="pi-gpiod.pwmout"></option> <option value="ser" data-i18n="pi-gpiod.servo"></option> </select> </div> <div class="form-row" id="node-set-minimax"> <label> <span data-i18n="pi-gpiod.label.limits"></label> <span data-i18n="pi-gpiod.label.min"></span> <input type="text" id="node-input-sermin" style="width:70px;"> us <span data-i18n="pi-gpiod.label.max"></span> <input type="text" id="node-input-sermax" style="width:70px;"> us </div> <div class="form-row" id="node-set-tick"> <label> </label> <input type="checkbox" id="node-input-set" style="display:inline-block; width:auto; vertical-align:top;"> <label for="node-input-set" style="width:70%;"><span data-i18n="pi-gpiod.label.initpin"></span></label> </div> <div class="form-row" id="node-set-state"> <label for="node-input-level"> </label> <select id="node-input-level" style="width:250px;"> <option value="0" data-i18n="pi-gpiod.initpin0"></option> <option value="1" data-i18n="pi-gpiod.initpin1"></option> </select> </div> <div class="form-row" id="node-set-freq"> <label for="node-input-freq"> <span data-i18n="pi-gpiod.label.freq"></span></label> <select id="node-input-freq" style="width:80px;"> <option value="8000">8000</option> <option value="4000">4000</option> <option value="2000">2000</option> <option value="1600">1600</option> <option value="1000">1000</option> <option value="800">800</option> <option value="500">500</option> <option value="400">400</option> <option value="320">320</option> <option value="250">250</option> <option value="200">200</option> <option value="160">160</option> <option value="80">80</option> <option value="50">50</option> <option value="40">40</option> <option value="20">20</option> <option value="10">10</option> </select> Hz </div> <div class="form-row"> <label for="node-input-host"><i class="fa fa-globe"></i> <span data-i18n="pi-gpiod.label.host"></label> <input type="text" id="node-input-host" placeholder="localhost" style="width:250px;"> <input type="number" id="node-input-port" placeholder="port" style="width:65px;"> </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" id="dig-tip"><span data-i18n="[html]pi-gpiod.tip.dig"></span></div> <div class="form-tips" id="pwm-tip"><span data-i18n="[html]pi-gpiod.tip.pwm"></span></div> <div class="form-tips" id="ser-tip"><span data-i18n="[html]pi-gpiod.tip.ser"></span></div> <div class="form-tips" id="pin-tip"><span data-i18n="[html]pi-gpiod.tip.dual"></span></div> </script> <script type="text/javascript"> var bcm2pin = { "2":"3", "3":"5", "4":"7", "14":"8", "15":"10", "17":"11", "18":"12", "27":"13", "22":"15", "23":"16", "24":"18", "10":"19", "9":"21", "25":"22", "11":"23", "8":"24", "7":"26", "5":"29", "6":"31", "12":"32", "13":"33", "19":"35", "16":"36", "26":"37", "20":"38", "21":"40" }; RED.nodes.registerType('pi-gpiod out',{ category: 'Raspberry Pi', color:"#c6dbef", defaults: { name: { value:"" }, host: { value:"localhost" }, port: { value:8888 }, pin: { value:"", required:true, validate:RED.validators.number() }, set: { value:"" }, level: { value:"0" }, out: { value:"out" }, sermin: { value:"1000" }, sermax: { value:"2000" }, freq: { value:"800" } }, inputs:1, outputs:0, icon: "rpi.png", align: "right", label: function() { if (this.out === "pwm") { return this.name || "PWM: "+bcm2pin[this.pin]; } else if (this.out === "ser") { return this.name || "Servo: "+bcm2pin[this.pin]; } else { var suf = ""; if (this.set === true) { suf = (this.level === "1") ? "ยน " : "โ "; } return this.name || "PIN: " + bcm2pin[this.pin] + suf ; } }, labelStyle: function() { return this.name?"node_label_italic":""; }, inputLabels: function() { return "GPIO"+this.pin; }, paletteLabel: "pi gpiod", oneditprepare: function() { var pinnow = bcm2pin[this.pin]; var pintip = this._("pi-gpiod.tip.pin"); var pinname = this._("pi-gpiod.pinname"); if (!$("#node-input-out").val()) { $("#node-input-out").val("out"); } var hidestate = function () { if ($("#node-input-out").val() === "pwm") { $('#node-set-freq').show(); $('#node-set-tick').hide(); $('#node-set-state').hide(); $('#node-set-minimax').hide(); $('#node-input-set').prop('checked', false); $('#dig-tip').hide(); $('#pwm-tip').show(); $('#ser-tip').hide(); } else if ($("#node-input-out").val() === "ser") { $('#node-set-freq').hide(); $('#node-set-tick').hide(); $('#node-set-state').hide(); $('#node-set-minimax').show(); $('#node-input-set').prop('checked', false); $('#dig-tip').hide(); $('#pwm-tip').hide(); $('#ser-tip').show(); } else { $('#node-set-freq').hide(); $('#node-set-tick').show(); $('#node-set-minimax').hide(); $('#dig-tip').show(); $('#pwm-tip').hide(); $('#ser-tip').hide(); } }; $("#node-input-out").change(function () { hidestate(); }); hidestate(); var setstate = function () { if ($('#node-input-set').is(":checked")) { $("#node-set-state").show(); } else { $("#node-set-state").hide(); } }; $("#node-input-set").change(function () { setstate(); }); setstate(); $('#pinform input').on('change', function() { this.pin = $("#pinform input[type='radio']:checked").val(); $("#node-input-pin").val(this.pin); }); $("#node-input-pin").change(function () { if ($("#node-input-pin").val()) { $("#pinform input[value="+$("#node-input-pin").val()+"]").prop('checked', true); } }); } }); </script>