Introduction: Arduino Browser Based Remote Control (linux)

About: Focussing currently on supplying open source software to the masses. I supply linux CDs and DVDs across Europe, as well as mirror various open source projects. Currently I mirror openoffice.org http://rsync.…
We have kids.  I love them to bits but they keep hiding the remote control for the satellite and TV when they put the children's channels on.

After this happening on a daily basis for several years, and after my darling wife allowing me to have an Arduino for Christmas I decided that it was time to make something useful (in her eyes!) with the Arduino.

So here we have the culmination of that: a web-based interface to the Arduino that replaces my remotes and is accessible from my internal network.

When I figure out why my ethernet shield won't allow my arduino to keep a sketch I will write a new sketch that uses the ethernet shield as the web server, meaning I don't need apache installed on my computer.  Stay tuned, I will get there!

Step 1: Prerequisites

Hardware:

Arduino side:
Arduino - I am using an Arduino Uno R2
Breadboard - your local electronics shop, or the kitchen if you want an authentic breadboard
Mounting enclosure - I used an old plastic case with a transparent lid

Components:
Infrared LED - I desoldered one from a broken remote control (thanks kids!)
Infrared Receiver - I got mine from a magic eye remote extender
Transistor - I used a BC547
Resistor - I used a 1.5k ohm variable resistor set to 1k ohm
Breadboard jumper wires - I got mine from a solid core RJ45 cable reel

Computer side:
Computer to use as server
USB lead to Arduino


Software:
Arduino software - from arduino.cc
irremote library - from http://www.arcfn.com/2009/08/multi-protocol-infrared-remote-library.html (thanks Ken, great work!)
Apache web server with PHP installed - apache.org
Internal IP address - mine is 192.168.0.9
Picture of your remote control - google or a picture taken on your camera.  I saved mine at 200x600 resolution

Step 2: Building the Board

Using a breadboard for an arduino is highly recommended.  I mounted my Arduino and a breadboard in the same enclosure and wired all the pins I regularly use directly to the breadboard permanently.

Arduino pins used for this project:
5v, ground
Digital pins 3, 11 (pin 3 controls the IR LED, pin 11 connects to the IR receiver)

Step 3: Schematic

This schematic is very simple, 4 components and 6 wires.

IR LED connections:
Connect one of the legs of the resistor to Arduino digital pin 3
Connect the other leg of the resistor to the base pin of the transistor (the middle leg in my case)
Connect the emitter of the transistor to ground
Connect the collector of the transistor to the negative leg of the LED (short leg, flat side of the LED)
Connect the positive leg (long leg, curved side) of the LED to the 5v pin

IR receiver connections (you would need to find the pinout for your particular IR receiver):
GND pin to ground
VS pin to 5v
VO pin to Arduino digital pin 11

Step 4: Add Irremote Library to the Arduino Software

irremote is a great library written by Ken Shirriff and is available from his blog at http://www.arcfn.com/2009/08/multi-protocol-infrared-remote-library.html

Download the library from http://arcfn.com/files/IRremote.zip and install it as you would any other library for the arduino.

His blog has a lot of helpful information about the library and how to install it.

Step 5: Record the Codes From Your Remote Controls

Here is the start of the boring (but unavoidable) part:
Pressing every button on the remote control, saving the output string and mapping it to the virtual remote control.
You only need to do it once, expect to take approximately 20 minutes or so.

Start a text editor to save your output.
Create a new document and type out every button on your remote control, one per line:
Power
Up
Down
Left
Right
.. et cetera

Start the Arduino IDE and click on "Files->Examples->IRremote->IRrecvDump" and upload it to your Arduino.
This example will dump the remote codes to the serial port.

Start the Serial port monitor and press a key on your remote control.  You will see a string appear in the serial monitor window:
"Decoded *: * (* bits)". Copy this line and save it into your document on the appropriate line.

Repeat until you have all your keys stored in the text file.  I know how much fun this bit is, I have done it twice so far :P

We now need to do a little searching and replacing in the text file:
search for
"Decoded "
replace with
""
search for
": 0x"
replace with
","
search for
" ("
replace with
","
search for
" bits)"
replace with
""
So for a line such as:
Decoded NEC: 0x000110 (15 bits)
we should now have a line that says:
NEC,000110,15

Step 6: Create the Web Page for Your Remote Control

We now need to map the buttons on your image of your remote control.

I used http://www.maschek.hu/imagemap/imgmap to map the buttons and modified the code that website gives you to make it work.

Click on "Use an image on your computer: [choose file]", select your image, click [upload], click [accept]
Drop rectangles, circles etc onto each button. For HREF put
/remote.php?command= and the line for that button from the text document
for example /remote.php?command=NEC,000110,15
It would be wise (and aid immensely in debugging) if you also fill in Alt: with the button name but that is up to you.

