Hello guys,

This is my first module !
Well I give most of the credit to @sean who created the code as i’m not a dev at all .

What I did is taking MMM-TriggerNotification and MMM-HTMLBox, and merge those 2 modules in one to create mine based on the idea I had.

https://github.com/ejay-ibm/MMM-AI

MMM-AI

MMM-AI is a simple module based on a mix of MMM-NotificationTrigger & MMM-HTMLBOX from eouia that allow to have animation of ‘AI’ kind when the assistant ( Alexa / MMM-Mk2assistant ) is in standby mode ( waiting for user instruction) or talking mode ( when assistant is replying ) triggered by Notification sent by these modules.

Screenshot

    Standby animation                     Talking animation

Full gif here :
https://github.com/ejay-ibm/MMM-AI/blob/master/jarvis-standby2.gif
https://github.com/ejay-ibm/MMM-AI/blob/master/jarvis-talk2.gif

Installation

In the MagicMirror/modules directory run :

git clone https://github.com/ejay-ibm/MMM-AI.git

Configuration Sample

{
      module: "MMM-AI",
      position: "top_center",
      config: {
        width: "300px",
        height: "300px",
        refresh_interval_sec: 0, // you should not refresh, because content will be back to default value.
        content: `<img id="MY_ANIMATION" src="modules/MMM-AI/jarvis-standby2.gif"/>`,
        triggers: [
          {
            trigger: "HOTWORD_RESUME", // HOTWORD_LISTENING if you use MMM-HOTWORD  or HOTWORD_RESUME if you use MMM-AssistantMk2
            fires: [
              {
                fire: "standby_Image",
                payload: payload => {
                  var img = document.getElementById("MY_ANIMATION");
                  img.src = "modules/MMM-AI/jarvis-standby2.gif";
                  return payload;
                }
              }
            ]
          },
		{
            trigger: "ASSISTANT_UNDERSTOOD", // HOTWORD_SLEEPING if you use MMM-HOTWORD  or HOTWORD_PAUSE if you use MMM-AssistantMk2
            fires: [
              {
                fire: "Talk_Image",
                payload: payload => {
                  var img = document.getElementById("MY_ANIMATION");
                  img.src = "modules/MMM-AI/jarvis-talk2.gif";
                  return payload;
                }
              }
            ]
          }
        ]
      }
    },

Additional Info

please make sure you are up to date on the Mk2 assistant module for this module to work as expected
All other configuration sample from https://github.com/eouia/MMM-HTMLBOX & https://github.com/eouia/MMM-NotificationTrigger are applicable to this module.

Thanks again to Sean : https://github.com/eouia/ who have created this code that I have merged for this module purpose.
Animated images are created by me using crazy talk and Photoshop I will work to create additional ones.

If you have any idea on standby/talk animation I can create for this module feel free to propose them !
I’m planning to make an ‘HAL’ one
based on this image :

Ejay

@teitlebot Hey the feature has been implemented,
Sorry i’m crawling under work and forgot to update ( I’ll update my repo in the week . )
You just need to update your Mk2 assisant ( Git Pull from MMM-Assistant folder)
@Sean the developer gently added new notification called ASSISTANT_UNDERSTOOD . Use that one to trigger the talking effect .

That is my config.js sample :

module: "MMM-AI",
      position: "top_center",
      config: {
        width: "300px",
        height: "400px",
        refresh_interval_sec: 0, // you should not refresh, because content will be back to default value.
        content: `<img id="MY_ANIMATION" src="modules/MMM-AI/jarvis-standby2.gif"/>`,
        triggers: [
          {
            trigger: "HOTWORD_RESUME", 
            fires: [
              {
                fire: "standby_Image",
                payload: payload => {
                  var img = document.getElementById("MY_ANIMATION");
                  img.src = "modules/MMM-AI/jarvis-standby2.gif";
                  return payload;
                }
              }
            ]

          },
                   {
            trigger: "HOTWORD_PAUSE",
            fires: [
              {
                fire: "VOLUME_STORE",
                //fire: "VOLUME_MUTE",
                exec: "amixer set Master 10% -q"
              }

            ]

          },
  
        {
            trigger: "ASSISTANT_UNDERSTOOD", 
            fires: [
              {
                fire: "VOLUME_RESTORE",
                payload: payload => {
                  var img = document.getElementById("MY_ANIMATION");
                  img.src = "modules/MMM-AI/jarvis-talk2.gif";
                  return payload;
                }
              }
            ]
          }
        ]
      }
    },

