Node-RED Dashboard & BlinkM I²C Controlled RGB LED

Node-RED Dashboard BlinkM

I am using a Raspberry Pi as a headless computer through VNC.

A particular interest is learning Node-RED flow programming and within that exploration having the ability to display debugging and program execution results.

This is Revision 1 of my previous blog and extends the simple blinking LED with the addition of a BlinkM I²C Controlled RGB LED to the Dashboard, and the ability to select a desired color. Reference My Pi Workbench for details on wiring a BlinkM module.

Using a simple LED, a BlinkM, and a Raspberry Pi – I have described building a demonstration Pi Control dashboard in Node-RED Dashboard – Pi Control Rev1.

Copy the following Dashboard – BlinkM JSON flow to your clipboard and then import it into Node-RED using the Import From > Clipboard (Ctrl-I) menu option

[{"id":"b8861ed5.3541","type":"function","z":"52700294.bedf9c","name":"Hex to i2c cmd","func":"// Accepts a chosen color for the BlinkM in Hex and strings the\n// values into a parameter set for an i2cset command\nvar hx = msg.payload;\nvar i2c_cmd = (\" -y 0x01 0x09 0x6e 0x\" + \nhx.substring(1,3) + \" 0x\" + \nhx.substring(3,5) +\" 0x\" + \nhx.substring(5,7) + \n\" i\"); \nmsg.payload = i2c_cmd;\nreturn msg;","outputs":1,"noerr":0,"x":300,"y":400,"wires":[["6c1a6e20.9e44d"]]},{"id":"c447ac58.2ae6","type":"ui_colour_picker","z":"52700294.bedf9c","name":"BlinkM Color","label":"BlinkM Color","group":"dc750d48.9b06","format":"hex","outformat":"string","showSwatch":true,"showPicker":true,"showValue":true,"showAlpha":false,"showLightness":false,"order":0,"width":"4","height":"4","passthru":true,"topic":"BlinM Color","x":110,"y":400,"wires":[["b8861ed5.3541","83aa4e3b.265b5"]]},{"id":"6c1a6e20.9e44d","type":"exec","z":"52700294.bedf9c","command":"i2cset","addpay":true,"append":"","useSpawn":"","timer":"","name":"Exec BlinkM @ I2C","x":410,"y":320,"wires":[[],[],[]]},{"id":"83aa4e3b.265b5","type":"function","z":"52700294.bedf9c","name":"Record Events","func":"// initialise the counter to 0 if it doesn't exist already\nvar dashboardLog = context.get('dashboardLog')|| [];\n\n// stop flow when LogSw Off\nif (global.get(\"LogSw\") === 0){\n return null;\n} \n\ndashboardLog.push(msg);\nif (dashboardLog.length > 12){\n // Delete oldest message if > 12\n dashboardLog.shift();\n dashboardLog.length = 12;\n} \n// store the value back\ncontext.set('dashboardLog',dashboardLog);\n// make it part of the outgoing msg object\nmsg = {};\nmsg.payload = dashboardLog;\nreturn msg;","outputs":"1","noerr":0,"x":400,"y":200,"wires":[["df9e26c.e8c53d8"]]},{"id":"2b0daa35.ef1ff6","type":"ui_switch","z":"52700294.bedf9c","name":"BlinkM Switch","label":"BlinkM Off/On","group":"dc750d48.9b06","order":0,"width":"3","height":"1","passthru":true,"decouple":"false","topic":"BlinkM","style":"","onvalue":" -y 0x01 0x09 0x6e 0xff 0xff 0xff i","onvalueType":"str","onicon":"radio_button_checked","oncolor":"#008000","offvalue":" -y 0x01 0x09 0x6e 0x00 0x00 0x00 i","offvalueType":"str","officon":"radio_button_unchecked","offcolor":"#FF0000","x":120,"y":320,"wires":[["6c1a6e20.9e44d","83aa4e3b.265b5"]]},{"id":"df9e26c.e8c53d8","type":"ui_template","z":"52700294.bedf9c","group":"b3337a5d.be9688","name":"Event Log","order":1,"width":"6","height":"9","format":"<ul>\n <li ng-repeat=\"x in msg.payload\">\n <font size=\"2\" color=\"green\">{{x.topic}}</font>\n <ul>\n <li>\n <font size=\"2\" color=\"black\">{{x.payload}}</font>\n </li>\n </ul>\n </li>\n</ul>","storeOutMessages":true,"fwdInMessages":true,"x":590,"y":200,"wires":[[]]},{"id":"2ee3b487.6fff4c","type":"ui_switch","z":"52700294.bedf9c","name":"Log Switch","label":"Log Off/On","group":"dc750d48.9b06","order":0,"width":"3","height":"1","passthru":true,"decouple":"false","topic":"Log Enabled?","style":"","onvalue":"1","onvalueType":"num","onicon":"fa-toggle-on","oncolor":" #008000","offvalue":"0","offvalueType":"num","officon":"fa-toggle-off","offcolor":"#800080","x":110,"y":200,"wires":[["49f12ea7.ce79e","83aa4e3b.265b5"]]},{"id":"2ee2d708.73c5b8","type":"ui_switch","z":"52700294.bedf9c","name":"LED Switch","label":"LED @ Pin 37","group":"dc750d48.9b06","order":0,"width":"3","height":"1","passthru":true,"decouple":"false","topic":"LED @ pin 37","style":"","onvalue":"1","onvalueType":"num","onicon":"radio_button_checked","oncolor":"#008000","offvalue":"0","offvalueType":"num","officon":"radio_button_unchecked","offcolor":"#FF0000","x":110,"y":120,"wires":[["297849f9.58a866","83aa4e3b.265b5"]]},{"id":"49f12ea7.ce79e","type":"function","z":"52700294.bedf9c","name":"Toggle Global.LogSw","func":"\nif (msg.payload === 1){\n global.set(\"LogSw\",1); \n} \n\nif (msg.payload === 0){\n global.set(\"LogSw\",0); \n} \nreturn msg;","outputs":1,"noerr":0,"x":420,"y":260,"wires":[[]]},{"id":"297849f9.58a866","type":"rpi-gpio out","z":"52700294.bedf9c","name":"","pin":"37","set":true,"level":"0","out":"out","x":380,"y":120,"wires":[]},{"id":"37266d63.491cb2","type":"config","z":"52700294.bedf9c","name":"","properties":[{"p":"LogSw","pt":"global","to":"0","tot":"num"}],"active":true,"x":110,"y":60,"wires":[]},{"id":"1f2effbc.7d0e3","type":"comment","z":"52700294.bedf9c","name":"rpi-gpio LED Off/On","info":"rpi-gpio out controls a LED wired at Pin 11 on the Pi.","x":410,"y":80,"wires":[]},{"id":"dc750d48.9b06","type":"ui_group","z":"","name":"Control","tab":"7b28ce76.8d16c","order":1,"disp":true,"width":"5"},{"id":"b3337a5d.be9688","type":"ui_group","z":"52700294.bedf9c","name":"Log","tab":"7b28ce76.8d16c","order":3,"disp":true,"width":"6"},{"id":"7b28ce76.8d16c","type":"ui_tab","z":"","name":"Home","icon":"home","order":1}]

This is a very simple demonstration of Node-RED Dashboard. Play with the other widgets – add audio out (text to speech) , other switches, sliders, or charts!

For myself, the addition of a 4 simple nodes added a lot of functionality! The web served Dashboard User Interface has more than fulfilled my needs. Have fun!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s