Knowledge for the World

How to install Magic Mirror on your Raspberry Pi

Magic Mirror is essentially a webpage that runs on a web server housed inside your Raspberry Pi. It displays tons of cool information and can even be used to create your very own smart mirror!

Note: You can also use a Raspberry Pi B, B+ or 3 to complete this guide.

In these interests [?]
  • pi
    82 Subscribers Subscribe
  • magicmirror
    7 Subscribers Subscribe
1

Install Raspbian

Raspbian is the operating system that will run both MagicMirror and Jasper for us. If you plan on installing Jasper on your Raspberry Pi for adding voice controls, I recommend going with Raspbian Jessie. However, Raspbian Wheezy (an older version of Raspbian) will also work.

Download the Raspbian Jessie disk image from the Raspbian downloads page or the Raspbian Wheezy disk image from the Raspbian archives page and burn the image onto your SD card.

If you don't plan on installing Jasper, you can also use the latest version of Raspbian (Jessie). The disk image for this version of Raspbian can be found on the

2

Boot up your Pi

Unmount the SD card from your computer and insert it into your Pi. Connect your keyboard, mouse, HDMI cable, Wifi USB adapter, and, lastly, the Pi's power cable. You will now see the Raspbian GUI (desktop). If you've configured your Pi to boot directly into the shell, you can type the following to enter the Raspbian GUI:

startx

3

Set up your Wifi adapter

Our Magic Mirror needs to be wifi-enabled so that it can connect to the internet and so that we can access it remotely to set things up.

In the top right of your screen, click on the network icon (two computers with an X). Select your network, enter your wifi password, and click OK.

4

Find your Pi's IP

We'll need our Pi's IP so that we can connect to it from our regular computer and complete the rest of the installation from there.

On your Pi, navigate to Menu > Accessories > Terminal. Type the following and press enter:

ifconfig

Your Pi's IP will be located next to inet addr.

Alternatively, you can also ping your Pi from your computer to obtain the IP address; I wrote a short guide on doing this in OS X.

5

Connect to your Pi from your computer

Open Terminal (Mac) or Command Prompt (Windows). Type the following command and press enter:

ssh pi@your-pis-ip-address

When prompted for your password, use the default Raspberry Pi password: raspberry. If you see an authenticity of host warning, type yes and press enter.

6

Configure Raspbian

Change the default password
For better security, I recommend you change the Pi's default password to something else. Type the following, press enter, and follow the prompts:

passwd

Expand your Pi's filesystem to utilize all available space, and also to boot into the GUI
Type the following and press enter:

sudo raspi-config

Select Expand Filesystem and press enter.

Next, we need the Pi to boot into the Raspbian GUI for Chromium kiosk mode to launch (more on this later). To do this, select Enable Boot to Desktop Scratch and choose Desktop Log In. Highlight the choice and use Tab to get to and then press enter.

Finally, tab over to , press enter, and reboot your Pi by typing:

sudo reboot

Update your Pi

sudo apt-get update
sudo apt-get upgrade --yes

7

Install Chromium

Chromium is a web browser that we'll configure to to run as a kiosk, providing the interface for your Magic Mirror.

Run the following commands, one at a time, to install Chromium:

Download and install the packages (Wheezy)

sudo apt-get install chromium x11-xserver-utils unclutter

- or -

Download and install the packages (Jessie)

wget http://ftp.us.debian.org/debian/pool/main/libg/libgcrypt11/libgcrypt11_1.5.0-5+deb7u3_armhf.deb
wget http://launchpadlibrarian.net/218525709/chromium-browser_45.0.2454.85-0ubuntu0.14.04.1.1097_armhf.deb
wget http://launchpadlibrarian.net/218525711/chromium-codecs-ffmpeg-extra_45.0.2454.85-0ubuntu0.14.04.1.1097_armhf.deb
sudo dpkg -i libgcrypt11_1.5.0-5+deb7u3_armhf.deb
sudo dpkg -i chromium-codecs-ffmpeg-extra_45.0.2454.85-0ubuntu0.14.04.1.1097_armhf.deb
sudo dpkg -i chromium-browser_45.0.2454.85-0ubuntu0.14.04.1.1097_armhf.deb

8

Install Apache

The Magic Mirror dashboard is actually a webpage, so we'll need to install a web server so that we can host the dashboard.

Install Apache

sudo apt-get install apache2 apache2-doc apache2-utils

Add PHP support

sudo apt-get install libapache2-mod-php5 php5 php-pear php5-xcache

Restart your pi and Apache will start:

sudo reboot

9

Install the interface

