Web Console
After the GUI has been designed as already exposed, it's time to make it really useful.
In the demo to the right, unlike the previous one, the values for the gauge are not updated by the client but all of them come from Aria G25 board through a web socket. The video is a real M-JPEG streamer one taken with a LifeCam HD-3000 web cam.
I know, you have to to trust on me that's true, but you can test the latest version of the software by yourself getting it on Google code repository and also check the differences with the previous versions.
Credits:
First of all, I want to thank my friend Raffaello for all of his suggestions and support.
Then Marcello Gesmundo for his Node.js installation tutorial on Aria G25, so prompt on replies.
The latest version of
the whole project
(HTML5, CSS stylesheet and JavaScript code)
is available as an open source at
GitHub repository
Some are dummy data (like temperature, GPS position, battery voltage, etc...) because the hardware has not yet been connected. The date-time values come from Aria G25 board Real Time Clock and not from GPS. The speed, orientation and artificial horizon gauge are updated with the values from joysticks. Through a bidirectional socket the joysticks position is sent from web client to node.js server, they are normalized and sent back to the presentation layer as a JSON packet at a 10Hz refresh rate. So the whole protocol is working fine, with just the adding of a loop-back function that simulates real values.
To achieve the goal we need at first an application framework on the server side.
Why node.js? There are several web server application frameworks on the free market. I was soon fascinated by node.js because I can use the same programming language (JavaScript) on both client and server side. That's important for a newbie in this kind of programming as I am. Another reason is the huge amount of documentation on-line about it. If you make a mistake, and I've made almost any possible error, you can find someone else that have already done it, and a solution quickly available.
Searching the Net for some examples on how to exchange data real time between client and server, I've found again a well known open source evangelist and co-founder of Arduino: Tom Igoe. His description of exactly what I need is clear and simple also for beginners: how to setup a node.js server to send data received via serial port to a web client through a web socket with the minimum latency. Because node.js is available for every platform I've installed it on my Mac to speed up the learning phase. The porting on Aria G25 is a piece of cake, just a matter of copying the source code on the right directories. After node.js is installed you need npm to install the modules express for using node as a web server, socket.io to manage web sockets and node-serialport to communicate via serial ports. JSON format facilitates even more the data exchange. That's all.
Once again NetBeans helps a lot on development. Creating an HTML5 project following all the folder structure created by express, you can edit and debug your HTML, CSS and JavaScript code using Chrome as output.
Another useful node module is forever. It solves the problem of node.js running on terminal better than the standard Unix sequence "nohup node app.js &". Using forever you can manage many different apps in background and it takes also care of possible node crash, restarting all the previously running apps.
Tom Igoe, my unaware teacher on this and other projects with Processing and Arduino, for gluing all the pieces together. Following his clear and simple tutorial I've been able to setup a working system with express web application framework for node.js, socket.io node module to easily manage web sockets and node-serialport to talk low level with other boards, once more using JavaScript.
Eventually nodejitsu blog for the forever, very useful, module for (guess who?) node.js.