Construire un miroir magique avec un Raspberry Pi – Partie 1

Qu’est ce qu’un miroir magique ?

C’est un Ă©cran connectĂ© Ă  un système (ici un Raspberry Pi 3) qui affiche des informations pertinentes en continue provenant de plusieurs flux. Il est connectĂ© Ă  internet et est recouvert d’un miroir sans tain.

Choix du matériel utilisé :

  • Raspberry Pi 3, boitier, alimentation, carte SD et câble HDMI (CanaKit, 99 $ CA)
  • Ecran BenQ 24 pouces (GL2460 HM, 180 $ CA)
  • Miroir sans tain (70 $ CA)

En ce qui concerne le choix de l’Ă©cran, la dimension correspond Ă  celle du miroir sans teint qui sera posĂ© par-dessus. L’Ă©cran doit avoir des connectiques (alimentation et HDMI) qui ne doivent pas se brancher perpendiculaire Ă  l’Ă©cran afin de positionner les câbles facilement lors de la pose final de l’Ă©cran dans un cadre :

Ce tutoriel est divisé en 2 parties  :

  • Part.1 : Installation logicielle
    • Installer Raspbian Jessie Lite
    • Configurer le système
    • Installer MagicMirror 2
    • Automatiser le lancement
    • Ajout de modules
    • Mettre Ă  jour MagicMirror 2 et les modules

Ce tutoriel a été effectué depuis le terminal de macOS Sierra.

1. Installer Raspbian Jessie Lite

Les étapes suivantes seront effectuées sur votre carte SD connectée à votre ordinateur :

  1. Dans un premier temps, tĂ©lĂ©charger l’image disponible depuis le site officiel de Raspberry Pi, puis extraire le fichier .zip. Dans cet article, il est question de la version Jessie Lite.
  2. Une fois la carte SD connectĂ©e, il faut s’assurer que celle ci soit formatĂ©e en FAT 32. Après avoir utilisĂ© la fonction native de formatage du système d’exploitation (que ce soit avec Windows et Mac, une erreur survient dans ce cas dans les prochaines Ă©tapes), il est prĂ©fĂ©rable de recourir Ă  l’utilitaire SD Card Formatter qui est disponible sur les 2 plateformes.
  3. Afin d’installer le système depuis l’image, il est possible de le faire directement en ligne de commande. D’abord, il faut identifier le disque qui correspond Ă  la carte SD :
    diskutil list
  4. Une fois identifié (dans ce cas-ci : disk2), démonter la carte SD
    diskutil unmountDisk /dev/disk2
  5. Copier l’image sur la carte, avec la commande suivante, où 2017-01-11-raspbian-jessie-lite.img est le nom de l’image et disk2 est le nom du disque identifiĂ© plus haut
    sudo dd if=2017-01-11-raspbian-jessie-lite.img of=/dev/rdisk2 bs=1m
    

Ce qui devrait donner le résultat suivant :

2. Configurer le système

L’Ă©tape qui suit après que Raspbian soit installĂ© sur la carte SD est de l’insĂ©rer dans le Raspberry Pi, puis de connecter l’alimentation. Un clavier et une souris branchĂ©s en USB sont requis pour la suite. Une fois le système initialisĂ©, il faut entrer les valeurs suivantes qui sont celles par dĂ©faut afin de s’authentifier :

Username: pi

Password: raspberry

On va activer les configurations nécessaires

sudo raspi-config

Il est possible de changer certains paramètres depuis l’interface graphique :

Ceux qui nous intéressent sont :

  • 3. Boot Options, Desktop/CLI, choisir Desktop ou Desktop Autologin si vous ne souhaitez pas renseigner de mot de passe
  • 4. Localisation Options, Timezone
  • 5. Interfacing Options, SSH : activer le serveur (cette option se trouvait auparavant dans 7. Advanced Options, A4 SSH)
  • 7. Advanced options, A3 Memory Spit : Mettre la valeur à 128

Pour configurer le wifi, il faut d’abord:

  • Lister les rĂ©seaux Wifi disponibles
    sudo iwlist wlan0 scan | egrep ESSID
  • Renseigner les informations du rĂ©seau souhaitĂ© dans le fichier wpa_supplicant.conf
    sudo nano /etc/wpa_supplicant/wpa_supplicant.conf

    Avec le code suivant Ă  rajouter

    network={
    ssid="Le nom de votre Wifi"
    psk="Le Mot de passe du Wifi"
    }

    Il faut ensuite relancer l’interface sans-fil

    sudo ifdown wlan0
    sudo ifup wlan0

    Attendre ensuite quelques secondes, puis vérifier en faisant un ping pour confirmer le bon fonctionnement.

Au tour du SSH !

Maintenant que le SSH et le Wifi sont activĂ©s, il suffit de tester l’accès depuis un ordinateur distant.

