MagicMirror² v2.13.0 is available! For more information about this release, check out this topic.

MMM-Navigate, Navigation inside MagicMirror with Rotary Encoder

  • Module Developer

    Here is my first module.


    A module to connect a rotary encoder to MagicMirror and use it for Navigation inside of MagicMirror I wanted to use interaction to the MagicMirror and decided to use a rotary encoder, which has 3 functions: Clockwise, Counterclockwise and Press. These fucntions where combined to a navigation, so you have some possibilities, f.e.: Page increment/decrement, Newsfeed Article more/less details and actions for notification system. The navigation fades out, if not used.




    Update 06.06.2018
    Version 1.1 is online

    • added ability to send notifications to MMM-Navigate by other modules
    • added locked mode, so you can put two(2) actions in one(1) navigation link which belong together (like PAGE_INCREMENT and PAGE_DECREMENT). More details see Configuration options (Action).
    • modified css, so locked mode is visual (red frame when locked) in MM
    • added second click confirmation notification’ for the following REMOTE_ACTIONs (SHUTDOWN, RESTART, REBOOT)

    Please let me know what you think.


  • Moderator

    @axled said in MMM-Navigate, Navigation inside MagicMirror with Rotary Encoder:

    @admins: How can i insert the github card for my module?

    You use this code, just without spaces

    [ card:Ax-LED/MMM-Navigate ]

  • Module Developer

    Thank you yawns

  • Module Developer

    Hi to all,

    version 1.1 is online, details see first topic of this thread.


  • Project Sponsor Module Developer


    I am using your module what is really great and works perfectly fine on my side.

    I configure it to allow some others fonctions, after finding out that the fonctions from the module “MMM-Remote-Control” can be used on your navigation module. I also read part of the “node_helper.js” of this module to try to find out the possibilities avaliable.

    This allow me to add the ability of “refresh” and “monitoroff” and “monitoron” on my navigation menu :

                            module: "MMM-Navigate",
                            header: "Navigation",
                            position: "middle_center",
                            config: {
                                            Alias: [
                                                    'Changer de Page (Press puis rotation)',
                                                    'Luminosité écran (Press puis rotation)',
                                                    'Afficher adresse Remote',
                                                    'Ecran off/on (Press puis rotation)',
                                                    'Recharger affichage',
                                                    'Redemarrer le MagicMirror',
                                                    'Reboot RPI',
                                                    'Shutdown RPI'
                                            Action: [
                                                    [{notification:'PAGE_INCREMENT',payload:''},{notification:'PAGE_DECREMENT',payload:''}],//action array, first press locks menu, after this rotation CW/CCW executes, second press release lo$
                                                    [{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS&value=100"}},{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS&value=50"}}],
                                                    {notification: "SHOW_ALERT", payload: {type:"notification",message:"http://192.168.xx.xx:8080/remote.html"}},//single action, execute on press
                                                    [{notification: "REMOTE_ACTION", payload: {action: "MONITOROFF"}},{notification: "REMOTE_ACTION", payload: {action: "MONITORON"}}],
                                                    {notification: "REMOTE_ACTION", payload: {action: "REFRESH"}},
                                                    {notification: "REMOTE_ACTION", payload: {action: "RESTART"}},
                                                    {notification: "REMOTE_ACTION", payload: {action: "REBOOT"}},
                                                    {notification: "REMOTE_ACTION", payload: {action: "SHUTDOWN"}}
                                            GPIOPins: [26,20,19]//rotary cw, rotary ccw, rotary press (BCM Numbering)

    But then I tried 2 others improvment that I couln’t fullfill :

    • change the timer value to display the notification : to do so I add the value “timer” for the notification :
     {notification: "SHOW_ALERT", payload: {type:"notification",message:"http://192.168.xx.xx:8080/remote.html",timer: 15}},

    But this had no impact…

    • add the possibility to change the brightness of the screen directly from the navigation menu, to do so I tried :
    [{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS&value=100"}},{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS&value=50"}}],

    but also :

    [{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS", value:100}},{notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS", value:50}}],

    but no way to make it work…

    Would you have any advice how to realize such fonctions ?

    Thank you in advance,

  • Module Developer


    thanks for your request, i checked my code and can give you a solution for the brightness issue.
    I found out, that it seems to be a problem with MMM-Remote-Control, node_helper.js

    But there is a workaround:
    Replace line 618
    res.send({"status": "success"});
    if (res) { res.send({"status": "success"}); }

    Thanks to glitch452 who found the error, details see:

    Sample code for config.js, Module MMM-Navigate:

    {notification: "REMOTE_ACTION", payload: {action: "BRIGHTNESS", value: "200"}},


  • Project Sponsor Module Developer

    Great ! Thank you so much !

    But as said on the link you gave :

    @axled said in MMM-Navigate, Navigation inside MagicMirror with Rotary Encoder:

    Thanks to glitch452 who found the error, details see:

    the line to replace is

    res.send({"status": "success"});

    and not

     self.sendSocketNotification(query.action, query.value);

    Then it is working perfectly !

  • Module Developer

    You are right, i told you the wrong line, i corrected my thread above.
    I am glad it is working on your MM as needed.

  • Module Developer

    Hi to all MM Builders,

    i made an update to my module MMM-Navigate.

    1.2 Changelog:

    • tadded lock icon next to navigation alias, if locked
    • code cleaned

    Happy navigation.


  • Hi,

    i installed this module with the Rotary Encoder KY-040. Scroll through navigation work fine, but nothing happened, when I press the button on the encoder.

    Test with Url (yourmmip:8080/remote?action=NOTIFICATION¬ification=PRESSED) works fine.

    What could be the problem ??

Log in to reply