Many of us are working from home these days. And we all fear those embarrassing moments when you are in a video conference, and your children rush in, blocking the camera while feeding you with a candy bar. Pete described his device which is a door sign lighted by LEDs: Red flashing says "Do not disturb" and green tells you "Feel free to enter". This 4.0 Version uses a WLAN attached ESP-32 controller and a 2.8" TFT touch display to offer better connectivity and more functions.
- ESP-32 Dev Kit C from AZ Delivery or Amazon (about 10 €)
- 2.8" TFT Touch Display 240 x 320 pixel, e.g. Amazon (about 15 €)
- 2 x Part number: (102-9147)
- 1 x MIKROE-513, 10 piece Breadboard Jumper Wire Kit from RS, Part number: (791-6463)
- Your favourite 3D filament
- Solder iron
- coloured flat ribbon wire (10 cm)
- 3 ruthex threaded insert M3 x 5,7 mm (e.g. Amazon)
- 3 M3 x 8 mm screws
- USB Powerbank or 5 V USB power supply
- Local WLAN with known credentials, internet access and DHCP server
- Smartphone, tablet or PC connected to the WLAN and any browser
- PC with Arduino IDE installed
In the red or orange state, people may ask to get permission to enter by pressing the touch display. A pending request is indicated by a blue background colour of the display.
In the red or orange state, you may start a countdown timer. Its start value is entered by pressing one of three buttons on the web page: "5" and "10" are adding 5 or 10 minutes to the current time left. "00" resets the timer. The time left (in minutes) is also displayed on the TFT display (door sign). When the timer elapses, the sign is automatically switched into the green state.
You can end the timer by clicking on one of the three state buttons.
How to build
Powering the device
If you have never done HTML programming and HTTP server stuff before, this is an ideal project to learn how easy it is to set up a web server.
There are about 350 lines of code in Arduino slang C++. Lots of comments will help you understand the code. For the HTML part, I advise you to google and use a beginners tutorial to understand the concept. When you are new to HTTP client-server communication, please keep in mind there are two things in a server program: One part is receiving messages from the browser and interprets them. The other part is building and sending an HTML coded page description which is interpreted by the browser and used to build what you see on your phone's or PC's screen.
In our case, we do have a third part which is in charge of building the content of the TFT display and monitoring the touch output of the TFT. We are using the complete 2.8" display as a single touch area and therefore do not need to calibrate the touch output.
Installing ESP32 Add-on in Arduino IDE
- In your Arduino IDE, go to File> Preferences.
- Open the Boards Manager. Go to Tools > Board > Boards Manager…
- Search for ESP32 and press install button for the “ESP32 by Espressif Systems“:
- That's it. It should be installed after a few seconds.
Now you have the ESP-32 core libraries instead of the standard libraries. This e.g. does replace the "time" library with a version that offers Time Server connectivity over WLAN (TSN support). I have used this feature to display the current Internet time on my web GUI. If you do not have internet connectivity in your WLAN or want to reduce the traffic for some reason, please remove the lines of the function "StringLocalTime()" and maybe also be the line in the "makepage()" function, which places the time string on the web page.
You will also need to install the "TFT_eSPI" library. Please use the library manager to do so.
This library needs to have access to a font file "MyFont.h" in the sketch directory. I have copied a version into the download folder.
You will also find a file "TFT_eSPI.h" in this folder. This is just for your convenience. You can look into the file and see the changes which need to be made for the display used. The file needs to be placed in the library folder of the "TFT_eSPI" library. It has explanations included what you need to change to declare, e.g. the pins used for display connection.
Before your ESP-32 can connect to the WLAN, you need to change the credentials in the code (SSID and password) to match those of your local network. For the first connection, you should also turn on the serial monitor on your Arduino IDE. You will need to look into the output data. I have placed a line into the code which will output the IP address of your device. This IP must be used in your browser to access the webserver. In most cases, it will not change while you connect to a single specific router (the one with the DHCP server).
When you have compiled and uploaded the sketch, the system should start with a green screen. It may not be responsive during the first seconds, depending on connection problems with a time server.
Please note that the ESP web server is very limited. I can only handle one client per time. So you may have difficulties using more that one browser simultaneously to access the devices web GUI.
Even more "over-engineering"?
Please surprise me with more ideas. How about getting the data into the cloud? Wouldn't that be a fantastic possibility for your boss to control your home office presence? You could add another button to manually acknowledge your presence whenever he is generating a "request to proof presence". And go on being inventive by designing a little servo-driven robot which detects such a request and clicks the mouse button for an acknowledgement to fake your presence while you enjoy your time with a "Science and Fun for Kids" project.