A few years back Sauce Labs co-founder Jason Huggins ( @hugs) was giving a talk at js.chi(), showing us how to use an Arduino to change the color of an LED based on an input. During the talk Jason suggested those interested in microcontrollers check out Pumping Station: One up on Clybourn. So I got some friends together and we went to PS1, and learned the basics of programming an Arduino. The event was a fun experience and, later that night, netted me a working Larson Scanner. Since then I’ve procured a Raspberry PI, and started tinkering with Google Coder. And now it’s time for Tessel.

At first I completely overlooked Tessel, even though they had a booth at Fluent Conf this year, a crowd I’m likely to pop up in from time to time given the nature of my work. But several months later they got on my radar again and I purchased one instantly after realizing I could run JavaScript on it. Finally! No more weird IDEs (Arduino) or fickle hardware environments (Raspberry Pi). Just sweet JavaScript and Tessel…

But wait, I hate JavaScript, JabbaScript, or whatever you call it. That may seem a little harsh, but after six years of writing the stuff I’ve gotten a healthy appreciation for not using it after I switched to CoffeeScript. And so after unboxing the Tessel and trying out a few sample scripts I got to the point where I wanted to write, but I wanted to write in CoffeeScript. And even though tessel does not currently support CoffeeScript, and I’d argue it never should, that doesn’t mean we can’t write CoffeeScript for it.

Why Yeoman and Gulp? Set-up speed and simplicity primarily, though moving things to Jake does have its appeal and might scale better. But right now we’re starting small.

This following instructions assumes both Node and NPM installed on the system.

Scaffolding a new Coffee Module with Yeoman

Looking for a quick way to start scaffolding for Tessel took no longer than 10 minutes thanks to Yeoman Generators. A quick search for coffee on the Yeoman site turned up a number of generators, and the best-looking one given we’re starting small was coffee-module, which provides a short list of dependencies as provides simple access to CoffeeScript transpiles using the gulp command. Yeoman and the generator can be installed like so:

$ npm install -g yo
$ npm install -g generator-coffee-module

Once Yeoman and the generator are installed, creating a new CoffeeScript module is as simple as changing directories and running:

$ yo coffee-module
$ npm install # if necessary

Once created, run gulp at the command line from within the module directory to compile the example CoffeeScript file to JavaScript. Easy right? Now try running it on the Tessel. Boom!

INFO Deploying bundle (30.88 MB)...
ERR! Bundle size is 30.88 MB and is above max limit of 30.00 MB

Wait, the script we ran was tiny. Why is the bundle so large? The answer is becase the new NPM module created came along with some baggage useful for transpiling CoffeeScript, but it seems even devDependencies are getting bundled with everything else unexpectedly. The easy solution here is to rm -rf node_modules and then do a npm install –production so unnecessary dependencies aren’t installed. Another option would be to fiddle with the Gulpfile, creating new tasks to handle doing that work automatically as part of the build.

Another thing worth noting, is that while bundling Tessel runs some logic on package.json and omits directories specified under a hardware property. The Tessel Machine Style Guide shows an example of how to structure this property in the JSON file.

Now let’s try it all out.

Transpile from CoffeeScript and Run Output JS on Tessel

For this section you’ll need to have the Tessel Accelerometer module plugged into Port A on the Tessel. Then do the following steps to tie everyting together.

Brew Some Coffee

1. Create a new file called show-axes.coffee in the src directory.
2. Copy the following accelerometer example I converted to CoffeeScript from JS into the new file:

# Any copyright is dedicated to the Public Domain.
# https://creativecommons.org/publicdomain/zero/1.0/

###
Demonstrates axes by turning on a different
LED per axis (x, y, z) only when that axis
has positive acceleration. Also prints +/-
per axis to the console.
###

tessel = require('tessel')
accel = require('accel-mma84').use(tessel.port['A'])

# Define vars
led1 = tessel.led[0].output()
led2 = tessel.led[1].output()
led3 = tessel.led[2].output()

textOut = ''

accel.on 'ready', ->
  accel.on 'data', (xyz) ->

    # Refresh variables
    x = xyz[0]
    y = xyz[1]
    z = xyz[2]

    textOut = ''

    # Print which axes are positive and turn on corresponding LEDs
    if(x > 0)
      led1.high()
      textOut += 'x: + | '
    else
      led1.low()
      textOut += 'x: - | '
    if(y > 0)
      led2.high()
      textOut += 'y: + | '
    else
      led2.low()
      textOut += 'y: - | '
    if(z > 0)
      led3.high()
      textOut += 'z: +'
    else
      led3.low()
      textOut += 'z: -'

    console.log(textOut)

accel.on 'error', (err) ->
  console.log('Error:', err)

Once copied, save the file and run gulp from the project directory to lint and transpile the code.

The result of the above should be a new file called show-axes.js in the lib directory. And that’s all there is to transpiling from CoffeeScript to JavaScript.

Running the Transpiled Script on Tessel

Once the JS file is created by Gulp, and assuming the devDependencies are excluded from the bundler as described above, the transpiled CoffeeScript can be run on the Tessel:

$ tessel run lib/show-axes.js

If run before the accelerometer drivers are installed (npm install --save accel-mma84) it’ll blow up, so don’t forget to pull down the drivers for a successful test.

And that’s all there is to it. Unfancy JavaScript for Tessel.