Introduction: Web Controlled Wifi LED Tower
This project is a web controlled LED tower that uses an Arduino and Wifi Shield to connect to a web server to get commands submitted by users. The goal was to make the project mobile so it can be taken to shows and still allow control from the web.
You can control this project live at TeleToyland!
The tower itself uses foam core and WS2812b LEDs, and could be made in other configurations like a grid like this one.
For projects in a fixed location, wired Ethernet is great. You can either have the project poll a server for commands, or have the server push commands to the Arduino if you want to configure your router port forwarding and have a static IP address or want to setup Dynamic DNS. This is how most of the TeleToyland projects work.
But, for mobile projects, Wifi is better - no network wires, and you can use local wifi, or a mobile hotspot. The project can easily poll the server from wherever it is located. Since we are polling the server, using a fixed web server on the Internet allows the commands to be buffered in a known location.
Step 1: Parts
- The Tower is made from foam core sheets like these, hot-melt glued together. One 20x30 sheet is enough for this project. The foam core pieces needed are:
- (2) 2" x 20" for the tower sides.
- (1) 4" x 20" for the tower back
- (6) 2" x 3 5/8" for the tower top, bottom, and 4 dividers (note that I used 3.5" ones in the pictures, and they were a bit short, so adding 1/8" would be better)
- (2) 4" x 6" for the base top and bottom
- (2) 2" x 6" for the base front and back
- (2) 2" x 3 5/8" for the base sides
- Plastic cover - this is from the local home store and is used to cover fluorescent bulb fixtures. It's called an acrylic lighting panel, and the style is cracked ice. There are other possibilities here - the main thing is there is enough frosting to diffuse the LED light. You will need a 4" x 20" piece of this - be careful cutting since it's brittle!
- LEDs WS2812 or WS2812B. WS2801 ones could would work too with some minor changes in the code. I used some from a strip and cut them up, but you can also get some that are soldered on small boards. The WS2812b ones are a bit better than the WS2812 but both are fine.
- Wire - I used servo wire like this or this to connect the LEDs, but pretty much any wire will do. Three wires will need to be pushed in to the Arduino headers, so 24 AWG solid core wire will work, or you can use jumpers like these. I ended up using the wire when I made a shorter one for the web site.
- An Arduino Uno.
- A Wifi Shield. I had an official one that I used for this project, so the code will use that. But, there are others like this CC3000 based one from Adafruit that work well too and cost a lot less. The code will need to be adapted a bit. You can also use an even less expensive Ethernet shield if you can wire this project.
- Optional - a 200-500 ohm resistor to use on the data line input to the LEDs. Since this project only has 5 LEDs, this is really not required.
- Power supply - Since we only have 5 LEDs in this project, the Arduino can power them directly. If you have more, and external supply is better. The LED Grid Instructable has more info on that.
Step 2: The LED Tower Case
To build the case, cut out the foam core and translucent cover per the dimensions in the parts list. For this project, I just used hot melt glue to glue everything together.
The base box can be made separately for now - just build the box and leave the bottom plate off for now. Eventually, the tower will be glued to the box, and the bottom will be removable to put the electronics in.
For the tower, glue the sides and dividers to the translucent top - not the back. The back will be attached later after the LEDs are attached to it.
Step 3: Electronics
The LEDs will be soldered in the same fashion as the LED Grid project. For this one, I used some breadboard jumper wires on the ends of the LED strand to plug directly in to the Arduino. I used a 220 ohm resistor on the input of the data line to smooth out signal noise, but since there are so few LEDs, it really is not required. The first wire was about 8" long.
The wires are about 3.5" between the LEDs. You want them long enough to allow the LEDs to be spaced out, but not too long to make mounting them harder. If you have extra wire, you can hot-melt glue it to the backing.
An alternate way to do this is to hot melt glue the LEDs down, then cut the wires to fit exactly.
I recommend testing each LED as you go with a simple program on the Arduino - the demo code works fine. Make sure to watch the data direction arrows printed on the strips - they do have a direction since the data is passed from one to the next down the chain.
When soldering, I tinned the wires and LED pads first, then soldered the wires to the pads.
Once the LEDs are soldered and tested, you can hot melt glue them to the back of the tower. Having the wires pass under the dividers in the middle is easiest.
To make room under the dividers, cut some small notches in the middle dividers for the LED wires.
The back can be attached various ways - I just used some tape so I could open it up later if necessary.
With the tower complete, you can place it on the base and cut a hole for the LED wires to pass into the base, then glue the tower to the base.
To attach the bottom, more tape can be used. I tried pairs of magnets to make it a snap on bottom, but that is probably a bit too fancy, though it is fun.
You can cut holes for the Arduino power and USB ports (see the picture), and I used some foam to hold the Arduino in place.
Step 4: Code
The code for this project is spread out in a few places. As described in the Introduction, this project uses a wifi shield to poll a web server to get commands.
First, there is a web page on a standard web hosting web server to capture commands with a simple form (see attached form code). That form calls a PHP script that submits the commands to a MySQL database. The submit code and DB schema are attached.
So, as users submit commands, the DB table collects them all.
Next, a hidden PHP web page reads the next command from the DB, removes it from the DB, and returns it to the web browser. The code for that is attached - the get next script. You can run this with a web browser for testing, but normally, that page is called by the Arduino to get the next command. The get next page returns a zero if no commands are waiting.
So, the form, the submit script, the DB, and the get next script are all running on a web host and can be tested independently. Once that is working, the Arduino code can be built.
The Arduino code uses the Repeating Client code sample as it's base. With each connection, the get next script is called, the colors parsed, and the LEDs set. Having a few seconds with each loop seems like a reasonable polling period, but that can be adjusted to your needs.
This approach can be adapted for all kids of mobile web connected projects - Enjoy!
The Wifi shield needs a firmware update to work with the Arduino 1.05 dev environment. Without the update, the script will mostly work, but it will not connect to the web server. So, I used the 1.04 dev environment. I did try to update the firmware, but had some issues on my windows 8.1 machine. I will try to port this project to the CC3000 shield at some point.
If you use an access point like a smartphone, then the SSID and password for the Wifi network can be hard-coded into your program. If you want to use a local network, it's a bit trickier since you will have to edit and recompile the Arduino code. Some Wifi shields like the ones that use a CC3000 chip have an app that let you configure the wifi chip with a smartphone external to your Arduino code. I did not implement that for this project, but there is sample code with the libraries for those shields.
In addition to the polling approach, you could also implement Dynamic DNS on the Arduino and have the server push commands to your project. For this project, that approach was not necessary, but it would also allow the entire project to run on the Arduino alone, which would be pretty cool.