zlalanne 37 Posted March 1, 2014 Share Posted March 1, 2014 I created a quick project to start learning nodejs. To those that are unfamiliar nodejs allows you to write javascript for the server side. So I decided to write a small gui that plots serial data. The GUI itself is written in javscript/html and uses node-webkit to package it into a .exe file (or the correct package for your os). This could easily be extended to visualize a lot more I/O from the launchpad, and given that the GUI is written in html/javascript it is really easy to create new elements. Here is the source: https://github.com/zlalanne/node-serial-gui The repository includes the nodejs code as well as a simple Energia sketch to send a random value over serial. YanuarPrijadi, Rei Vilo, KwaiChang and 7 others 10 Quote Link to post Share on other sites
bluehash 1,581 Posted March 3, 2014 Share Posted March 3, 2014 @@zlalanne Thanks for sharing. This is sweet. PS: Edited your post with a screenshot. Quote Link to post Share on other sites
username 198 Posted March 3, 2014 Share Posted March 3, 2014 I created a quick project to start learning nodejs. To those that are unfamiliar nodejs allows you to write javascript for the server side. So I decided to write a small gui that plots serial data. The GUI itself is written in javscript/html and uses node-webkit to package it into a .exe file (or the correct package for your os). This could easily be extended to visualize a lot more I/O from the launchpad, and given that the GUI is written in html/javascript it is really easy to create new elements. nodejs_msp430_serial_gui.png Here is the source: https://github.com/zlalanne/node-serial-gui The repository includes the nodejs code as well as a simple Energia sketch to send a random value over serial. Very neat application. Always wanted to do some server side plotting. Will have to take a look into this. Quote Link to post Share on other sites
zlalanne 37 Posted March 3, 2014 Author Share Posted March 3, 2014 Thanks. My favorite part about this is that it it's just HTML/CSS/JS so it's really easy to expand and customize. Plus there are so many open source javascript libraries that there is a lot you could do. I've recently started looking at http://d3js.org/. Quote Link to post Share on other sites
Rickta59 589 Posted March 3, 2014 Share Posted March 3, 2014 When I try to run this with node-webkit for linux it doesn't seem to find serialport. What is the secret to running this? Quote Link to post Share on other sites
zlalanne 37 Posted March 3, 2014 Author Share Posted March 3, 2014 You need to compile node-serialport specifically for node-webkit. There are instructions on the node-webkit github wiki. https://github.com/rogerwang/node-webkit/wiki/Using-Node-modules#wiki-3rd-party-modules-with-cc-addons Quote Link to post Share on other sites
Rickta59 589 Posted March 3, 2014 Share Posted March 3, 2014 thanks, I'll give that a try Quote Link to post Share on other sites
Rickta59 589 Posted March 4, 2014 Share Posted March 4, 2014 That is pretty slick, thanks for sharing. Here is a version with slightly modified firmware: -rick bluehash 1 Quote Link to post Share on other sites
zlalanne 37 Posted March 4, 2014 Author Share Posted March 4, 2014 Glad it worked on Linux, didn't have a chance to try it yet. Any modifications needed to the html/js? I'd like to put some sort of Grunt task to build and run the executable. Haven't done too much with Grunt yet though. Quote Link to post Share on other sites
Rickta59 589 Posted March 4, 2014 Share Posted March 4, 2014 I added a \r\n to the output and used the parser feature of serialport to strip it off. Initially there seemed to be a buffering problem and I was only getting half reads of the data values. @@ -113,11 +113,13 @@ $("#formData").html(html); }); - var SerialPort = require("serialport").SerialPort; + var com = require('serialport'); + $("#serialForm").submit(function(event) { portNum = $("#formData").val(); - var port = new SerialPort(portNum, { - baudrate: 9600 + var port = new com.SerialPort(portNum, { + baudrate: 9600, + parser: com.parsers.readline('\r\n') }); port.on("open", function() { console.log('open'); bluehash 1 Quote Link to post Share on other sites
Rei Vilo 695 Posted March 11, 2014 Share Posted March 11, 2014 Thank you for sharing this project. It is perfect for the new connected LaunchPads and the Internet of Things Quote Link to post Share on other sites
yyrkoon 250 Posted March 12, 2014 Share Posted March 12, 2014 Very cool. I havent actually had chance to play with the source etc but definately worth project. thanks for sharing. Quote Link to post Share on other sites
jpnorair 340 Posted March 12, 2014 Share Posted March 12, 2014 I am an old person. What is the advantage of using javascript for this sort of thing? Quote Link to post Share on other sites
zlalanne 37 Posted March 13, 2014 Author Share Posted March 13, 2014 For me i think think the biggest benefit is writing and designing a simple GUI is way easier in JS/HTML/CSS. And node-webkit makes it really simple to build and distribute a GUI out of those. Quote Link to post Share on other sites
yyrkoon 250 Posted March 15, 2014 Share Posted March 15, 2014 Not to mention that nodejs is nonblocking / event driven. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.