ssh pi@192.168.2.56

Si une erreur survient, comme dans le cas de plusieurs réinstallations par exemple :

Il faut renouveler le certificat en faisant la commande

ssh-keygen -R adresseIP

où adresseIP est celle de votre Raspberry, qui est visible avec la commande ifconfig (interface wlan0)

Ensuite, mettez à jour le système

sudo apt-get update
sudo apt-get upgrade

Puis installer Xserver, LXDE-gui et lightdm

sudo apt-get install xinit xserver-xorg
sudo apt-get install lxde-core sudo apt-get install lightdm

Afin de pouvoir rĂ©cupĂ©rer le projet MagicMirror, il faut installer l’application Git

sudo apt install git

Les paquets manquants suivants doivent être également installés

sudo apt-get install libxss1
sudo apt-get install libnss3

Ainsi que l’application permettant de cacher automatiquement le curseur de la souris

sudo apt-get install unclutter

3. Installer MagicMirror 2

Pour déployer automatiquement le projet MagicMirror 2 disponible sur Github

sudo curl -sL https://raw.githubusercontent.com/MichMich/MagicMirror/master/installers/raspberry.sh | bash

Il faut ensuite retourner dans le dossier du projet, qui se trouve dans /home/pi

cd ~/MagicMirror

Puis installer NPM

npm install

Deux choix sont possibles :

  • Soit dupliquer le fichier config/config.js.sample en config/config.js
    cp config/config.js.sample config/config.js
  • Soit copier un fichier dĂ©jĂ  configurĂ© provenant d’un ordinateur distant, oĂą adresseIP est l’adresse du Raspberry
    scp -r MagicMirror/config/config.js pi@adresseIP:/home/pi/MagicMirror/config

    avec les modules qui seront ajoutés dans /home/pi/MagicMirror/modules/ avec la syntaxe :

    git clone https://github.com/user/NomduProjet.git

Pour avoir un affichage des informations au format portrait sur l’Ă©cran, il faut faire pivoter l’Ă©cran et Ă©galement cachĂ© le « cube de couleur arc-en-ciel » (Rainbow colored cube)

sudo nano /boot/config.txt

et ajouter les lignes suivantes

display_rotate=3
avoid_warnings=1

4. Automatiser le lancement

  • Installer PM2 utilisant NPM
sudo npm install -g pm2
  • Lancer PM2 au dĂ©marrage
pm2 startup

PM2 montrera une commande qu’il est nĂ©cessaire d’exĂ©cuter

sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u pi --hp /home/pi
  • CrĂ©er un script de dĂ©marrage :

Retourner sur la racine oĂą se trouve le projet,

cd ~

ou

cd /home/pi

puis

sudo nano mm.sh

et ajouter les lignes suivantes

cd ~/MagicMirror
DISPLAY=:0 npm start

et rendre le script exécutable

chmod +x mm.sh
  • DĂ©marrer le MagicMirror avec PM2
pm2 start mm.sh
  • Activer le redĂ©marrage du script
pm2 save

L’écran devrait afficher votre MagicMirror !

  • DĂ©sactiver l’écran de veille depuis
sudo nano /home/pi/.config/lxsession/LXDE/autostart

et commenter la ligne suivante

#@xscreensaver -no-splash

Puis Ă©diter le gestionnaire de session graphique

sudo nano /etc/lightdm/lightdm.conf

en ajoutant la ligne suivante

xserver-command=X -s 0 -dpms

Enfin redémarrer

sudo reboot

5. Ajout de modules

Une liste est disponible : https://github.com/MichMich/MagicMirror/wiki/MagicMirror²-Modules

L’installation et la configuration sont spĂ©cifiĂ©es dans chacun d’eux. Les modules sont installĂ©s dans le dossier …/MagicMirror/modules/

EDIT du 16 mars 2017 : En ajoutant quelques modules supplĂ©mentaires, j’obtiens le rĂ©sultat suivant :

6. Mettre à jour MagicMirror 2 et les modules

Maintenant que vous pouvez accĂ©der Ă  votre miroir via SSH, vous pouvez le maintenir facilement Ă  jour. Lorsqu’il y en a une de disponible, que ce soit pour MagicMirror 2 ou pour un module, une notification apparaitra en haut :

! MagicMirror 2 update available

The current installation is XXX commits behind on the master branch.

Pour mettre à jour MagicMirror 2, il suffira de taper la commande depuis le dossier MagicMirror

cd ~/MagicMirror
git pull && npm install

Pour ce qui est des modules, vous devez vous placer dans le dossier Modules

cd ~/MagicMirror/modules
git pull

Si vous tentez de mettre à jour un module dont vous avez modifié le code original, vous aurez le message suivant

