The second part of this week’s 2-Bullet Tuesday! See the first part here.
You can subscribe to the newsletter on the 2-Bullet Tuesday page!

Omega Tip of the Week:

This week, we’ll show you how to quickly and easily create a web page to controls your Omega using the built-in web server and CGI scripts. This same method was used for the IoT Lock project from the Omega2 Project Book.

By default, the Omega runs the uhttd web server and hosts all of the files in the /www directory. That’s how the Setup Wizard and Console are hosted on the Omega. We can easily add a web page without disrupting either the Setup Wizard or Console.

So let’s create a web page that will allow us to control the RGB LED on the Expansion Dock straight from our browser. It will consist of an HTML file with buttons, each of which will turn the LED a different color, and a set of scripts the Omega will execute when the buttons on the site are pressed:

All of the code for this tip can be found in our rgb-led-traffic-light GitHub repo. See our guide to using Git to clone the repo into the /root directory, then create some more directories on the Omega:

mkdir /www/traffic
mkdir /www/cgi-bin

Then put the HTML file into the /www/traffic directory and the CGI-bin scripts in /www/cgi-bin to hold our scripts by doing:

cp /root/rgb-led-traffic-light/www/index.html /www/traffic/
cp /root/rgb-led-traffic-light/www/cgi-bin/* /www/cgi-bin/

After you copy in the scripts, make sure to run chmod +x /www/cgi-bin/* to make them executable by all users.

If you take a look at the script code, they use the expled command to set the RGB LED to a specific color. See our documentation for more details on the RGB LED.

And that’s all! Now that the files are in the /www directory, the Omega will automatically be serving them up. Navigate to http://omega-XXXX.local/traffic (where XXXX are your Omega’s unique numbers) and use the buttons to create a miniature traffic light with your Omega and Expansion Dock.

Now that you’ve seen how quick and easy the process is, you can create your own browser-based controls for the Omega!

P.S. We had a great time at the Shift Developer conference in Split, Croatia. A big thank you to the CodeAnywhere team!

P.P.S. We’re amazed at the projects we’ve seen so far, and we’re now upping the ante: if your project is featured in 2-Bullet Tuesday, you will receive an Omega2+, a Dock of your choice, AND free shipping! (Charly86, this means you too!)

P.P.P.S. We’ve posted a video on YouTube showing how to set up an Omega2 the very first time. Let us know what other Omega2 topics we should make videos about!