When I published my previous article about how to control a led using a webpage, I was asked for an example with more than one led. Today I’m going to show you how to control two leds with a more stylish webpage thanks to some images…
- user’s browser contacts the web server and asks for HTML page;
- browser parses the page and finds external resources;
- browser asks for each resource to the web server.
Arduino’s sketch should be able to:
- read browser‘s request (saved in Ethernet::buffer);
- identify the resource the browser is requesting (HTML page, images…);
- create an header with the correct Content-Type;
- send header and resource to the browser.
Images are binary files: in our simple example we should be able to store them in our sketch, in the form of byte arrays. I found a very useful utility that helps with this conversion: bin2h.
Conversion’s result is a text file:
To save microcontroller’s RAM memory, we store the images in the program memory using the directive PROGMEM:
In the next page, you can find Arduino’s sketch…