WiFi Doorbell
A web-enabled WiFi doorbell
When we moved in our house this year, one of the first things we missed was a doorbell. There was a bell button at the gate, but since the whole building had been gutted down to the concrete nobody knew where the cable ended. When I found a cut-off electric cable in the basement, I suspected that it could be the one leading to the button. With a little help of my beloved multimeter I could confirm that assumption.
However, that led to the next problem: Not only was the cable cut 2 cm off the wall, there was also no way to extend it to the first floor. And a doorbell in the basement is pretty much useless. There are WiFi solutions available that allow to put the bell in a different room, but they are expensive and need a 220 V hookup. So we settled with a wireless doorbell for the time being but it turned out not to be completely reliable, pretty ugly in comparison to the existing button and I did not like the battery based solution. So I set out to revive the old doorbell with the help of a microcontroller. Or two.
Parts list
The concept is easy: The first microcontroller detects the push on the button and sends a request to the second microcontroller via the home WiFi. That second microcontroller is connected to a speaker and plays a bell sound. Since I am pretty new to the Arduino world and wanted to keep things easy, I used Espressif ESP32 boards that have integrated WiFi. To make it even easier, I added a cheap MP3 player module.
- 2× Espressif ESP32 development boards
- dfplayer MP3 module with a micro SD card. I used a doorbell sound from orangefreesounds.com
- Speaker: Adafruit 3" (4Ω 3W ADA1314)
- 2× 1 kΩ resistor
- 2× 3.3 V LEDs to indicate operation (optional)
- Pushbutton to trigger the bell from the sender (optional)
- One 4×8 cm PCB and one 5×7 cm PCB
Assembly
Not much to see here. Basically just throwing all the modules together. In the end I left out the LED on the speaker side. (It is still addressed in the code, though.)
Case
I designed the two cases in Onshape, one for the sender and one for the speaker unit. The speaker case has a thin grid at the bottom and a little stand that is glued on in order to let the sound pass out.
Results
Code
While the sender does not much more than blinking the LED slightly differently depending on what it is doing, the speaker unit offers a bit more: It starts up a tiny web server that provides the interface for the sender and can also be used directly via the browser. It allows also to set the speaker volume:
Sender Code
/*
* Sources:
* https://www.arduino.cc/en/Tutorial/Button
* https://techtutorialsx.com/2017/05/19/esp32-http-get-requests/
*/
#include <WiFi.h>
#include <HTTPClient.h>
const char* ssid = "WiFi SSID";
const char* password = "WiFi password";
const char* bellUrl = "http://192.168.1.149/bell/on";
const int buttonPin = 21; // the number of the pushbutton pin
const int ledPin = 23; // the number of the LED pin
int buttonState = 0;
void setup() {
Serial.begin(115200);
btStop(); // turn off bluetooth
pinMode(ledPin, OUTPUT);
pinMode(buttonPin, INPUT);
connectWifi();
}
void loop() {
if ((WiFi.status() == WL_CONNECTED)) {
buttonState = digitalRead(buttonPin);
delay(100);
if (buttonState == HIGH) {
digitalWrite(ledPin, HIGH);
HTTPClient http;
http.begin(bellUrl);
Serial.print("GET ");
Serial.println(bellUrl);
int httpCode = http.GET();
if (httpCode > 0) {
//String payload = http.getString();
Serial.println(httpCode);
//Serial.println(payload);
}
else {
Serial.println("Error on HTTP request");
}
http.end();
delay(200);
}
else {
digitalWrite(ledPin, LOW);
}
}
else {
Serial.println("WiFi not connected!");
digitalWrite(ledPin, HIGH);
delay(200);
digitalWrite(ledPin, LOW);
delay(50);
digitalWrite(ledPin, HIGH);
delay(200);
digitalWrite(ledPin, LOW);
connectWifi();
}
}
void connectWifi() {
boolean ledStatus = false;
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
ledStatus = !ledStatus;
digitalWrite(ledPin, ledStatus);
}
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());
}Speaker Code
/*
Sources:
https://www.youtube.com/watch?v=kq2RLz65_w0
https://www.dfrobot.com/wiki/index.php/DFPlayer_Mini_SKU:DFR0299
https://github.com/pcbreflux/espressif/blob/master/esp32/arduino/sketchbook/ESP32_DFPlayer_full/ESP32_DFPlayer_full.ino
https://github.com/pcbreflux/espressif/blob/master/esp32/arduino/sketchbook/ESP32_DFPlayer_full/setup.png
https://randomnerdtutorials.com/esp32-web-server-arduino-ide/
*/
#include <Arduino.h>
#include "DFRobotDFPlayerMini.h"
#include <WiFi.h>
HardwareSerial hwSerial(1);
DFRobotDFPlayerMini dfPlayer;
int volume = 5;
const char* ssid = "WiFi SSID";
const char* password = "WiFi password";
WiFiServer server(80); // Set web server port number to 80
String header;
String ledState = "";
const int ledPin = 26;
unsigned long timestamp = 0;
void setup()
{
btStop(); // turn off bluetooth
hwSerial.begin(9600, SERIAL_8N1, 18, 19); // speed, type, TX, RX
Serial.begin(115200);
// WiFi & LED ==================================================================
pinMode(ledPin, OUTPUT);
digitalWrite(ledPin, LOW);
// Connect to Wi-Fi network with SSID and password
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
// Print local IP address and start web server
Serial.println("");
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());
server.begin();
delay(500);
dfPlayer.begin(hwSerial);
dfPlayer.setTimeOut(500);
dfPlayer.volume(volume); // Set volume value (0~30).
dfPlayer.EQ(DFPLAYER_EQ_NORMAL);
dfPlayer.outputDevice(DFPLAYER_DEVICE_SD);
ledState = "on";
digitalWrite(ledPin, HIGH);
timestamp = millis();
dfPlayer.play(1); // Play the first mp3
}
void loop() {
WiFiClient client = server.available(); // Listen for incoming clients
if (ledState == "on" && (millis() - timestamp) > 2000) {
ledState = "off";
digitalWrite(ledPin, LOW);
}
if (client) {
String currentLine = ""; // make a String to hold incoming data from the client
while (client.connected()) { // loop while the client's connected
if (client.available()) { // if there's bytes to read from the client,
char c = client.read(); // read a byte, then
Serial.write(c); // print it out the serial monitor
header += c;
if (c == '\n') { // if the byte is a newline character
// if the current line is blank, you got two newline characters in a row.
// that's the end of the client HTTP request, so send a response:
if (currentLine.length() == 0) {
// HTTP headers always start with a response code (e.g. HTTP/1.1 200 OK)
// and a content-type so the client knows what's coming, then a blank line:
client.println("HTTP/1.1 200 OK");
client.println("Content-type:text/html");
client.println("Connection: close");
client.println();
// turns the GPIOs on and off
if (header.indexOf("GET /bell/on") >= 0) {
ledState = "on";
digitalWrite(ledPin, HIGH);
timestamp = millis();
dfPlayer.play(1); //Play the first mp3
}
else if (header.indexOf("GET /volume/") >= 0) { // yes, I know this is not RESTful
String str1 = header;
str1 = str1.substring(header.indexOf("GET /volume/") + 12);
volume = str1.substring(0, str1.indexOf(" ")).toInt();
if (volume < 0) {
volume = 0;
}
else if (volume > 30) {
volume = 30;
}
dfPlayer.volume(volume);
Serial.print("volume set to ");
Serial.println(volume);
}
// Display the HTML web page
client.println("<!DOCTYPE html><html>");
client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
client.println("<link rel=\"icon\" href=\"data:,\">");
client.println("<title>Doorbell</title>");
client.println("<style>html { font-family: sans-serif; display: inline-block; margin: 0px auto; text-align: center; }");
client.println(".button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px; text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
client.println(".button2 { background-color: #4CAF50; border: none; color: white; padding: 4px 10px; text-decoration: none; margin: 1px; cursor: pointer;}</style></head>");
client.println("<body><h1>Doorbell</h1>");
client.println("<p>Volume: <a href=\"/volume/" + String(volume-1) + "\"><button class=\"button2\">−</button></a> " + String(volume) + " <a href=\"/volume/" + String(volume+1) + "\"><button class=\"button2\">+</button></a></p>");
client.println("<p><a href=\"/bell/on\"><button class=\"button\">Ring</button></a></p>");
client.println("<p style='margin-top: 40px; font-size: 8px;'>dfplayer status: " + printDetail(dfPlayer.readType(), dfPlayer.read()) + "</p>");
client.println("<p style='font-size: 8px;'>LED - State " + ledState + "</p>");
client.println("</body></html>");
// The HTTP response ends with another blank line
client.println();
// Break out of the while loop
break;
} else { // if you got a newline, then clear currentLine
currentLine = "";
}
} else if (c != '\r') { // if you got anything else but a carriage return character,
currentLine += c; // add it to the end of the currentLine
}
}
}
// Clear the header variable
header = "";
// Close the connection
client.stop();
Serial.println("Client disconnected.");
Serial.println("");
}
}
String printDetail(uint8_t type, int value){
switch (type) {
case TimeOut:
return "Time Out!";
break;
case WrongStack:
return "Stack Wrong!";
break;
case DFPlayerCardInserted:
return "Card Inserted!";
break;
case DFPlayerCardRemoved:
return "Card Removed!";
break;
case DFPlayerCardOnline:
return "Card Online!";
break;
case DFPlayerPlayFinished:
return "Play Finished!";
break;
case DFPlayerError:
switch (value) {
case Busy:
return "Error: Card not found";
break;
case Sleeping:
return "Error: Sleeping";
break;
case SerialWrongStack:
return "Error: Get Wrong Stack";
break;
case CheckSumNotMatch:
return "Error: Check Sum Not Match";
break;
case FileIndexOut:
return "Error: File Index Out of Bound";
break;
case FileMismatch:
return "Error: Cannot Find File";
break;
case Advertise:
return "Error: In Advertise";
break;
default:
break;
}
break;
default:
break;
}
}