Longer in Front of Your Own Mirror !

It all started for me when I was thinking about a topic for a school project.

Just at that moment I was looking for something to help my grandfather. He had told me that he was worried because he was becoming forgetful, has troubles to walk ...

However he did not want to be admitted to a care centre but to stay in his beloved home.

The idea came to me to make a smart mirror.

On this I could put all kinds of things that could support him.

As a result, his wish could come true. (Read : Longer in front of your own mirror!)

I had to take into account that the project was limited in time. I have chosen to include his medication schedule, the indoor temperature and an instructional video about brushing his teeth.

In addition, I have another outdoor lamp attached to my Rasberry Pi that is controlled by a remote control. This lamp should alert neighbors and any passersby or my grandmother in the garden that my grandfather is in distress.

Of course, the mirror can still be expanded with all sorts of features according to the need that arises.

 Below you will find how I made the smart mirror.

Before we start, there are a few parts you will need to make a smart mirror. These parts together cost me approximate 162,50 euro, depending on the material you already have.

tools

- 1 Raspberry pi 4 model b 2gb - 1 Raspberry pi power adapter

- 1 Philips tv screen - 1 HDMI-to-microhdmi cable

- 1 Ds18b20 temperature sensor (one wire) - 1 Micro sd-card 16gb

- 1 Remote + IR receiver sensor - 2 Batteries

- 1 RFID reader + id-card and tag - 2 Battery snap

- 1 5V relais module - 1 Plexiglass

- 1 Button - 1 Sun protection window film

- 1 Warning light - 1 Wires

- 1 Wood

other tools

Sawing machine

Milling machine

Drill

Screws

Glue

Sandpaper

Oil (oils frame)

Hinges

download the following zip-file with the link below:

p1_2023_student_base_v2_mini.zip

Install the image file on your SD card.

2.          Insert the SD card in your rasberry pi

3.          Now you can boot the rasberry pi

Start by placing the code on the Rasberry Pi.

How to do that?

1.          Start up visual studio code

Start an SSH session in visual studio code with the green icon

A bar will appear at the top to log in to your raspberry pi.

Enter the following:

pi@192.168.168.169

Then visual studio code asks for a password.

Enter the following:

W8w00rd

Now connect to Wi-Fi first.

After the Raspberry pi is connected to the Internet, you can place my written code on the raspberry pi.

Click on the link below to download:

prototypen.zip

By clicking on the link we are going to retrieve a folder containing all the files to make the mirror work.

Place the downloaded folder in the /home/pi directory to make the code work completely

The contents of the code in a nutshell

The directory consists three main folders: frontend, backend and database, which we discuss below.

Backend:

This folder contains the entire code to make all the sensors, website and smart mirror, functional.

-     The functionality is provided by treading, routes and socket io.

-     A connection must be made to the database so that data can be retrieved and written out.

-     Code is written to make the sensors work.

-     The temperature is read through the "/sys/bus/w1/devices/<sensor address>/w1_slave" file. If you are using a temperature sensor you may have a different address. Change the new address at the <sensor address> directory to make your own sensor work.

-     The RFID reader uses the mrfc522 library that allows the sensor to be "read".

-     On the IR receiver sensor there is a code to read the buttons on the remote.

These buttons then allow a flash light to be activated, the movie to be displayed on the mirror and to read the IP of the installed web server.

-     In addition, I also wrote a code to shut down the raspberry nicely. For that, I also used a button.

Frontend:

Here we find the complete code to make the application on the smart mirror and the web application, appear and work.

-     This folder has images, script and style folders. In addition, we also find the "history.html" and the "smartmirror.html" on it.

-     The images folder contains all the assets to display icons and video on all applications.

-     The script folder contains an app.js and datahandler.js to get proper communication with the database.

-     The style folder contains a screen.css and a smartmirror.css to override the layout of the history and smartmirror html.

-     The history.html and smartmirror.html provide the structure of the application/website.

In the folder we see a sql-file containing code to build the necessary database.

This file must be copied, pasted and run in "mysql workbench".

Start "mysql workbench" and create a session to connect to the database server on the raspberry pi. You do this by pressing the plus.

 Then enter what you see in the first picture.

Now you can login to the raspberry pi's database server.

Run a new sql file and paste the copied code into it.

Press the tinfoil to run the file.

After you have refreshed it says "smartmirrordb".

After this you can see what the database looks like (second picture).

For my project, we are using a temperature sensor, ir receiver sensor and an rfid-reader.

The temperature sensor is used to measure temperature.

The ir receiver sensor will be used to receive signals from the remote control.

We will use the rfid-reader to display the correct medication schedule on the mirror.

We will also use a push button, relay, flash light and lcd with potentiometer.

The lcd will be used to show the ip of my raspberry pi connected to the internet.

We use the push button to properly shut down the raspberry pi.

With the relays we make sure that the flash light can be controlled.

On the following images you can see the breadboard and the electrical diagram you can follow to make the mirror:

(The order of the photos are arranged vertically from left to right and from top to bottom)

The frame around the mirror is made of wooden planks. The planks have a thickness of

18 mm and a width of 100 mm. (1 and 2)

-The boards are cut to size and mitred. (3)

-A slot is made in all boards by sawing (4 and 5).

