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

MMM-SmartWebDisplay : display web contents (including YouTube) on your MM


  • Project Sponsor Module Developer

    Dear all,

    Following several requests on my previous module MMM-iFrame-Ping, I have created a new one on the same topic (= web display using iFrame object) with different functionalities, see a comparison at the end.

    Functionalities of this module :

    • Several rotating URLs, it is possible to change the URL to display through :
    • Periodic refresh of the URL, or not (configurable), this allow to display images or video
    • Allow to receive notification for the following actions :
      • Change the URL or the list of URLs to displays, and update refresh timer value and rotating timer value (This mean that you can change the video to display on your mirror by sending a message from your phone or PC)
      • Go to the next/previous URL of the list
      • Play/Pause/Stop the update and rotation of URLs
        These notifications can by sent by several other MM module and also (thanks to MMM-RemoteControl) by external http request, as for example IFTTT or Tasker (Android)
    • If a PIR-sensor using MMM-PIR-Sensor module is used, the display will not be updated during screen off (this behavior works also with all other module that send the notification “USER_PRESENCE”) and will be refresh with screen on.
    • If the MMM-SmartWebDisplay module is hidden (by MMM-RemoteControl or any Carousel module for example), the URL display will not be updated. As soon as one MMM-SmartWebDisplay module will be again displayed on the screen, an update will be requested.
    • Possibility to display the date and time of the last update request (configurable)
    • Possibility to declare several instances (but so far the notification will address all the instances together)
    • CSS file

    Screenshot :
    The module displaying YouTube :
    0_1549819278573_MMM-SWD-YouTube.png

    Modification of the module MMM-RemoteControl to allow controling MMM-SmartWebDisplay :
    0_1549819312002_RemoteSWD.png 0_1549819318667_RemoteSWD_2.png

    Comparison MMM-iFrame-Ping VS MMM-SmartWebDisplay :

    Advantage MMM-iFrame-Ping :

    • only display content if reachable and display the last date and time it was reachable

    Advantages MMM-SmartWebDisplay :

    • Several instances
    • Several URL with auto rotation possible
    • Notification to send new URL to display and to manage Next/Previous/Play/Pause/Stop commands
    • Special version of MMM-RemoteControl to allow Next/Previous/Play/Pause/Stop commands easily

    Bugs and next to code:

    • Being able to send the new URL through MMM-RemoteControl
    • Manage the notification with several instances (to send the notification only to one instance and not all)
    • Any other idea ??

    All infos and installation instruction :

    And the modified version of MMM-RemoteControl :


  • Module Developer

    @agp42 Nice work! I recently added a similar modification to MMM-Remote-Control to submit custom url’s to an iframe, however I thought it might be a little difficult for people to use. I mainly created it for youtube and after all of my work on it I realized there’s already a youtube module which allows you to connect to the mirror as a smart device.


  • Module Developer

    @AgP42 Nice work!

    Just to let you know, I did a bunch of work on a version of MMM-Remote-Control that automatically exposes an API for controlling other modules, and each module can send a notification with it’s own capabilities/API. It sounds like a good use case for this module. Instead of maintaining a separate fork, you send a module notification on startup with the capabilities, and it will automatically add a menu item to the Remote Control as well as add an API path at http://magicmirrorip:8080/api/module/smartwebdisplay/. Right now you could accept a URL from the API, but I still haven’t implemented a custom payload from the remote (you can still send the play/pause/etc. commands.

    My fork

    https://github.com/shbatm/MMM-Remote-Control/tree/develop
    https://github.com/Jopyth/MMM-Remote-Control/pull/104

    API Details:

    https://github.com/shbatm/MMM-Remote-Control/tree/develop/API

    Use Case:

    https://github.com/shbatm/MMM-Carousel/blob/master/MMM-Carousel.js#L86


  • Project Sponsor Module Developer

    @seann

    Thanks for your support ! 😉
    Yes it is also very oft my problem : I send time to develop something and then I realize that someone else already did it much better !
    But it least it’s fun and you always learn better by doing youself !😅


  • Module Developer

    @agp42 Can’t agree more, I did enjoy learning how to do it myself and already what I learned has came in handy for another module I have worked on. It’s still good to have ideas like this too.
    I’m looking forward to seeing your code for sending the new URL through the control too. Keep up the good work.


  • Project Sponsor Module Developer

    @shbatm

    Good to know, it fact I am very unsatisfied that I had to create a “bad fork” of RemoteControl, it is a dirty way to work and I don’t really like that… 😓

    Did you create a dedicated post for your fork and API ?

    If RemoteControl is not maintained anymore as it seams to be, it can be a good idea to create a new “major fork” maintained with new functions as for example API for the possibility for other module to integrate menu easily !

    The official MMM-RemoteControl has already 56 fork ! 😱
    It will be interesting to see if they contains interesting features and having a new major branch.

    I didn’t look into your code deeply yet but I will do it and try to use it for my need instead of my own fork…

    Anyway I don’t have enough time myself to invest into the creation of the NextRemoteControl, but if you do so I will definitively follow and support that great initiative !


  • Project Sponsor Module Developer



  • This looks great, I’ll try it, but since you’re asking for other ideas, probably it will be a good one to make it compatible with MMM-TelegramBot, that way you can control your NEXT, PREV, etc from outside your local network using Telegram.
    Enjoy


  • Project Sponsor Module Developer

    @rafaelcota

    I didn’t know the MMM-TelegramBot, but I just check the documentation (incredibly well written ! 😂 ) and it seams very easy to integrate, so I will add it on my coding to do list for the next version !

    Thanks for the tip !


  • Project Sponsor

    Question, so this could display a RTSP security camera feed?