There are a number of great Magic Mirror dashboards available -- I went with one created by Michael Teeuw since it's beautiful and he's a bit of a Magic Mirror pioneer.

Change to the webroot

cd /var/www

Note: In Jessie, it seems that the webroot may be /var/www/html instead.

Clone MichMich's MagicMirror repo

sudo git clone https://github.com/MichMich/MagicMirror.git

Move the files into webroot (one directory above) and remove old files

cd MagicMirror
sudo mv * ..
cd ..
sudo rm -rf MagicMirror

Congratulations! You can now visit your Pi's IP address in the web browser on your computer (assuming it's on the same network as your Pi), and you'll see the MagicMirror dashboard. In Dutch.

10

Customize the interface

Time to configure the interface for your location and needs!

sudo nano js/config.js

Update language
Change the language at the top to your language. Use en for english:

lang: 'en',

Update weather settings
Change the weather settings to your location (weather.params.q), preferred unit (weather.params.units), and language (weather.params.lang). I live in Tampa, Florida, and this is my config in the array:

params: {
    q: 'Tampa,Florida',
    units: 'imperial',
    lang: 'en',
    APPID: 'YOUR_FREE_OPENWEATHER_API_KEY'
}

Add your OpenWeather API key
Head on over to OpenWeatherMap to generate your free API key and paste it in.

Configure compliments
MagicMirror spins through an array of complements based on the time of day. If you'd like, you can change these compliments to something different -- famous quotes, perhaps?

Configure your calendar
By default, MagicMirror shows a public iCal calendar (in Dutch, no idea whose it is -- perhaps the original creator?) and a calendar showing football (soccer) matches. You can change these by pasting a calendar's public URL here.

For now, I decided to remove both and instead subscribe to the Tampa Bay Rays schedule and a Google Calendar containing a list of national holidays. These calendar URLs normally end in .ics, and you can Google the one you're looking for.

Down the road, I'll add authentication so I can link up my Google Calendar. You can also change the icon that's loaded by changing the value of calendar.urls.symbol; this value should be from the list of FontAwesome icons found here, with the "fa-" portion removed. For example, 'fa-bullhorn' becomes just 'bullhorn'.

When you're finished configuring, save and exit.

Customize the interface
11

Turn Chromium into a kiosk

Now we'll configure Chromium to run in kiosk mode.

Open the autostart config file in the Nano editor (or Vim if you're crazy or a time traveler).

Config file for Wheezy:

sudo nano /etc/xdg/lxsession/LXDE-pi/autostart

- or -

Config file for Jessie:

sudo nano ~/.config/lxsession/LXDE-pi/autostart

Disable the screensaver
For both Wheezy and Jessie, comment out the following line using a hash symbol (#):

# @xscreensaver -no-splash

Launch Chromium on startup in kiosk mode
For Wheezy, add the following lines to the bottom of the file:

@xset s off
@xset -dpms
@xset s noblank
@unclutter -idle 1
/usr/bin/chromium --kiosk --ignore-certificate-errors --disable-restore-session-state "http://localhost"

For Jessie, add the following lines to the bottom of the file:

@xset s off
@xset -dpms
@xset s noblank
@unclutter -idle 1
@chromium-browser --incognito --kiosk http://localhost/

To exit, press CTRL-X, type Y and press enter.

Next, we need to modify the Pi's BIOS settings for a little extra awesomeness.

Open BIOS config:

sudo nano /boot/config.txt

Use portrait monitor orientation
Add the following line to rate the display 90 degrees:

display_rotate=1

To rotate in the other direction (270 degrees), use the following line instead:

display_rotate=3

Enable HDMI hotplugging
Uncomment the following line:

hdmi_force_hotplug=1

Save and exit. Finally, reboot your Pi once more:

sudo reboot

12

Back up your SD card (optional)

Now that your MagicMirror setup is working, I highly recommend you create a backup of your SD card image. This is totally optional, but if something gets messed up when installing Jasper it will be easy to revert. I wrote a guide on how to back up your SD card for Mac or, if you have Windows, Lifehacker wrote a great guide as well.

13

Optional: Install Jasper

Jasper is an open-source text-to-speech and speech-to-text processing platform, allowing you to speak commands to your Raspberry Pi such as to play a Spotify playlist, add things to your Google Calendar, or integrate with openHAB to control your entire house. Jasper is definitely a cool feature to add to your mirror -- if you're up for the task!

I wrote an exhaustive guide on how to install Jasper on your Pi. You can also see my completed Magic Mirror build here, which is a great read if you're also into woodworking.

14

Questions? Problems?

The Raspberry Pi can be a complicated beast. Post below and I'll do my best to help you out!