loading
Picture of iphone controlled led without a computer or internet
DSC_0004.JPG
I build a small webside running on the arduino with ethernet I/O using HTML and a little bit of css.
When sending a HTTP request the script reads the request and gets a command from it.
You don't need internet, only a working network and a computer of smartphone connected to the same network.

Step 1: The parts

Picture of the parts
Parts: 1 arduino, 1 ethernet shield, or a Sparkfun Pro Ethernet (not for sale anymore....) 1 LED connected to digital pin 9 and GND, 1 network-cable working network
 
bingdo721 month ago

This is good.
I have been searching some application references in which WIZnet solution is applied, and found your project using Ethernet Shield.
In the Ethernet Shield WIZnet's W5100 chip is embedded.
If you are O.K. I'd like to post this article in WIZnet Museum (http://wiznetmuseum.com) for others.

macibear2 years ago
mr floris
this is the section of your code

if (c == '\n' && currentLineIsBlank) {
          delay(10);
          //
          client.print("<!DOCTYPE HTML>\n");
          client.print("<HTML>\n<HEAD>\n");
          client.print("<TITLE>fpoels iPhone Controlled LED wo computer or internet</TITLE>\n");
          client.print("<meta name='viewport' content='user-scalable=yes, width=device-width'>");
          client.print("<style type='text/css'>\n");
          client.print("body {\n background-color: white; \n color: #222; \n font-family: Helvetica; \n margin: 0; \n padding: 0\n }\n");
          if( led_ == OFF_ ){
            client.print("div#button_On  {\n background-color: lime; \n border-bottom: 1px solid #666; \n color: #222; \n display: block; \n font-color: black; \n font-size: 42px; \n font-weight: bold; \n padding: 32px 0; \n text-align: center; \n text-decoration: none\n }\n\n");
            client.print("div#button_Off {\n background-color: black; \n border-bottom: 1px solid #666; \n color: #222; \n display: block; \n font-color: lime;  \n font-size: 42px; \n font-weight: bold; \n padding: 32px 0; \n text-align: center; \n text-decoration: none\n }\n\n");
          }

          if( led_ == ON_ ){
            client.print("div#button_On  {\n background-color: red; \n border-bottom: 1px solid #666; \n color: #222; \n display: block; \n font-color: black; \n font-size: 42px; \n font-weight: bold; \n padding: 32px 0; \n text-align: center; \n text-decoration: none\n }\n\n");
            client.print("div#button_Off {\n background-color: black; \n border-bottom: 1px solid #666; \n color: #222; \n display: block; \n font-color: red;  \n font-size: 42px; \n font-weight: bold; \n padding: 32px 0; \n text-align: center; \n text-decoration: none\n }\n\n");
          }

          client.print("a {\n text-decoration: none;\n }");
          client.print("\n </style>\n");

create this effect when button_Off  =>   ON (black letter lime background)   when is button_On  =>     ON  (lime letter black background)
and
create this effect when button_Off  =>   OFF (black letter red background)   when is button_On  =>     OFF (red letter black background)

it is all on the "div#button_Off  line - again if i change the colors back to #ccc and black IT WORKS - if o modify IT DOESNOT 

another piece of info i have a iphone 3S with OS 4.2.1

this is weird....
macibear2 years ago
mr floris - i finally got your fabulous example working - i do not have any knowledge at all of any of this and would like to modify the code so when the button is off has different color - i changed the value from #ccc to black and the code does not run at all - changed it back to #ccc and it does run - what would make that to happend ?
fpoels (author)  macibear2 years ago
Strange....
Did you use 'black' or '#000' ?
Should work both but you never know.