Wednesday 17 July 2013

Part 1 - Writing a Philips Hue Simulator in Javascript - Introduction

Welcome to the first of a series of posts which aims to walkthrough the creating of a Philips Hue simulator.

Philips Hue?! Catchy...what is it again??


The short answer...

It's a multi-colour LED light bulb that can be network controlled, made by Philips.

The long(er) answer...

The Hue "system" comprises one (or more) bridge devices that plug into your wired network and each bridge can support up to 50 individual bulbs. Each bulb is an Edison Screw (ES) type and effectively replaces your standard light bulb. However, UK houses tend to have the "bayonet" style fittings but you can buy a cheap adaptor to convert to the ES fitting.

Currently, you can purchase a "starter pack" of devices that contains a single bridge and three bulbs. Also, the bulbs can be bought individually. In the UK Apple stores, they retail for £179.95 and £49.95 respectively. I'm not going to spend any time defending Philips' pricing here but personally, I think it's reasonable value based on the feature set, the build quality and the lifetime of the LED bulbs. I've had good experiences in the past with Philips customer support (replacing broken items etc) so I'm hopeful that there will be good after-market help for the Hue stuff too.

There are official apps for both iOS and Android that allow (remote) control of the Hue hardware.

Does it have a developer API?


Yes, it does. To their credit, Philips have involved the development community from the start, producing what appears to be a well thought out web service API that allows free and extensive access to the Hue hardware for third-party applications. You can enumerate bulbs, control colour and intensity, group bulbs, create mood "scenes" and lots of other interesting things. The developer website is here.

How expensive!?? I want to try Hue out but I can't afford it!!


You're in luck! The goal of this blog series is to (hopefully!) create a simple Hue simulator that will pretend to be the wireless bridge used to network control the bulbs themselves. The idea being that interested developers can use this simulator to prototype ways to control and use Hue bulbs from within their own projects without having to go and buy the kit. I'm actually surprised Philips don't have something like this already?!

About the developer API...


The Hue bridge exposes a RESTful web service that uses the basic HTTP commands to query and control the bulbs. Querying data (generally through GET requests) results in formatted JSON being returned. For security, the bridge mostly only responds to "registered" users - the registration process involves pressing the physical button on the bridge device itself - but there are some commands which are available to any caller but they do not provide any detailed information about the connected devices. It's not exactly maximum security but it keeps out the riff-raff...

The API documentation is well-written, clear and concise so I won't repeat it again here.

Right, what do we actually need to do here?


In simple terms, the simulator needs to do the following:

  • Respond to web service requests i.e. be a simple HTTP web server
  • Maintain a collection of "registered" users
  • Maintain a collection of connected bulbs and their respective states
  • Accurately implement the API including the JSON responses

So, no need to get carried away with too much detail but clearly it's worth separating the network/server implementation, data/configuration and request handling, if we can.

What software technologies to use?


As the data returned from the requests is in JSON format, Javascript seemed the logical choice. I'm not an expert by any means but I've had plenty of experience with it and there's some excellent libraries and frameworks that will help us avoid having to reinvent the wheel...well, handling HTTP requests and the like.

The node.js framework (library?) is one of the darlings of the Javascript world and offers lots of functionality to quickly build a web server application. In order to simplify the REST support, I've chosen to use a node.js-based library called restify to encapsulate the REST-specific stuff.

Getting started with restify...


First job is to install node.js - as I'm using Windows, there's already an automated installer on the node website that will set everything up so that it's accessible from a command-line prompt. Once you've got that, you can open a command prompt window and type the following:

C:>node
> 'Hello World'

If everything is working correctly, you should get the message echoed back:

> 'Hello World'

Next step is to decide how we organise our code. As I said earlier, it's useful to separate the components that will make up the simulator. Although Javascript doesn't support the MVC design "natively" (like ASP.NET's Web API, for example), we can borrow the concepts. I came across Tableau whilst poking around various blogs and it gave me some good ideas on architecture. For now, we just need a simple entry point for our web service which we'll place in a file called app.js - here's how it'll look:
var restify = require('restify');

var app = module.exports = restify.createServer({
 name: "Hue Bridge Simulator"
});

app.listen(8080, function() {
  console.log('%s listening at %s', app.name, app.url);
});

Before we run it, we need to ensure it has access to the restify code it needs (see the first line). The easiest way to do this is to make sure we're in the same directory as app.js in our command prompt and type:

npm install restify

All being well, a directory called node_modules will be created in the directory and all of the restify modules will be pulled into it by the npm tool. Now we're ready to run our skeleton simulator framework by typing at the command-prompt:

node app.js

If the planets are in alignment and everything is setup correctly, we should be rewarded with the rather underwhelming message:

Hue Bridge Simulator listening at http://0.0.0.0:8080

So far, so good. What's next?


Admittedly, it's been a bit slow going but we should have all the basics in place now so we can go ahead an implement the actual bridge functionality. Next time, we'll pick up the pace as we add some specific Hue API request routing and talk about how we store data and configuration. Oh, and like all good software projects, we'll have to think of a cool name at some point...

No comments:

Post a Comment