Ejay

Hi,

From the doc here:

https://github.com/MichMich/MagicMirror/wiki/Configuring-the-Raspberry-Pi

Autohiding the Mouse Pointer
Install unclutter:

sudo apt-get install unclutter
You can create an .xinitrc script to run the tool.
See https://wiki.archlinux.org/index.php/Unclutter

But a simpler option is to add a line to the end of the file:

$ nano ~/.config/lxsession/LXDE-pi/autostart
...
@unclutter -display :0 -idle 3 -root -noevents
This will add a 3 second delay, before the pointer disappears from the screen when not using it.

Hope this helps

Ejay

@Sean @teitlebot
Might sound stupid and not feasible at first but this is how I would do the trick.
1st I would use a Notification from input ( camera , pir sensor)
for PIR sensor it would be PRESENCE_DETECTED .
Then I would trigger a command and in this command use the repeat after me function .
So you can get voice output directly from the assistant saying “hello” when presence is detected .
Then for facial recognition it’s just a matter of condition and what notification to send. for each notification a different repat after me.

Does it make sense?

Ejay

@teitlebot Hi would do it from photophop as part of the animation . But their’s maybe a way to do it in javascript but that would need some additional implementation in the modules .

Working with the gif is more flexible in my taste .

Ejay

@bibi Hi,
I would definitely recommend Mk2assistant + Hotword module.
Ejay

@zdenek Very nice looking and result.

As often in mirror showcase, the back is not shown ( yes that’s often the ugly part as well I know :) ) but I think it is interesting to see how all hardware are implemented in the back .

Would you mind to share some pictures of the back ?

Thanks

@F17MC @Cr4z33
I don’t think the issue is with the module but with what the assistant return to the module .

