Interface and Application Programming


I already made a application that interfaces the mic example using javascript and html last week, so this week I tried out openFrameworks, a visual framework using C++. The concept is very similar to processing, but without the IDE. I choose openframworks, because I thought it is a good chance to touch a lower level language, and in linux you can choose anykind of developing enviroment you want.

Last week using Javascript

I will dig further to explain what I did to make last week's assignment work. I'm using the atom text editor with the "vim plugin" to try the feeling of using vim.

  1. installing node and npm. my Ubuntu had already node installed, but to use serialport, the npm site says that node has to be the legacy version.
  2. I installed log, serialport, ws.
  3. The html file has only two divs that will be manipulated by javascript.It is event based and the socket.on_message() is triggering request for looping.
  4. The javascipt file that will be ran by node file.js is the server-side program. Once the port is opened and starts to receive data, it waits for signals starting with '1234', which is a signature to know the start of the data. This part was coded in the microcontroller. As mentioned in last week, I used the difference to indicate the loudness of the input and change images.


I tried another platform using openframworks doing the same thing.


  1. I first cloned openFrameworks from the github repository.
  2. using linux, there is a guidance page for setting things up. It was straightforward with a few exceptions. The github repository lacks the Makefiles for building examples, and the project generator, the application for making a new project with all the necessary files needs to be cloned from a different repository. You will need to compile the project generator.
  3. type projectGenerator -o new_project_name to make a empty project. Once this project generator is working and have one empty-example, you can modify the make files to build the other examples.

Serial Connection was not hard, there was a built-in function that handles everything. Here is the actuall implementation of serial.setup("port",baud). It is first opening the port, then setting the baudrate. I like the way it is accessible to the raw implementaion, which there is a oppurtunity to learn in lower level. But it is still obscured when it comes to function calls or instructions and hard to identify which came from which 'include'. Same as avr instructions.

Right now the app has trouble receiving the bytes in some occasions. If I run this app right after boot the FTDI cable shows that it is trying to write bytes, while there is no attempt to do so. If I do the javascript node example first and then come back to run this, it works just fine. ??

project source ode and images

Fig4 blue line indicating the level of sound