Installation du Magic Mirror – Partie 4

Si les précédents articles expliquaient comment installer le logiciel, nous n’avons pas encore vu comment personnaliser notre miroir. Vous avez été nombreux à réagir sur le précédent article (ici) et à me demander d’expliquer comment personnaliser celui-ci. Lors de cet article, je présenterais donc, les différents fichiers de configuration et ainsi que les modifications à apporter pour créer un affichage plus personnalisé et qui répondra à vos attentes. Vous pouvez retrouver la liste complète des modules proposés via le lien suivant : Modules.

Rappel : Cet article fait partie d’une série en plusieurs parties, dont vous trouverez les éléments ci-dessous :

  • Réflexion autour d’un appareil connecté (Allons-y!)
  • Installation du Magic Mirror – Partie 1 (Allons-y!)
  • Installation du Magic Mirror – Partie 2 (Allons-y!)
  • Installation du Magic Mirror – Partie 3 (Allons-y!)
  • Installation du Magic Mirror – Partie 4 (vous y êtes!)
  • Installation du Magic Mirror – Partie 5 (Allons-y!)

Etape 1

Si vous êtes ici, c’est que l’installation de votre Miroir est complète, et que vous avez un écran affichant, par défaut, des informations barbares dans une langue qui n’est pas la vôtre.

Je vais maintenant expliquer quels sont les modules installés par défaut, et comment ils sont affichés à l’écran. Pour se faire, je vais utiliser le fichier de configuration généré par défaut et nommé : config.js.

Mais avant tout, à quoi ressemble-t-il? Voici la réponse :

Etape 2

Maintenant que nous connaissons le fichier de configuration et que nous avons vu l’affichage qui en résultait, je vais maintenant détailler à quoi correspondent tous les éléments présents, tant au niveau des informations globales que des différents modules présents par défaut.

Informations globales

Commençons par le début du fichier (qui ne correspond à aucun élément affiché sur le miroir) :

Description : Il s’agit ici d’informations globales sur l’affichage du miroir. Notamment les plages d’IP qui seront autorisées à se connecter et sur quel port. La langue utilisée (par défaut, de l’anglais), ainsi que le système de mesure utilisé (par défaut, le système métrique). Si vous choisissiez de définir une adresse IP autorisée, vous pourriez afficher le contenu du miroir directement dans votre navigateur; cela peut s’avérer pratique lorsque l’on souhaite réaliser des tests.

Module Alert

Le premier module de la liste est donc le module Alert.

Description : Ce module permet d’afficher les notifications des autres modules sur le mirroir. Vous pouvez retrouver la page github de ce module : ici

Module UpdateNotification

Le module suivant de la liste est donc le module UpdateNotification.

Description : Ce module permet d’afficher les notifications lorsqu’une mise à jour du mirroir est disponible notamment (avec le nombre de commits sur la branche, ainsi que le nom de la branche active). Ce module n’est pas configurable.

Module Clock

Le module suivant de la liste est le module Clock.

Description : Ce module permet d’afficher l’heure ainsi que la date du jour sur le miroir. Nous constatons que, par défaut, ce module doit s’afficher en haut à gauche de l’écran et que les informations sont affichées en temps réel. Vous pouvez retrouver la page github de ce module : ici

Module Calendar

Le module suivant de la liste est le module Calendar.

Description : Ce module permet d’afficher un ou plusieurs calendriers en fonction des paramètres définit par l’utilisateur. Par défaut, les informations affichées sont le nom du calendrier (ici: « US Holidays ») et les éléments présents sur ce calendrier. Nous constatons également que, par défaut, ce module doit s’afficher en haut à gauche de l’écran. De plus, un seul calendrier est affiché ici, avec un symbole associé.

Remarque :
Un élément étant déjà présent en haut à gauche (le module précédent Calendar), celui-ci s’affichera donc juste en dessous.

Module Compliments

Le module suivant de la liste est le module Compliments.

Description : Ce module permet d’afficher un ou plusieurs compliments (en anglais par défaut). Sympathique quand on regarde le miroir, d’avoir un peit mot doux qui réchauffe le coeur. Ce module est paramètrable (en français), mais il faut pour cela définir tous les créneaux de la journée pour lesquels on souhaite avoir une phrase (sinon, le module affichera un joli message « undefined« ).

Module Currentweather

Le module suivant de la liste est le module Currentweather.

Description : Ce module permet d’afficher le temps qu’il fait actuellement à l’endroit définit à l’aide du site suivant : https://openweathermap.org/. Une clé est nécessaire pour que le module soit opérationnel. Pour se faire, il suffit d’avoir un compte sur le site internet et d’insérer la clé fournie gratuitement.

Module Weatherforecast

Le module suivant de la liste est le module Weatherforecast.

Description : Ce module permet d’afficher les prévisions météo sur les prochains jours à l’endroit définit à l’aide du site suivant : https://openweathermap.org/. Tout comme le modulé précédent, une clé est nécessaire pour que le module soit opérationnel. Pour se faire, il suffit d’avoir un compte sur le site internet et d’insérer la clé fournie gratuitement.

Module Newsfeed

Le module suivant de la liste est le module Newsfeed.

Description : Ce module permet d’afficher les différents fluw RSS qui lui sont passés en paramètres pour afficher ceux-ci sur le miroir. Cela permet d’avoir un flux d’information sur celui-ci.

Etape 3

Nous savons maintenant à quoi ressemble le fichier de configuration et quels sont les différents modules par défaut qui composent notre miroir. Dans la suite de l’article, je vais vous présenter comment j’ai modifié les modules par défaut pour afficher plus d’informations pertinentes à mon goût et les éventuels modules que j’ai rajouté.

Remarque : Je ne vais pas détailler ici, l’ensemble des modules qui existent pour cette solution. Je ne détaillerais que ceux sur lesquels j’ai travaillé. Toutefois, mon miroir est encore en test car je suis en train de tester un autre module calendrier qui correspond plus à ma vision. Quand mon miroir sera finalisé, je ne manquerais pas d’écrire un article avec la configuration que j’utilise.