the module is expecting something like “”(open.spotify.com - https://open.spotify.com/artist/2Gkz5N7rWiCE3jlCgsw1yp""

So i’m not getting why your assistant doesn’t understand what to search for.

I’ll continue digging

Ejay

@boblazer
I tried this as well and failed the rendering was not good( at least to my taste )
I would recommend to go for a glass and apply the film on it.
My method:
Clean the glass with a window clearer product and use ( sorry for my english) a dedicated glass cleaner napkin to avoid dust at the maximum.
again to avoid any dust use a vacuum to have your glass 100% clean
Then with a sprayer, put inside some water and a drop of soap.
Spray on your glass and then apply the film starting at the bottom and evacuate the water while you progress developing the film.
you shouldn’t get any air bubble by doing this way .

Note : do not cut the film on edge once it is done leave a few millimeters on each side and let it dry for a couple of days . Once dry you can cut the edge of the film to fit your glass.

Hope it helps .

Ejay

@Sean @teitlebot
Might sound stupid and not feasible at first but this is how I would do the trick.
1st I would use a Notification from input ( camera , pir sensor)
for PIR sensor it would be PRESENCE_DETECTED .
Then I would trigger a command and in this command use the repeat after me function .
So you can get voice output directly from the assistant saying “hello” when presence is detected .
Then for facial recognition it’s just a matter of condition and what notification to send. for each notification a different repat after me.

Does it make sense?

Ejay

@Cr4z33 1st you have a wonderfull miror
2nd , if you send it to me maybe i’ll give you the answer ^^… joking …
I’m not sure what’s wrong .

What I would do first is turn on verbose mode on hotword and Mk2 assistant and check .
1- Console log .
2- pm2 out logs ( see “pm2 show scriptname” )
3- pm2 error logs

Capitalization is very important in hook eg .
hook is like “next song”
when you say this to assistant if assistnat wirte " Next song" that that wikk not work .

All I can say for now is check the logs and share with us , that mitght help to help .

Ejay

Yes could be fun ! I used to had this kind of device to turn on light by clapping.
It was as well turning on the light in the night when I was sneezing hard . lol

@Cr4z33 We have added an option to hide the control

after doing a “git pull” from : ~/MagicMirror/modules/MMM-Spotify/

you can set in your config file

 control: "default", //"default", "hidden" available~

Ejay

@Cr4z33 if you don’t want to use gaction like me .
I’ll share my transcription hook and command i’m using with this module and others.
It works perfectly. with raspotify. raspotify is pretty easy to install and run.

transcriptionHook: {

        HIDE_ALL_MODULES: {
            pattern: "standby mode",
            command: "HIDEMODULES"
          },
          SHOW_ALL_MODULES: {
            pattern: "show modules",
            command: "SHOWMODULES"
          },
          SCREEN_ON: {
            pattern: "turn on screen",
            command: "SCREENON"
          },
          SCREEN_OFF: {
            pattern: "turn off screen",
            command: "SCREENOFF"
          },
          REBOOT: {
            pattern: "reboot the mirror",
            command: "REBOOT"
          },
          SHUTDOWN: {
            pattern: "extinction totale",
            command: "SHUTDOWN"
          },
          STOP_PLAY: {
            pattern: "stop the video", // this is for youtube but it is preferable to have youtubeAutoplay: false, when running spotify so you don't get interaction with youtube player. 
            command: "STOP_VID"
          },
         // STOP_PLAY2: {
         //   pattern: "arrête la musique",
         //   command: "STOP_VID"
         // },

	 SPOTIFY_PREVIOUS: {
        pattern: "previous song",
        command: "SPOTIFY_PREVIOUS"
        },
        SPOTIFY_PAUSE: {
        pattern : "stop the musique",
        command: "SPOTIFY_PAUSE"
        },
        SPOTIFY_PLAY: {
        pattern : "music please",
        command: "SPOTIFY_PLAY"
        },
        SPOTIFY_NEXT: {
        pattern: "next song",
        command: "SPOTIFY_NEXT"
        },
        SPOTIFY_VOLUME: {
        pattern: "set music volume to ([0-9]{1,2}[0]?|100)",
        command: "SPOTIFY_VOLUME"
        },
        SPOTIFY_SEARCH: {
        pattern: "play (.*) on Spotify",
        command: "SPOTIFY_SEARCH"
        },
	SPOTIFY_SEARCH_PLAYLIST: {
        pattern: "playlist (.*) on Spotify",
        command: "SPOTIFY_SEARCH_PLAYLIST"
        },
	SPOTIFY_MA_PLAYLIST: {
	pattern: "(.*) my playlist",   // (.*)  is an action  eg: play my playlist / run my playlist etc... 
	command: "SPOTIFY_MA_PLAYLIST"
	},
	SPOTIFY_TRANSFER: {
	pattern: "play the music on (.*)", // (.*)  is the name of your device
	command: "SPOTIFY_TRANSFER"
	},
          VOLUME_UP: {
            pattern: "volume up",
            command: "CMD_VOLUME_UP"
          },
          VOLUME_DOWN: {
            pattern: "volume down",
            command: "CMD_VOLUME_DOWN"
          },
          SET_VOLUME: {
            pattern: "set master volume to ([0-9]{1,2}[0]?|100)",
            command: "CMD_VOLUME_SET"
          }

        },
        command: {

          STOP_VID: {
            moduleExec: {
              module: ["MMM-AssistantMk2"],
              exec: (module, params, key) => {
                module.assistant.subdom.youtube.innerHTML = ""; 
                module.assistant.subdom.youtube.style.display = "none";
                module.youtubePlaying = false;
              }
            }
          },
	   SPOTIFY_TRANSFER: {
	    notificationExec: {
              notification: "SPOTIFY_TRANSFER",
	         payload: (params) => {
                 console.log("SPOTIFY_TRANSFER @",params)
                return params[1];
                        }
    
	}
          },
           SPOTIFY_PAUSE: {
            notificationExec: {
              notification: "SPOTIFY_PAUSE"
            }
          },

        SPOTIFY_PLAY: {
            notificationExec: {
                notification: "SPOTIFY_PLAY"
                }
        },
	
	SPOTIFY_MA_PLAYLIST: {
	    notificationExec:  {
		notification: "SPOTIFY_PLAY",
		payload: (params) => {
		console.log("SPOTIFY_MA_PLAYLIST")
		return {
			context_uri:"spotify:playlist:0bdByehKVfdsfdsfdsOhF5t",   // Uri of a personnal playlist or album
				}
			},
		notification: "SPOTIFY_SHUFFLE",  // added this to toogle shuffle
		notification: "SPOTIFY_NEXT" // added this to not always have the same song starting first 
		}
	},		
        
	SPOTIFY_NEXT: {
         notificationExec: {
            notification: "SPOTIFY_NEXT"
                }
        },

        SPOTIFY_PREVIOUS: {
         notificationExec: {
            notification: "SPOTIFY_PREVIOUS"
                }
        },
        SPOTIFY_VOLUME: {
         notificationExec: {
           notification: "SPOTIFY_VOLUME",
           payload: (params) => {
                 console.log("SPOTIFY_VOLUME @",params)
                return params[1];
                        }
                }
        },
	SPOTIFY_SEARCH: {
         notificationExec: {
           notification: "SPOTIFY_SEARCH",

        payload: (params) => {
                console.log("SPOTIFY_SEARCH @",params)
                return {
                        type: "artist,track,album,playlist",
                        query: params[1],
                        random:false,
                        }
                     }
                }
        },
	 SPOTIFY_SEARCH_PLAYLIST: {
         notificationExec: {
           notification: "SPOTIFY_SEARCH",

        payload: (params) => {
                console.log("SPOTIFY_SEARCH_PLAYLIST @",params)
                return {
                        type: "playlist",
                        query: params[1],
                        random:true,
                        }
                     }
                }
        },


          CMD_VOLUME_UP: {
            notificationExec: {
              notification: "VOLUME_UP"
            }
          },
          CMD_VOLUME_DOWN: {
            notificationExec: {
              notification: "VOLUME_DOWN"
            }
          },
          CMD_VOLUME_SET: {
            notificationExec: {
              notification: "VOLUME_SET",
              payload: (params, key) => {
                console.log("@", params);
                return params[1];
              }
            }
          }
        },

hope this will help.

@Sean let me know if you want me to update the wiki.

Ejay

some more testing . With Spotify Familly. You can have 1 device set per email account .

ejay

Sorry it’s in french but that can help you to test your sensor out of the magicmirror app directly in python
https://raspberry-pi.developpez.com/cours-tutoriels/capteur/mag-pi-utiliser-port-gpio/partie-1-detection-mouvement/

Ejay

@sdetweil Found it here : https://www.audiophonics.fr/fr/accessoires-pour-raspberry-pi-et-autres-sbc/rallonge-micro-sd-male-vers-micro-sd-femelle-25cm-p-10896.html?search_query=sd&fast_search=fs

Hi Guys ,

I’m sharing my first attempt of my mirror build.

I used a frame with some deep bought in Leroy Merlin .
And added a mirror film on the glass . Look is ok, but I’ll redo it as I scratched it a bit at pose time.

Inside : A 17’ LCD I got from an old laptop .
I bought a LDC controler on ebay to get the hdmi output and the power.
A raspberry pi3B+
1 wifi usb adapter with external antena to extend wifi range
1 usb Fan, because my room can become very hot in summer ( this is just in case )
1 micro sd extender so I can switch SD card from outside without opening the box.

For the Modules on display :

• MMM-AssistantMk2
• MMM-Hotword
• MMM-Volume
• MMM-Spotify
• MMM-DarkWeatherforecast
• MMM-AI
• MMM-Hue
• MMM-tools
• News feed & clock

No speaker or amp connected .I pluged the 3.5mm jack out directly to my mix table who’s connected to the all sound system.

That’s pretty it !

As next step I’ll buy an additional frame and glue it to the first one to make the back more pretty .

Ejay

Very nice idea to glue 2 frame ! I haven’t thought about doing that when I created my mirror . That would have save me lot of time !

I’ll make my same usual request :) : Can we see the back and inside of your mirror ?

Thank you

Ejay