-The side, top and back are assembled using glue.

-The bottom shelf of the mirror is prepared. This shelf have a thickness of 400 mm to fit/hide all the components in it.

Holes be drilled to insert the LCD screen, RFID reader, IR receiver and wiring of the lamp. (6 and 7)   

Then the shelf is placed between the 2 side shelves with 4 screws. Screws are used here because this way it can be openend if any repairs to the electronics need to be done.

-Another opening is made at the back to make the smart mirror easy to move.

To close the back side, a board is cut to size and attached with hinges to the frame. First we make holes in the board for ventilation.

This way all the electronics are well protected. (8 and 9)

-The frame is sanded and rubbed with oil to protect the wood

The frame for the door is assembled in a similar manner . (10-13)

Apply the mirror foil to the plexiglass.

1.Remove the protective film from the plexiglass on one side.

2.Make sure that side is clean, so that the mirror foil can be hung nicely.

If the plexiglass isn’t clean, you will get air bubbles under the foil.

3.Hang the mirror foil on the plexiglass using water and a little bit of soap

Web server

Open a therminal and enter the following: nano /etc/apache2/sites-available/000-default.conf

Then use the arrow to go to the line where it says DocumentRoot /var/www/html or DocumentRoot /home/pi/<name_of_your_repo>/front and change it to DocumentRoot /home/pi/prototypes/frontend

Save by pressing Ctrl + x followed by Y and Enter

Then we restart Apache by entering the following in the therminal: service apache2 restart.

Enter the password "W8w00rd to accept the restart.

Now we still need to set the permissions on the root folder correctly.

Open nano /etc/apache2/apache2.conf through the therminal and use the down arrow to look for the following lines:

<Directory />

     Options FollowSymLinks

     AllowOverride All

     Require all denied

</Directory>

and change it to:

<Directory />

      Options Indexes FollowSymLinks Includes ExecCGI

     AllowOverride All

     Require all granted

</Directory>

Saving we do by doing Ctrl + x followed by Y and Enter. Then we restart Apache by entering "service apache2 restart" and then enter "W8w00rd" to accept it.

Finally, we check to see if apache has started up correctly: service apache2 status.

You should get approximately the following output:

Loaded: loaded (/lib/systemd/system/apache2.service; enabled; vendor preset: enabled)

Active: active (running) since ...

Getting Smartmirror ready for TV

We create a kiosk.sh via the therminal by entering " sudo nano ~/kiosk.sh".

The following code is placed in the kiosk.sh file:

#!/bin/bash

xset s noblank

xset s off

xset -dpms

unclutter -idle 0.5 -root &

sed -i 's/"exited_cleanly":false/"exited_cleanly":true/' /home/$USER/.config/chromium/Default/Preferences

sed -i 's/"exit_type":"Crashed"/"exit_type":"Normal"/' /home/$USER/.config/chromium/Default/Preferences

/usr/bin/chromium-browser --noerrdialogs --disable-infobars --kiosk http://127.0.0.1/smartmirror.html  &

while true; do

   xdotool keydown ctrl+Next; xdotool keyup ctrl+Next;

   sleep 10

done

Then we use the following command to set up the service properly: sudo nano /lib/systemd/system/kiosk.service.

following code can be replaced by be what is in this file:

[Unit]

Description=Chromium Kiosk

Wants=graphical.target

After=graphical.target

[Service]

Environment=DISPLAY=:0.0

Environment=XAUTHORITY=/home/pi/.Xauthority

Type=simple

ExecStart=/bin/bash /home/pi/kiosk.sh

Restart=on-abort

User=pi

Group=pi

[Install]

WantedBy=graphical.target

The "display" variable may be different for each user.

We can check this with the command: echo $DISPLAY

The value that is printed should be at 'Environment=DISPLAY=:'

When it is adjusted we do ctrl-x and y to save it.

Start the service by "sudo systemctl start kiosk.service"

To check the status we enter the following: sudo systemctl status kiosk.service.

If the status is not running, we enter the following: sudo systemctl stop kiosk.service.

Then restart the process.

If the status is running, we enter "sudo systemctl enable kiosk.service" in the therminal to start up the service when turning on the raspberry pi.

Now we would see the smart mirror application start up when we power up the raspberry pi.

Automatic backend startup

We create the following file named myproject.service

Place the following code in the file:

[Unit]

Description=ProjectOne Project

After=network.target

[Service]

ExecStart=/home/pi/prototypen/venv/bin/python -u /home/pi/prototypen/backend/app.py

WorkingDirectory=/home/pi/prototypen/backend

StandardOutput=inherit

StandardError=inherit

Restart=always

User=pi

[Install]

WantedBy=multi-user.target

Now we copy this file as root user to /etc/systemd/system with the command sudo cp myproject.service /etc/systemd/system/myproject.service

Now we can test the file by starting it: sudo systemctl start myproject.service

You can stop the file by entering the command: sudo systemctl stop myproject.service

If everything works fine you can have the script start automatically after booting: sudo systemctl enable myproject.service

You can view the status of your service via: sudo service myproject status

You can view the logs via: sudo journalctl -u myproject

Finally, I would like to thank my professors and fellow students at MCT Howest for helping me create my project and wish you the best of luck in creating this smart mirror.

Enjoy!