Module Calendar

Voici la configuration que j’ai effectué sur le module Calendar.

On constate ici, que j’ai choisi de dupliquer le module pour qu’il s’affiche deux fois. Une première configuration que j’ai sobrement intitulée « Famille » et qui contient les calendriers de ma compagne et le mien (qui sont partagés via Google). Rien de bien compliqué sur cette configuration, les valeurs par défaut me convenant parfaitement.
La deuxième configuration intutilée « Important« , regroupe plusieurs calendriers de types différents :

  • Le calendrier des vacances scolaires pour la gestion de nos enfants.
  • Un calendrier local que j’ai crée moi-même, qui nous indique la date de sortie des poubelles (un vrai calvaire chez nous en fonction des semaines…).

Remarque : Chaque calendrier de la deuxième configuration ne doit pas afficher plus de cinq éléments.

Module Compliments

Voici la configuration que j’ai effectué sur le module Compliments.

Pour ce module, j’ai choisi de définir certains moments de la journée uniquement, mais comme cela est expliqué sur la page de configuration du module (ici), ce module peut être couplé avec le temps actuel pour faire correspondre ces compliments.

Remarque : Si « anytime » n’est pas définit, il se pourrait que votre miroir affiche Undefined si le moment de la journée n’est pas disponible dans le tableau de configuration. Toutefois, je n’ai pas investigué pour savoir s’il s’agit d’un bug du module, des traductions ou si une mauvaise configuration avait été réalisée de ma part.

Module Currentweather & Weatherforecast

Voici la configuration que j’ai effectué sur les modules Currentweather & Weatherforecast.

Dans ces deux configurations, je n’ai pas changé beaucoup de choses. J’ai simplement définit quelle ville je souhaitais avoir dans mes prévisions météo. J’ai également désactivé le header, car je ne souhaitais pas afficher les informations de celui-ci, les couleurs seront gérées dans le fichier custom.css dont je parlerais dans un autre article.

Module Traffic

Voici la configuration que j’ai effectué sur le module Traffic.

Dans cette configuration, vous pouvez remarquer que j’ai ajouté plusieurs fois le module qui permet de calculer le temps de trajet nécessaire entre deux points. Cela nous permet, de savoir en temps réel, le temps qu’il nous faut pour rejoindre nos travails respectifs et ainsi de prévoir nos déplacements en conséquence. Pour plus d’informations sur ce module, rendez-vous à la page suivante : ici

Remarque : Petite précision, je ne souhaitais pas polluer mon miroir avec ces informations inutiles le week-end ou le soir quand nous n’avons pas besoin de nous déplacer, c’est pour cette raison, que ce module n’est pas affiché tout le temps (comme cela est détaillé dans les configurations).

Module Newsfeed

Voici la configuration que j’ai effectué sur le module Newsfeed.

Dans cette configuration, rien de bien compliqué, j’ai ajouté le flux RSS dont je souhaitais avoir les informations (ici : France24). J’ai toutefois préparé le terrain en cas d’ajout de sources supplémentaires, avec la présence du titre du flux affiché, ainsi que sa date de parution.

Conclusion

Suite à toutes ces présentations, vous trouverez ci-après le fichier complet tel qu’il est actuellement présent dans mon miroir. Notez qu’il ne s’agit pour le moment que d’une première version, et que je suis en train de tester une nouvelle configuration se basant sur d’autres modules, mais je ne manquerais pas de vous tenir informé de l’avancée de celle-ci, et je vous la présenterais une fois terminée.

Suite à cet article, nous avons vu comment paramétrer le fichier de configuration pour obtenir un miroir un peu plus agréable à regarder. Toutefois, ce fichier n’est pas le seul qui peut être utilisé pour modifier l’affichage, en effet, si vous désirez changer les couleurs utilisées par exemple, il faudra pour se faire, modifier le fichier custom.css, mais ces autres modifications feront l’objet d’un autre article.

Lien pour marque-pages : Permaliens.

133 Commentaires

  1. Super ces articles 🙂
    A quand le module de scan santé du visage comme dans le film seven sisters !

    http://s1.lprs1.fr/images/2017/09/19/7270464_whtm-photogramme-01534822-0163894_1000x625.jpg

    • Merci Tristan,

      Ce n’est pas encore aussi poussé mais il existe des modules de reconnaissance faciale qui te permettent d’afficher des informations spécifiques.

      Mais si tu veux le développer et l’intégrer, je suis preneur!

  2. Merci bien pour les détails, et surtout pour ton temps passé à aider les autres.

  3. Bonjour,

    Merci pour votre (vos articles), très clair et suffisamment détaillé pour reproduire chaque étape. C’est une très bonne base pour démarrer son projet. J’attends la suite avec impatience.
    ET cerise sur le gâteau, c’est écrit correctement, pas de faute de grammaire, d’orthographe ou autre chose me faisant saigné des yeux à longueur de journée habituellement, rien que pour ça : merci !

  4. Et bien sûr j’ai réussi à y glisser une faute…. ahhhh
    Donc « saigner » et non pas « saigné »…

    • Merci pour votre commentaire! Cela fait plaisir à lire 🙂

      J’aurais pu corriger la faute d’orthographe avant de valider le commentaire, mais la correction m’a tellement fait rire, que j’ai préféré le laisser tel quel.

  5. 😉
    En tous les cas, je re-confirme, très bon article, je viens tout juste de configurer mon MagicMirror, parfait !
    Merci.

  6. Salut et MERCI !
    Tout marche très bien chez moi j’ai réussi à configurer comme je le veux.
    Par contre est-ce que tu as comme projet d’integre un module de commande vocal ?
    Car je trouve ça dommage que tout tourne en permanence, j’aimer mettre en veille via une commande vocal, ou rajouter des événements au calendrier etc etc…

    • Bonjour, et de rien 🙂

      Effectivement, j’ai pour projet de continuer à l’améliorer avec notamment de la détection faciale avec le module caméra du Raspberry Pi. Pour les commandes vocales, des solutions ont été développé avec Alexa notamment (Google aussi) mais n’étaient pas compatibles en français au moment, où j’ai construit le miroir.

      Je vous tiendrais au courant lors de l’ajout de tout ceci sur mon miroir.

      • Bonjour,

        Par hasard je tombe sur un vidéo qui m’emmène sur une autre et je finis ici.
        Nous sommes début Aout ( je situe pour le sujet Alexa ) et voici mon projet.
        Un miroir connecté, tactile et vocale ( tant qu’a faire )
        Pourquoi ? Car Achat d’un Dot pour tester qui, m’entraina vers l’ensemble des lumières connectées ( Xiaomi ) de prise connectés et ainsi de suite dont l’achat d’une autre echo. Détenteur d’un écran tactile, de quelques framboises, il ne me reste plus qu’a me jeter à l’eau.
        Pourquoi ce laïus ? Car idem en Aout, même sur la base développeur d’Amazon je n’ai pas trouvé Alexa en Français.
        Mais qu’importe, je me doit de me lancer. Mais vous, avez vous fait évoluer le tout ?
        Je suis tombé sur des Mirror magic wth Alexa assez développer sur internet, ajoutant evidemment toutes les fonctionnalité d’Alexa mais aussi des commandes tactiles comme le swith des équipements connectés ON/OFF.

        Cdt

        • Bonjour,

          Je suis très flatté qu’a force de pérégrinations, vous soyez tombés sur mon blog et mes tutos! Effectivement, il n’y a pas beaucoup d’articles rédigés en français sur le sujet.
          Toutefois, j’avoue que lorsque j’ai commencé le projet, Alexa n’était pas encore sortit en France et les seuls exemples que j’avais, se basaient sur Alexa en version Américaine. Pourtant, l’implémentation des modules semblait bien détaillée dans les différents exemples que j’ai trouvé.

          Je n’ai pas encore étudié la faisabilité de cet aspect, mais elle est clairement toujours dans un coin de ma tête. L’idée que j’ai serait la suivante :
          – Activer la reconnaissance vocale (soit via OK Google, soit par Alexa (mon choix n’est pas définitif)
          – Activer le tactile sur la trame du miroir, via des extensions USB (j’ai déjà vu ce type de matériel en vente sur Internet pour un prix totalement dérisoire)
          – Ajouter des enceintes pour diffuser la musique via Google Music ou autre
          -…

          Du boulot en perspective, mais pour le moment, je le laisse vivre sa vie tranquillement et laisse aussi la famille s’habituer à son utilisation.

  7. Bonjour,

    Merci pour l’article qui est très clair !

    j’ai par contre un petit soucis mon mirroir fonctionnait pendant un bon moment puis un jour j’ai eu un écran noir, je redémarre la bête et au lieu du logiciel MagicMirror la framboise me demande d’entrer mon mot de passe pi, je me connecte via ssh pour essayer différentes manip mais rien à faire j’ai toujours cette demande de mot de passe…
    y a t’il un moyen de lui dire de démarrer sur le mirroir sans passer par mon mdp ?

    • Bonjour,

      Il se pourrait que le mot de passe associé à l’utilisateur pi soit désactivé (je n’en connais pas la raison malheureusement, une durée limitée à un certain nombre de jours comme cela est le càs dans plusieurs OS). Essayez donc, de changer le mot de passe et de vérifier si le lancement automatique du logiciel se fait toujours…

      Un autre hypothèse serait que le lancement de la session X soit bloqué… A investiguer.

      • Bonjour,

        merci pour avoir pris le temps de me répondre 🙂
        en fait je crois que le problème est plus profond… en fait après avoir essayé de mettre mon raspberry à jour; j’ai des messages (que je n’avais pas vu plus tôt) me disant que ma micro sd est pleine, c’est une SD de 16gb et je ne sais pas avec quoi, elle s’est remplie alors qu’il n’y a que Raspian & MagicMirror… peut-etre des fichier log qui se sont créé en boucle :/
        impossible de redémarrer la bête même après avoir décroché le mirroir et y brancher un clavier.

  8. Bonjour,

    Merci pour votre aide mais le soucis venait de ma micro SD qui était pleine à cause d’un fichier log de + de 7GB dans /home/pi/.pm2/logs/mm-error-0.log …
    après l’avoir effacé tout fonctionne à nouveau, me reste plus qu’à voir pourquoi et comment empêcher que cela n’arrive à nouveau.

    Merci.

  9. Bonjour,

    C’est juste parfait !
    Félicitations, je n’ai jamais suivi un tutoriel aussi simple détaillé et compréhensible !
    Il y a tant de chose à faire encore avec ce miroir et tous les modules disponibles !

    Juste une petite question qui va peut être te paraître bête, comment récupérer l’URL de son Calendar ? Google ou Outlook peu importe.

    Merci de ta réponse et bonne continuation !

    PS : Direct je m’abonne !

    • Bonjour,

      Merci, un tel engouement fait plaisir à lire! Je vais donc, essayer de publier un peu plus fréquement alors 🙂

      Pour répondre à tes questions, une simple recherche sur le site de Microsoft peut répondre à ta question : ici

      Pour Google, la solution est : ici

  10. Super tuto/article je me lance 😉

    une petite photo du rendu final avec le css ?

    +++

  11. Bonjour

    Tout nouveau sur linux et sur Raspberry j’ai suivi pas à pas ton super tuto et recommencer quatres fois mais je ne parvient pas rentrer dans le config.js il me dit commande introuvable donc impossible pour moi de configurer mes modules… y’a t’il une erreur que j’aurais pu faire?

  12. Bonjour

    alors j’ai trouver la commande complete pour y acceder,j’ai repris toutes tes modifs avec mes url et maintenant il me demande creer un fichier de configuration…
    (grand moment de solitude)

  13. Bonjour un grand merci pour ce tuto complet,
    j’ai juste une petite question la meteo ne s affiche pas

  14. je vient de faire une analyse avec eslint qui me dit:

    56:25 error Parsing error: Unexpected token config
    x 1 problem (1 error, 0 Warnings)

    • Bonjour,

      Dans ton fichier de configuration, il semblerait simplement qu’il y ait une ou plusieurs erreurs de syntaxe dans ton fichier. Vérifie bien tes parenthèses et autres virgules, etc…

      La diable est dans les détails 🙂

  15. merci
    saloperie de demon 😉

  16. super ça marche (une virgule était partie en ballade)
    parcontre l’agenda google reste bloquer sur chargement …est ce de ma faute ? sachant que j’ai mit le lien ical privé
    désolé je debute tout juste

    • Bonjour,

      Ravi que tu aies pu résoudre une partie de ton problème. Pour le calendar Google, il te faut sélectionner l’URL publique dans les paramètres, et cela devrait rentrer dans l’ordre normalement.

      Bon courage à toi.

      • Bonjour,

        Comme beaucoup de personne ici je rencontre le Pb pour l’affichage du calendrier.

        j’ai actuellement la config suivante, et sur l’appli, le calendrier reste bloqué en loading.

        Saurais tu d’ou cela pourrait venir ?
        Merci d’avance pour ton aide et pour ce Tuto!

         {
        module: « calendar »,
        header: « Calendrier »,
        position: « top_left »,
        config:{
        maximumEntries: 5,
        calendars: [
        {
        symbol: « calendar-check-o « ,
        url: « webcal: https://calendar.google.com/calendar/ical/fr.french%23holiday%40group.v.calendar.google.com/public/basic.ics //https://calendar.google.com/calendar/embed?src=fr.french%23holiday%40group.v.calendar.google.com&ctz=Europe%2FParis »,
        }
        ]
        }
        },

        • Bonjour,

          Effectivement, j’ai rencontré des problèmes également lors de la configuration du calendrier. Mais il me semble que la configuration que tu as faite avec le calendrier Google n’est pas bonne. Il ne ne te faut pas être en webcal.

          Regarde bien l’exemple que j’avais positionné :

          calendars: [
          {
          symbol: "male",
          url: "https://calendar.google.com/calendar/ical/.../basic.ics"
          },
          {
          symbol: "female",
          url: "https://calendar.google.com/calendar/ical/.../basic.ics"
          }
          ]

  17. Franchement Emmanuel c’est une tuerie, tu gères !!!
    un grand merci pour ton tuto et ta patiente.

  18. Bonjour,
    Deja je te remercie pour ce tuto, j’ai pu créer ce mirroir sans problème.
    TOP TOP, j’ai juste une question.
    J’ai remarqué que mon calendrier ne se met pas à jour.
    Comment y remédier?

    • Bonjour,

      J’ai déjà été confronté à ce problème lors de mes différents tests. J’avoue à ce jour, ne pas avoir trouvé la bonne solution pour permettre au calendrier de forçer la mise à jour plus régulièrement (sûrement un paramètre dans le code même du calendrier). Toutefois, quand je remarquais cet « incident », je supprimais la configuration, redémarrais le processus et généralement, cela fonctionnait.

      Attention toutefois, parfois, on a l’impression que le calendrier ne se met pas à jour, mais il suffit juste de patienter quelques minutes et la mise à jour s’effectue.

  19. Bonjour,

    Super tuto, complet, bravo.

    Openweathermap ne connais pas les villes algerienne.

    Je bloque sur le module météo Darksky, j’ai bien un api mais rien n’y fait. quand je le rentre dans config.js, le magicmirror ne démarre plus et me demande de corriger la config.

    je suis débutant.

    • Bonjour,

      Merci pour ton commentaire. Effectivement, Openweathermap ne connaît pas toutes les villes d’Algérie, mais il en reconnaît au moins certaines (par exemple : Timimoun (ici)).

      Je ne connais pas le module météo Darksky, mais à l’occasion, j’essaierai d’y jeter un oeil!

      Bon courage à toi.

  20. salut !

    Au top ! j’arrive a faire a peu près ce que je veux de mon coté, mais dans le module compliment les accents ne passent pas (France / FR/ UTF8 ); j’ai mis la police verdana pour voir mais ca ne viens pas de là, partout ailleurs ( calendar et newsfeed) les accents passent.

    Une piste ?
    et encore merci

  21. Mercier Guillaume

    Salut, je vais me lancer dans le projet mais j’aimerai lui integrer le fameux Jarvis pour les commandes vocales, as-tu dejà trouvé des mecs qui on reussi à interger les deux, on me conseille Jasper mais il est en anglais, as-tu quelques infos sur l’intergration des deux ?

    En te remerciant,

    Je suis preneur de tout, liens, video, etc

    En tout les cas super tuto ! Joli travail

    • Bonjour,

      Merci pour le compliment.

      Concernant l’intégration de Jarvis, quand j’ai construit le mien, je n’ai pas réfléchis à ça je t’avoue. Toutefois, il existait déjà des choses faites avec Alexa (avec du coup, des instructions en anglais). Il faut voir ce que propose cette option, maintenant, que la solution est sortie en France.

      Je te donne les liens que j’ai retrouvé rapidement : Tutoriel, Vidéo

      Ces deux expliquent comment ils ont intégré Alexa à leur solution.

      Modules : Celui-là répertorie tous les modules présents pour le Magic Mirror (une simple recherche Alexa te permettra de trouver les instructions d’installation).

      @+

  22. bonjour comment on configure l’api de google pour les trajets car c’est la dernière chose qu’il me reste a faire mais toujours des erreurs
    merci

  23. Bonjour,

    Bravo pour ton tuto !!
    Je suis un grand néophyte du raspberry et le MagicMirror2 est un super projet qui permet de se jeter direct dans l’arène !
    Ton tuto est un des rares tuto francophone qui dispense d’un tas d’info utiles !
    Je vais dans un premier temps reprendre tes explications et affiner mon projet…
    Merci encore !
    Néanmoins je galère pour la syntaxe de saisie pour les fichiers de config (dans l’usage des {, [, des virgules, des ;, des parenthèses etc…pfffiou ) Quant aux itérations…au secours j’ai encore pas tout capté de leurs subtilités…
    🙂

  24. Bonjour, je ne comprends pas ! Je demande MagicMirror avec la commande pm2 start MagicMirror et rien ne se passe help me pls.

  25. J’ai un message d’erreur lors de l’installation de Magic Mirror qui m’amène à me demander si la Raspbian Stretch est compatible ?

  26. Pourriez vous m’aider ? Je bute sur l’obtention de l’api Google Maps. Un vrai calvaire? Est ce gratuit?

    • Bonsoir,

      Effectivement, l’obtention d’une clé Google Maps est devenu quelque chose d’un peu compliqué depuis que Google a revu sa politique d’obtention de clé. J’avoue que la mienne est toujours valide car je fais très peu d’appels dessus. Sur ce sujet, je vous invite à vous renseigner sur le site suivant : Maps

      Normalement en suivant les étapes, vous devriez en avoir une sans trop de problèmes.

      Bon courage!

  27. Bonjour,
    j’ai trouvé ton tuto très bien expliqué pour un néophyte comme moi, j’ai cependant une question:
    j’essaie de paramétrer mon module météo comme tu la expliquer mais mon miroir affiche encore et toujours la météo de new york malgres la cle API du site méteo. J’essayerai de copie la partie de mon code dans les commentaires pour voir si je n’est pas oublier quelque chose ^^.
    encore bravo pour ton tuto

    • Bonjour,

      As-tu également saisi le nom de la ville, ainsi que son ID ? La clé en elle-même ne suffit pas si mes souvenirs sont bons, elle permet uniquement d’utiliser l’API d’openweather.

      A bientôt,

  28. salut tout le monde,

    je suis toujours l’activite du forum dans l’attente d’un tuto pour regler la taille de police des modules.
    je ne sais pas comment réduire celle dans custom.css ou directement dans le module concerné.

  29. Bonjour,
    Mon MagicMirror fonctionne parfaitement depuis 1 an environ. Mais j’ai un souci lors des coupures de courant, l’affichage est chaotique et je suis obligé de faire un « sudo reboot ». As-tu une solution pour y remédier?
    Merci

    • Bonjour,

      Quels sont les artefacts qui se produisent suite à ces coupures de courant ? A moins que ton système soit installé sur un onduleur qui permettrait au raspberry de ne pas subir de coupure, je ne vois pas comment le système pourrait éviter l’arrêt-redémarrage…

      A moins qu’il s’agisse de micro-coupures ou de baisse de tension qui peuvent entraîner ces effets.

  30. Bonjour, est il encore possible d’obtenir une cléé api google drive gratuitement ? moi je n’ y arrive pas .

    • Bonjour,

      La question m’avait déjà été posée par le passé, et effectivement, avec la nouvelle politique Google, il est devenu plus compliqué d’obtenir une clé, mais je vous invite à accéder au lien suivant : Maps. Normalement, vous devriez arriver à en obtenir une sans débourser un centime.

    • Salut dede,

      Je viens d’en obtenir une. C’est complique, mais tu en recois 4 au final

  31. Bonsoir à tous,
    J’ai un petit soucis au niveau du calendrier qui systématiquement me place les rendez vous le lendemain.
    Je m’explique l’anniversaire d’un copain le 24 octobre et qui s’affiche le 25 sur le miroir alors que dans le calendrier gmail il est bien au 24. Et c’est la même chose avec tous mes rendez vous…

    une idée???

    je sèche

  32. Bonjour, j’ai exactement le même problème avec le calendrier… les dates fixes style Noël sont toutes décalées d’un jour.

    • Bonjour,

      Mon calendrier a également fait des siennes ce week-end. Est-ce lié au changement d’heure ? Je ne saurais dire! Toutefois, j’essaierai de jeter un oeil d’ici cette semaine pour voir de quoi il en retourne.

  33. Bonjour,
    Merci pour tout ce travail et le partage!
    Pouvez vous me détaillez un peu la manière de procéder afin d’accéder au magic mirror par le navigateur s’il vous plait?
    Je ne comprends pas comment configurer le fichier config pour y parvenir.
    Merci pour votre aide

    • Bonjour,

      Comme expliqué dans le paragraphe Informations Générales, il faut éditer le tableau situé en début de fichier :

      ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses.

      Il faut simplement ajouter l’adresse IP de ton ordinateur dans la liste ci-dessus et relancer le magic mirror. Tu devrais ensuite pouvoir accéder à l’affichage sur ton navigateur.

  34. Bonjour,
    j’ai un souci dans l’ajout de modules (coinmarketcap) j’ai tout installé comme il faut, mon souci est quand je copie-colle les infos du module dans mon fichier config.js je dois faire une erreur dans l’alignement des lignes car après il m’est impossible de relancer magic mirror, je ne trouve pas ac quoi ouvrir ce fichier pour me permettre de repérer d’éventuelles erreurs.
    merci!!

    • Bonjour,

      A part copier le contenu de ton code ici pour que je puisse jeter un oeil éventuellement, je ne peux pas t’aider… Si MagicMirror ne se lance pas, s’est qu’alors tu as effectivement une erreur dans ton fichier de configuration qui est mal parsé.
      Une remarque intéressante à savoir, il s’avère parfois que certaines pages de configuration soient mal renseignées; j’en ai déjà fait les frais, donc n’hésite pas à jeter un oeil sur tout ça.

  35. Bonsoir,
    Bravo pour ce tuto très bien écrit et très clair. Je viens de terminer mon miroir magique en suivant vos conseils. Je rencontre néanmoins une petit difficulté, je n’arrive pas à faire afficher la météo et les prévisions. A la place de Toulouse j’ai mis Lyon mais ça ne fonctionne pas. Avez-vous une idée ? Merci d’avance

  36. Excusez moi mais j’ai une autre question. Pouvez-vous me fournir l’adresse complète du calendrier des congés des enfants. Sur le site gouvernementale je n’ai pas trouvé le lien. Merci et bonne soirée

  37. Salut !
    Sais tu comment modifier la taille de police ? Si cela est possible bien sur, car sur mon écran c’est afficher en gros et je trouve ça immonde !
    Ps; merci pour ce tuto 😉

  38. Bonjour,
    Peu-ton utiliser une dalle tactile pour interagir avec le magic miror ?
    Je souhaiterai par exemple ajouter des boutons pour commander l’ouverture de mon portail, visualiser une caméra directement sur l’écran du magic miror (mais sans mettre de miroir par contre genre)

    merci

    • BOnjour,

      Je n’ai jamais regardé cette option, mais je pense que cela doit être faisable, moyennant un peu de bricole par-ci par-là. Pourquoi ne pas utiliser le contrôle vocal Alexa par exemple ? De même, il existe des modules qui permettent une compatibilité avec Google Home.

  39. Salut depuis la dernière mise a jour j’ai ce message apres avoir lancé la commande npm start :
    > sh run-start.sh

    run-start.sh: 4: run-start.sh: electron: not found

    npm ERR! Linux 4.14.79-v7+
    npm ERR! argv « /usr/local/bin/node » « /usr/local/bin/npm » « start »
    npm ERR! node v4.2.2
    npm ERR! npm v2.14.7
    npm ERR! file sh
    npm ERR! code ELIFECYCLE
    npm ERR! errno ENOENT
    npm ERR! syscall spawn
    npm ERR! magicmirror@2.6.0 start: sh run-start.sh
    npm ERR! spawn ENOENT
    npm ERR!
    npm ERR! Failed at the magicmirror@2.6.0 start script ‘sh run-start.sh’.
    npm ERR! This is most likely a problem with the magicmirror package,
    npm ERR! not with npm itself.
    npm ERR! Tell the author that this fails on your system:
    npm ERR! sh run-start.sh
    npm ERR! You can get their info via:
    npm ERR! npm owner ls magicmirror
    npm ERR! There is likely additional logging output above.

    npm ERR! Please include the following file with any support request:
    npm ERR! /home/pi/MagicMirror/npm-debug.log

    et je n’arrive plus a redemarrer mon Magic Mirror … je ne comprend pas bien ce qui se passe. Merci pour vos lumières.

  40. Bonjour, merci pour tes dossiers très clairs et complet (et en français, je galerais pour la config des modules en anglais).
    As-tu testé d’autres modules depuis 1 an? Comme par exemple ceux musicaux?

    • Bonjour,

      Pas vraiment un module musicale mais j’utilise MMM-screancast qui permet d’envoyer les vidéos YouTube comme avec un Chromecast.
      La taille est réglable, le module n’apparaît que lorsque l’on diffusé dessus et du coup lors de la lecture il recouvre les autres modules ( en fonction de la taille et de l’emplacement).

  41. Bonjour,

    Super tuto mais j’ai deux petits soucis:

    Calandar ne m’affiche qu’une seule ligne à venir malgré les redémarrages et la ligne maximumEntries, j’ai beau fouiller je ne trouve pas la solution.

    Mon deuxième problème est sur le module weather forecast,la première ligne m’affiche les prévisions du jour même et comme j’ai déjà le module current weather au dessus cette première ligne ne m’intéresse pas et je ne trouve pas comment la supprimer.

    Merci.

  42. Petite question : qd j’essaie de mettre à jour le magicmirror en tapant la commande git pull il me met un message d’erreur…

    y a t’il une autre solution ?

    Vais je perdre toute ma configuration en le mettant à jour? (calendrier, liste des choses à faire, météo…)

    Merci Merci

    • Bonsoir,

      Normalement, il doit te prévenir que certains fichiers ont été modifiés (notamment, le config.js) mais tu ne devrais pas perdre ta configuration.

      Bonne soirée.

      • Le soucis est surtout qu’il ne veut pas faire la mise à jour et ne me propose pas de forcer la fusion, voici le message d’erreur :

        pi@pi:~/MagicMirror $ git pull
        Mise à jour 6db61b4..de57daa
        error: Vos modifications locales aux fichiers suivants seraient écrasées par la fusion :
        config/config.js.sample
        modules/default/calendar/calendar.js
        modules/default/weatherforecast/weatherforecast.js
        package-lock.json
        vendor/package-lock.json
        Veuillez valider ou remiser vos modifications avant la fusion.
        Abandon
        pi@pi:~/MagicMirror $

        PS : Pr info je passe en ssh via le terminal de mon mac, je pense pas que ces puisse changer qqchose mais je préfère vous le signaler.

        Merci beaucoup

      • en fait j’ai trouvé!

        Si vous avez le même problème que moi lors de la màj il suffit d’exécuter la ligne suivante :

        git reset –hard HEAD

        puis de relancer la màj avec git pull

        voila voila j’espère avoir pu aider…

        Bon week end à tous!

        • salut j’ai le même probleme et quand je lance cette commande j’ai : fatal: ni ceci ni aucun de ses répertoires parents n’est un dépôt git :.git
          au secours stp
          merci d’avance

          • Bonjour,

            Quand tu lances la mise à jour du répertoire, positionne-toi dans le bon répertoire du git….

          • Salut Manu, là je suis largué ! Quand je lance la maj , je suis sur en ssh sur MagicMirror, c’est pas bon?

          • Si, mais si tu veux que je t’aide, il me faut les extraits des commandes que tu passes et les extraits des logs que tu as.

          • ok je te fais passer ce que je fais, merci encore
            pi@raspberrypi:~ $ cd $HOME/MagicMirror
            pi@raspberrypi:~/MagicMirror $ git pull
            Mise à jour de57daa..b508a62
            error: Vos modifications locales aux fichiers suivants seraient écrasées par la fusion :
            modules/default/calendar/calendar.js
            package-lock.json
            vendor/package-lock.json
            Veuillez valider ou remiser vos modifications avant la fusion.
            Abandon

  43. Bonjour,

    Merci beaucoup pour ce tuto vraiment bien fait.

    J’ai mise en place mon miroir connecté depuis quelque temps sur un écran provisoire, tout fonctionnait à merveille.

    Je viens de passer sur son écran définitif qui semble avoir une résolution inférieur, du coup je me retrouve avec mes modules les un sur les autres, et je ne couvre pas toutes la surface de mon écran.

    Une idée de comment régler ce type de problème ?

    Merci encore pour ce tuto très bien détaillé et complet.

    Bonne soirée à tous.

  44. Bonjour.
    Une fois de plus, merci pour ce tuto sur lequel je me suis largement appuyé pour mon miroir.
    Avant de passer à la phase « menuiserie », il me reste un point à solutionner :
    j’aimerai que le miroir bascule en veille en mon d’absence.
    La solution la plus répandue est la détecteur infrarouge couplé à un module (exemple: https://github.com/paviro/MMM-PIR-Sensor )
    Mes connaissances en électronique étant ce qu’elles sont, j’hésite à me lancer.

    Avez-vous abordé ce problème ? Une autre piste ?

    D’avance merci.

    • Bonjour,

      Ravi que le tutoriel vous ai plus. Pour ma part, j’utilise simplement une crontab qui allume et éteint l’écran à certaines heures du jour et de la nuit. Par exemple, allumé de 7h à 9h le matin, et le soir de 19h à 00h (qui sont généralement les heures de présences en semaine).

      J’ai pensé au module de détection avec la caméra, mais je ne l’ai pas monté encore.

  45. salut j’ai des menus soucis avec mon module météo,( Weather Forecast) : celui de base.
    je souhaite afficher la pluviométrie à venir et ça veut pas 🙁 j’ai bien changé le paramètre ShowRainAmount en true

    et au lieu d’avoir ma temp max et ma temps min, j’ai juste ma temps max et l’intervalle de tolérance du jour

  46. bonjour merci pour ce tuto mais j’ai un probleme avec config.js
    j’ai commande inrtrouvable.

    • Bonjour,

      Quelle est la commande lancée ?

      • J’ai du faire une erreur quelque part mais j’ai tout recommencer et ça marche.
        mais nouveau probleme, j’ai modifier quelques module mais il me ditde creer un fichier config ou si jai une erreur d’utiliser un javaScript linter.
        quoi faire s’il te plait ?

        • Bon, j’ai eussi a recuperer mais maintenant la météo ne s’affiche plus. La j’ai tout essayer mais je suis bloqué.

          • Bonjour,

            Merci d’expliquer plus en détail ton problème (copie d’écran, configuration effectuée, fichiers de logs, etc..). En l’état, ta question revient à me dire : Mon miroir marche pas, aide moi… Il me faut des détails, causes éventuelles et des points de comparaison, si ce n’est pas le càs, alors je ne pourrais pas t’aider.

            Bon courage,

        • Bonjour,

          Pour activer le miroir, il faut créer le nouveau fichier de configuration avec l’appel des modules addaptés. Cela n’est pas effectué par défaut avec lors de l’installation. Si l’écran d’erreur apparaît malgré tout, c’est qu’il y a une erreur de syntaxe dans le fichier en question.

          Bon courage.

  47. Bonjour et bravo pour ce tuto bien vulgarisé, j’ai installé MM il y a deux ans il a fonctionné sans problème, j’y ai ajouté des modules tels que Spotify, résultats de foot etc. et depuis quelques jours j’ai des gros soucis l’écran se fige enfin bref j’ai décidé de refaire l’installation complète, j’ai commandé un nouveau Raspberry PI3+, je recyclerai l’ancien PI3 avec un autre projet… donc cherchant un site pour refaire une instal complète je suis tombé sur le votre et pour le coup bravo, j’ai juste une question bête mais qui me taraude dans votre tuto à chaque fois que vous modifiez un fichier vous parlez d’un enregistrement en utilisant « :wq!. » quand je fais une modification je fais « ctrl+X » et « ctrl+O » pour enregistrer, je ne connais pas du tout votre méthode (je suis néophyte et je cherche à comprendre)
    en tout cas encore une fois BRAVO

    • Bonjour,

      Merci pour votre commentaire qui me va droit au coeur 🙂
      Il faut savoir que j’ai également eu des problèmes récemment avec mon Raspberry Pi. En effet, je ne pouvais plus mettre à jour les fichiers de configuration; l’intégralité de la carte SD restait en lecture seule : J’ai changé la carte SD (qui s’est avérée être morte) et depuis, je n’ai plus de problèmes!

      Pour les commandes que j’utilise, ce sont des vieux réflexes « Unixiens » car sur les vieilles machines que j’utilisais, l’éditeur de texte « vi » et non « vim » comme sur les derniers OS, tout fonctionnait en ligne de commande et sans raccourcis clavier.

      Merci pour votre retour,

  48. Merci pour votre réponse rapide… je me coucherai moins bête ce soir 🙂 je vais donc refaire une installation complète avec votre excellent tuto ce WE, j’en profite j’avais mis en place un redémarrage toute les heures avec crontab mais je ne me souviens plus de la ligne que j’avais ajouter est-ce que si je fait  » ***** root reboot » ça fonctionne d’après vous?
    Merci d’avance

    • Bonjour,

      Pour rebooter via la crontab, utilise cette commande avec l’utilisateur « pi » :
      30 7 * * * 1-7 sudo reboot

      Dans l’exemple que je te donne, tu rebootes tous les jours à 7h30.

  49. re
    si je fais :
    0 * * * * sudo reboot

    il reboot toutes les heures? t’en penses quoi?

    • Oula non malheureux!
      Si tu écris cette commande, il va rebooter toutes les minutes! Et la, bonjour la difficulté pour toi d’y accéder!

      Je te renvoi vers la définition de cron et son implémentation : ici et si tu veux redémarrer toutes les heures, utilise plutôt cette commande :

      * 0 * * * sudo reboot

      Mais, ça ne présente aucun intérêt de redémarrer ton Raspberry aussi souvent. Personnellement, le mien ne redémarre jamais ou quasiment jamais… Les seuls arrêts qui sont faits, c’est quand je mets à jour certains modules, pour m’assurer que tout va bien en cas d’un éventuel redémarrage.

      Bonne soirée.

      • Merci pour ton expertise…. ça m’a évité une belle C….rie en fait j’avais mis en route un démarrage toute les heures car j’avais certains modules qui plantaient … pour le coup Raspberry tout neuf,micro sd toute neuve et installation toute neuve (la tienne) j’espère que je n’aurais plus besoin de ça ,encore merci pour le temps consacré, je te tiens au courant de l’avancement.
        Bonne soirée et bonne nuit
        Manu

  50. Bonsoir je viens de regarder ton lien , et j’ai un doute en fait quand je regarde le tableau je suis dubitatif sur le redémarrage toutes les heures , même si j’ai bien entendu ton conseil (que je vais suivre) mais pour le redémarrage toute les heures j’ai l’impression que je n’avais pas faux? Non

    Raccourcis Description Équivalent
    @reboot Au démarrage Aucun
    @yearly Tous les ans 0 0 1 1 *
    @annually Tous les ans 0 0 1 1 *
    @monthly Tous les mois 0 0 1 * *
    @weekly Toutes les semaines 0 0 * * 0
    @daily Tous les jours 0 0 * * *
    @midnight Toutes les nuits 0 0 * * *
    @hourly Toutes les heures 0 * * * *
    Merci encore pour ton aide
    Cordialement
    Manu

  51. Merci pour ta réponse je viens de recevoir aujourd’hui le pi et la carte je vais mettre ça en chantier ce week-end, je te tiens informé, merci pour ton aide
    Cordialement
    Manu

  52. bonsoir j’ai reçu et installé la bête, mais j’ai un soucis le MM ne démarre pas automatiquement quand je fais un reboot! une idée, merci pour ton aide je pense avoir fait comme il faut, mais bon…

  53. tu as une idée de pourquoi?

    • Bonjour,

      Oui, c’est tout simple, exécute la commande suivante juste avant :

      pi@raspberrypi:~/MagicMirror $ git reset --hard HEAD
      pi@raspberrypi:~/MagicMirror $ git pull

      Et le tour est joué 🙂

  54. Bonjour
    Super boulot !! très Bien expliqué et agréable à lire
    J’ai une petite question j’ai paramétré le module compliment
    il affiche correctement la même chose que ton réglage par contre il ne semble pas configuré selon les heures
    Les phrases défilent en boucle donc je peux avoir « bonne soirée » à 14 h
    y a t il un moyen d’y remédier ?
    Merci

  55. Bonjour

    je vous remercie pour le tuto , je me suis lancé dans le projet
    j’ai réussi je pense a créer une clé API sur google, mais je n’arrive pas à faire fonctionner le module
    (rien ne s’affiche à l’écran )
    pouvez vous faire une procédure pour développer cette partie ?

    merci d’avance

    Valentin

    • Bonjour, je suis également en train de progrésser sur le MagicMirror, et ci dessous, les lignes de mon « config.js » pour la météo et les prévisions météo.
      bien sûr il faut modifier la ville et le code API.
      On trouve les villes sur le lien cité dans le module.
      Si ça peut aider, le mien marche bien.

      De mon côté, je cherche à augmenter la taille des chiffres de l’horloge, en vain !
      Aussi des renseignements concernant le module par défaut « alert », comment le faire apparaître et le configurer ?

      @+, Ferbie

      // meteo
      {
      //disabled: true,
      module: « currentweather »,
      header: « La m&eacutet&eacuteo de « ,
      position: « top_right »,
      config:
      {
      location: « trifoully »,
      locationID: « 1234567 », //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
      appid: « a97213565fgbyt535824846512e01e3fe006cdb »,
      //showIndoorTemperature : true,
      //showIndoorHumidity: true
      }
      },

      // prévision météo
      {
      //disabled: true,
      module: « weatherforecast »,
      header: « Pr&eacutevision m&eacutet&eacuteo »,
      position: « top_right »,
      config:
      {
      location: « trifoully »,
      locationID: « 2981492 », //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
      appid: « a972840648qs824qsdf65446512e01e3fe006cdb »,
      maxNumberOfDays: 3,
      fade:false
      }
      },

  56. Bonjour,
    Super tutos à suivre à la lettre ! Mon miroir fonctionne bien. Une question cependant sur le calendrier : avec un calendrier google ou un fichier ICS local, pas de soucis. J’ai un calendrier sur un nas synology ‘calendar’, et là, pas moyen de le synchroniser. L’adresse de ce genre de calendrier (CalDav) est dans le style:https://chezmoi.myds.me:5650/caldav/Agenda/home/. Donc pas de ICS !
    Y a t-il une solution ?
    Encore félicitations et vivement la suite !
    FerBie

  57. Bonjour,
    J’ai déjà commenté ce formidable tuto ! mais j’ai une question parmi d’autres !!! A quoi sert le module par défault : ALERT ? Comment le configurer, affiche t-il les alertes du calendrier par exemple ?
    Merci de votre soutien.

    • Bonjour,

      Merci pour votre retour. Je ne suis plus trop actif sur le miroir en ce moment, car j’ai la tête à d’autres projets (notamment liés à l’impression 3D). Mais pour répondre à votre question, le module ALERT est un module par défaut du miroir qui permet d’avoir les remontées d’alertes des autres modules.

      Plus d’informations sont disponibles ici : ici

  58. Bonjour/Bonsoir
    je viens d’intaller MagicMirror sur Ubuntu, juste pour essayer avant l’acquisition d’un Raspberry Pi. Je cale au niveau de la configuration. Je ne trouve pas le fichier de cinfiguration.
    Votre aide me serait tres utile.Merci.

Laisser un commentaire

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

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.