Repeat for each button.

All done? Then we will continue.
At the bottom of that page is "Code", click on that and a box will open showing the code for the imagemap. Copy that and paste it into a new text document. This is the main part of our web page.

Here is my complete web page, just replace the ...

with your own code above and save it as remote.php in your web directory (/var/www on linux) along with your remote control images.
Change the lines for your own images:

"http://www.w3.org/TR/html4/loose.dtd">

Arduino LED control






Step 7: Upload the Remote Control Code to Your Arduino

Create a new sketch and paste the following code into it:

/*
* WebRemote
* An IR LED must be connected to Arduino PWM pin 3.
* Version 0.1 July, 2009
* This code copyright Gregory Fenton, http://labby.co.uk/2012/02/irremote-arduino-experimentation/
* IRremote Library copyright 2009 Ken Shirriff, http://arcfn.com
*/

#include
template inline Print &operator <<(Print &obj, T arg) { obj.print(arg); return obj; }
boolean ended = false;

char inData[64]; // Size as appropriate
byte index = 0;

#define EOP "\n"
IRsend irsend;

void setup()
{
Serial.begin(9600);
Serial << "Serial port initialised" << EOP;
}

void loop()
{
String pch, sType, sTemp;
char inChar,sTest, k;
int sBits;
long sHex;
int i, j;
while(1)
{
while(Serial.available() > 0)
{
inChar = Serial.read();
if(index == 0)
{
pch = "";
}
if(inChar == '\r' || inChar == '\n' || inChar == '/') // EOP
{
ended = true;
index = 0;
break;
}
else
{
if(index < 64) // Array size
{
pch += inChar;
index++;
}
}
}

if(ended)
{
// Parse the data in inData here...
pch.toUpperCase();
i = pch.indexOf(' ') != -1 ? pch.indexOf(' ') : pch.indexOf(',');
sType = pch.substring(0,i);
i++; // skip over ',' or ' '
// i now points to start of hex
j = pch.lastIndexOf(' ') != -1 ? pch.lastIndexOf(' ') : pch.lastIndexOf(','); // j now points to ',' or ' ' after hex

sHex = 0;

sTemp = pch.substring(i, j);
if(sTemp.substring(0,2) == String("0X"))
sTemp = sTemp.substring(2);
for(i = 0; i < sTemp.length(); i++)
{
k = sTemp[i];
if(!((k >= '0' && k <= '9')||(k >= 'A' && k <= 'F')))
break;
sHex *= 16;
if(k >= '0' && k <= '9')
sHex += (k - '0');
else if (k >= 'A' && k <= 'F')
sHex += ((k - 'A') + 10);
if(!((k >= '0' && k <= '9')||(k >= 'A' && k <= 'F')))
break;
}
sTemp = pch.substring(j+1);
sBits = 0;
for(i = 0; i < sTemp.length(); i++)
{
k = sTemp[i];
sBits *= 10;
if(k >= '0' && k <= '9')
sBits += (k - '0');
}
if(sType.length()>0)
{
Serial << pch << EOP << "Code type: "<< sType << " Hex: ";
Serial.print(sHex,HEX);
Serial << " Bits: " << sBits;
}
sendIt(sType, sHex, sBits);
pch = "";
ended = 0;
}
}
}

void sendIt(String sType, long sHex, int sBits)
{
for(int i = 0; i < 2; i++)
{
if(sType.equals(String("RC6")))
{
irsend.sendRC6(sHex, sBits);
}
else if (sType.equals(String("RC5")))
{
irsend.sendRC5(sHex, sBits);
}
else if(sType.equals(String("SONY")))
{
irsend.sendSony(sHex, sBits);
}
else if(sType.equals(String("NEC")))
{
if (!i) irsend.sendNEC(sHex, sBits);
}
else if(sType.equals(String("")))
{
Serial << "Delaying" << EOP;
delay(450);
}
delay(30);
}
}

Step 8: Connect to the Web Server From Your Computer

.. or phone or android or ipad or whatever:

go to http://webserver IP address/remote.php in your browser

For me the address is http://192.168.0.9/remote.php but yours will doubtless be different.

If all is working you should see a picture of your remote control with buttons you can click on.

Step 9: Optional Step: Edit Your Hosts File to Make It Easier to Use

A step I did was to edit my hosts file (/etc/hosts on linux, C:\Windows\System32\Drivers\etc\hosts on windows).

Note that this file can only be edited in an administrative command prompt (windows) or by su (linux)

Add the line
ip.add.re.ss remote

replace ip.add.re.ss with the server IP address and save the file.

You would need to do this on every device you wished to access the web page with the short name.

Now you can access the remote with http://remote/remote.php



This is my first proper instructable, be gentle and let me know if there are any problems so I can fix them.