error: Your local changes to the following files would be overwritten by merge:
xxxxxxxxx
Please, commit your changes or stash them before you can merge.
Aborting

Ainsi , vous devez forcer la mise Ă  jour

git checkout HEAD file/to/overwrite
git pull

Un wiki est disponible sur Github : https://github.com/MichMich/MagicMirror/wiki/Jessie-Lite-Installation-Guide

Passons maintenant Ă  l’installation matĂ©rielle avec la crĂ©ation du cadre.

13 comments on “Construire un miroir magique avec un Raspberry Pi – Partie 1”

  1. Chery junior miguel dit :

    Bonjour le projet m’intĂ©resse mais j’ai un blocage avec le miroir sans tain, j’ai aucune idĂ©e c’est quoi es que c’est un filme qu »on achète pouvez-me donne un lien pour l’acheter merci beaucoup

    1. Célian Missud dit :

      Bonjour !

      J’ai pris un modèle Two-way acrylic disponible ici : https://smartmirrors.ca

      Il suffit ensuite de le coller par dessus l’Ă©cran.

  2. Mad dit :

    Bonjour,
    je trouve votre MagicMirroir juste génial, bravo.
    Moi j’ai rĂ©ussi a l’installer, mais je bloque sur « rajouter un module » dès que je suis les tutos le magicMirror ne fonctionne plus.
    j ai juste l’heure en haut Ă  gauche Ă  droite la mĂ©tĂ©o
    en bas au centre les compliments et en bas un flux rss du journal le monde.
    Pourrais-tu me mettre sur le chemin ?
    En vous remerciant d’avance.

    1. Célian Missud dit :

      Bonjour Mad,
      Quand vous ajoutez un module dans le dossier /MagicMirror/modules/ , vous devez renseigner le fichier config.js présent dans le dossier config
      Avez vous une erreur lors de l’ajout d’un module ? Si le miroir n’affiche plus rien, c’est qu’il y a une erreur de syntaxe ou de paramètre dans config.js

  3. Mad dit :

    Bonjour CĂ©lian,
    qu’est ce que vous voulez dire par renseigner le fichier config.js ? j’integre bien le code du nouveau module dans ce fameux fichier config ….mais Ă  chaque fois que je rajoute un module le magicmirror affiche Ă©cran noir avec erreur, plus aucun des autres modules ne fonctionne ! je pense que j’ai un soucis d’emplacement de module (buttom left…)

    1. Célian Missud dit :

      C’est souvent un problème de syntaxe (oubli d’accolades ou valeurs erronĂ©es). Vous pouvez m’envoyer votre fichier pour que je jette un oeil

      1. Mad dit :

        Bonjour Célian, est que vous préférez que je vous envoie le fichier par mail ? voici mon mail midoulaila@hotmail.com
        Merci d’avance.

        1. Célian Missud dit :

          Je vous ai répondu par courriel.

  4. Groops dit :

    Bonjour,
    Je me fais actuellement un MagicMirror, cependant je voulais savoir comment faire pour le traffic maintenant que l’API google est payante.
    Comment procédez-vous?
    D’autre part, pour le calendrier google j’ai un soucis sur les dates avant 1970, avez vous rencontrer ce soucis?

    Merci d’avance pour vos rĂ©ponse

    1. Célian dit :

      Bonjour,
      Effectivement, depuis que l’API est devenu payante, le nombre de requête par jour selon les services utilisés est limité.
      J’ai eu un problème d’affichage sur les temps de distance : un affichage sur 3 Ă©tait fonctionnel et les 2 autres ne parvenaient pas Ă  calculer le temps de trajet. Le problème s’est rĂ©solu une fois rendu sur la console Google Cloud Plateform qui a permis d’actualiser le projet associĂ© Ă  la clĂ© gĂ©nĂ©rĂ©e « Directions API » (Google Maps) qu’il a fallu crĂ©er pour ce module.
      Pour le calendrier, j’utilise les calendriers Outlook, Office 365 et Facebook pour les évènements. Je ne prends que les 10 prochaines évenements de chaque calendrier, donc pas de souci sur les évenements antérieurs à la date affichée.
      N’hésitez pas si vous avez besoin

  5. 3nkiart dit :

    bonjour,
    quand j’ecris la commande: #@xscreensaver -no-splash

    il me dit que: Le rĂ©pertoire « /home/pi/.config/lxsession/LXDE » n’existe pas

    que dois-je faire svp
    cordialement

    1. Célian dit :

      Il s’agit ici de commenter (en ajoutant # devant la ligne) :

      @xscreensaver -no-splash

      dans le fichier autostart se trouvant dans /home/pi/.config/lxsession/LXDE

      Est ce que c’est bien cela que vous tentez de faire ?

      1. 3nkiart dit :

        oui comme vous m’avez dit cela fonctionne!
        merci beaucoup

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *