MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Ghost Overlay / OMXPlayerTransparency

    Scheduled Pinned Locked Moved Troubleshooting
    mmm-pirvideoplayer
    40 Posts 9 Posters 31.7k Views 8 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • R Offline
      Reotch2 @Nystro0m
      last edited by

      @Nystro0m I’ll definitely give this a shot. I’m using a local file and previously had issues because of JS sandboxing. Not sure how I missed this module, this may be what I’ve been looking for. I’ll report back if it works.

      1 Reply Last reply Reply Quote 0
      • R Offline
        Reotch2 @nobita
        last edited by

        This post is deleted!
        1 Reply Last reply Reply Quote 0
        • R Offline
          Reotch2 @Nystro0m
          last edited by

          @Nystro0m said in Ghost Overlay / OMXPlayerTransparency:

          @Reotch2 Have you tried to make the position of the module behind the modules, or play it as a background? So the other modules is on top?
          In that case you dont need any alpha.
          Position the module with OMXPlayer:
          fullscreen_below

          Also this module may help with that, if you could trigger the module with PIR:
          https://github.com/brobergp/MMM-htmlvideo

          @Nystro0m Is there a workaround to reference a local file? I’m running the same issue I did with MMM-Podcast.

          pyrosmileyP Nystro0mN 2 Replies Last reply Reply Quote 0
          • R Offline
            Reotch2 @jasondreher
            last edited by

            @jasondreher Running a pi3, no overclock.

            1 Reply Last reply Reply Quote 0
            • pyrosmileyP Offline
              pyrosmiley @Reotch2
              last edited by

              @Reotch2 I actually just was dealing with something similar trying to get that module to work as a background!

              Right now I have just a picture instead, but it should be the same idea. Put the video file somewhere on the MagicMirror directory - my image is in the CSS file but it doesn’t matter where. That way it’s included in what’s accessible on MM’s webserver that it starts. That way, in the config, you can specify the URL for the file! On mine, the picture bg.jpg is in the CSS folder, so my file listed in the config is "http://127.0.0.1:8080/css/bg.jpg".

              The biggest issue with this is that AFAIK it’s liable to get erased in updates to the MagicMirror framework, since I’m pretty sure the only two files that don’t get touched are config.js and custom.css. I’m also pretty sure that someone smarter than I has figured out a great way to get around that. BUt, since it’s just for halloween it’s probably temporary anyways so hopefully this gets you up and going.
              PS that is a cool as hell idea!

              R 1 Reply Last reply Reply Quote 1
              • cowboysdudeC Offline
                cowboysdude Module Developer @Reotch2
                last edited by

                @Reotch2 would be cool if you could package up what you have to share ;)

                R 1 Reply Last reply Reply Quote 0
                • Nystro0mN Offline
                  Nystro0m @Reotch2
                  last edited by Nystro0m

                  @Reotch2
                  Make it a .mp4 with a h.264 codec.
                  Make a folder in your module called videos.

                  videoSRC: "/videos/YOURVIDEONAME.mp4",
                  loop: true,
                  

                  You could also try:
                  http://127.0.0.1:8080/modules/MMM-htmlvideo/videos/YOURVIDEONAME.mp4

                  If that don’t work. Put it on a fileshare somewhere.
                  Maybe drive or dropbox could work if the share settings is public.

                  A

                  R 1 Reply Last reply Reply Quote 3
                  • R Offline
                    Reotch2 @Nystro0m
                    last edited by

                    @Nystro0m This finally worked. Unfortunately, it turns out running the video as a module within electron is super “clunky” on my RPI-3. OMXplayer seemed to play the video flawlessly.

                    It’s really unfortunate, because although it was choppy, it was BEAUTIFUL. Are there any overclocking options or MM tweaks that may improve embedded video quality? (yes… now I’m getting greedy).

                    Also, as an amateur mirror-ist(?), how would I have found the MMM-htmlvideo since it wasn’t published on the module page?

                    Really appreciate the help

                    Mykle1M 1 Reply Last reply Reply Quote 0
                    • R Offline
                      Reotch2 @cowboysdude
                      last edited by

                      @cowboysdude I’d really love to, and in my younger/bolder days it’d probably already be posted; unfortunately it’s not worth risking the Copyright issues. Sorry man.

                      1 Reply Last reply Reply Quote 1
                      • R Offline
                        Reotch2 @pyrosmiley
                        last edited by

                        @pyrosmiley said in Ghost Overlay / OMXPlayerTransparency:

                        @Reotch2 I actually just was dealing with something similar trying to get that module to work as a background!

                        Right now I have just a picture instead, but it should be the same idea. Put the video file somewhere on the MagicMirror directory - my image is in the CSS file but it doesn’t matter where. That way it’s included in what’s accessible on MM’s webserver that it starts. That way, in the config, you can specify the URL for the file! On mine, the picture bg.jpg is in the CSS folder, so my file listed in the config is "http://127.0.0.1:8080/css/bg.jpg".

                        The biggest issue with this is that AFAIK it’s liable to get erased in updates to the MagicMirror framework, since I’m pretty sure the only two files that don’t get touched are config.js and custom.css. I’m also pretty sure that someone smarter than I has figured out a great way to get around that. BUt, since it’s just for halloween it’s probably temporary anyways so hopefully this gets you up and going.
                        PS that is a cool as hell idea!

                        @pyrosmiley This was the fix. You and @Nystro0m nailed it. Unfortunately after all that work, the video gets choppy when run within MM. I’m going to toy with some of my RPI-3 overclock settings, but if that doesn’t work, I’m just going to stick with OMXPlayer and dimmed modules. :(

                        Thanks for the help.

                        pyrosmileyP Nystro0mN 2 Replies Last reply Reply Quote 0
                        • pyrosmileyP Offline
                          pyrosmiley @Reotch2
                          last edited by

                          @Reotch2 If you’re still shooting for this, I HIGHLY recommend using ffmpeg to convert the clip to .webm format, which was developed for web streaming video — it’s crazy efficient with file size and perfect for this type of thing. If you’ve never used ffmpeg before it can be daunting, but the gist of what you do is ‘’’ffmpeg -i .mp4 -o .webm’’’ and then let it do its thing. It may take some googling to get exactly the settings you want but a basic conversion should do pretty well for you.

                          Good luck!

                          pyrosmileyP 1 Reply Last reply Reply Quote 0
                          • pyrosmileyP Offline
                            pyrosmiley @pyrosmiley
                            last edited by

                            @pyrosmiley said in Ghost Overlay / OMXPlayerTransparency:

                            @Reotch2 If you’re still shooting for this, I HIGHLY recommend using ffmpeg to convert the clip to .webm format, which was developed for web streaming video — it’s crazy efficient with file size and perfect for this type of thing. If you’ve never used ffmpeg before it can be daunting, but the gist of what you do is ‘’’ffmpeg -i .mp4 -o .webm’’’ and then let it do its thing. It may take some googling to get exactly the settings you want but a basic conversion should do pretty well for you.

                            Good luck!

                            Formatting got messed up on my phone but the ffmpeg command is ffmpeg -i input.mp4 -o output.webm

                            It should work just fine, I literally did it for my mirror today.

                            R J 2 Replies Last reply Reply Quote 0
                            • Nystro0mN Offline
                              Nystro0m @Reotch2
                              last edited by

                              @Reotch2
                              Have you tried to convert your ghost.mp4 to your native screen resolution?
                              I think the pi will have a hard time to do the scale conversion live.

                              If you dont have the software for it, i can help you out.

                              1 Reply Last reply Reply Quote 0
                              • R Offline
                                Reotch2 @pyrosmiley
                                last edited by

                                @pyrosmiley I converted the M4V to .webm using ffmpeg (incredible tool btw). Unfortunately, it’s still super choppy. @Nystro0m in a later post suggested converting it to the native resolution, so that will be the next step. That’ll be my last attempt before I stick with the semi-transparent OMXPlayer. My kid is only 11 months old, so I’ve got a couple years before it needs to be “perfect” to scare the hell out of him.

                                You guys have been awesome. Thanks for all the continued help.

                                Nystro0mN 1 Reply Last reply Reply Quote 0
                                • Nystro0mN Offline
                                  Nystro0m @Reotch2
                                  last edited by

                                  @Reotch2
                                  Is you other widgets also laggy chunky?
                                  Im thinking about the transitions on the RSS module etc.

                                  R 1 Reply Last reply Reply Quote 0
                                  • R Offline
                                    Reotch2 @Nystro0m
                                    last edited by

                                    @Nystro0m I have minimal transitions on the screen (weather, newsfeed, clock). It looks like there is an occasional hiccup on the newsfeed, but otherwise, no issues. My front door cam is kind of a cluster and naturally clunky because it’s a non-rtsp feed, so I’m stuck doing snapshots every 500ms to give ma a “live” picture. Thinking this may be the culprit, I disabled it in the config.js to verify it wasn’t the one killing the video.

                                    I like where you’re headed though. (top) is showing two electron processes, is that normal? The highest processor abusers are Electron # 1 / Electron # 2 / XORG.

                                    1 Reply Last reply Reply Quote 0
                                    • Mykle1M Offline
                                      Mykle1 Project Sponsor Module Developer @Reotch2
                                      last edited by

                                      @Reotch2 said in Ghost Overlay / OMXPlayerTransparency:

                                      it turns out running the video as a module within electron is super “clunky” on my RPI-3.

                                      What version combination of MM and Electron are you running? We’ve had great success eliminating excessive Electron CPU usage with MM v2.1.0 and Electron v1.4.15 on Pi3 B’s, and just recently, a Pi2 as well.

                                      Obviously, the results are at the end of the topic

                                      https://forum.magicmirror.builders/topic/4684/electron-cpu-usage

                                      Create a working config
                                      How to add modules

                                      R 1 Reply Last reply Reply Quote 0
                                      • R Offline
                                        Reotch2 @Mykle1
                                        last edited by

                                        @Mykle1 said in Ghost Overlay / OMXPlayerTransparency:

                                        What version combination of MM and Electron are you running? We’ve had great success eliminating excessive Electron CPU usage with MM v2.1.0 and Electron v1.4.15 on Pi3 B’s, and just recently, a Pi2 as well.

                                        Obviously, the results are at the end of the topic

                                        https://forum.magicmirror.builders/topic/4684/electron-cpu-usage

                                        Unsure on electron (kinda hard to find a version). But I’m running 2.1.2, and still running Jessie. I should have some more time MUCH later today to tinker. I’ll use the steps on page 15 of that thread for a clean install and report back. Do any of these combinations allow GPU usage within electron? As always, appreciate the help.

                                        -Rich

                                        Nystro0mN 1 Reply Last reply Reply Quote 0
                                        • Nystro0mN Offline
                                          Nystro0m @Reotch2
                                          last edited by Nystro0m

                                          @Reotch2
                                          I got helped with this yesterday from Mykle and i went from 80-100% cpu usage to 2-45% cpu usage.
                                          The biggest difference was by downgrading electron to 1.4.15.
                                          But running MM 2.1.0 instead of 2.1.2 also made a improvement.

                                          How to downgrade electron
                                          Navigate to your home folder, from here delete all maps including electron. there should be two:
                                          .electron & .electron-glpyh.
                                          Navigate to you node-modules inside MM.

                                          § cd ~/MagicMirror/node_modules
                                          

                                          Uninstall electron by

                                          § sudo npm uninstall electron
                                          

                                          install electron with desired version in this case 1.4.15 by:

                                          § sudo npm install electron@1.4.15
                                          

                                          Now open file manager or navigate to “~/MagicMirror/node_modules/electron” and look in package.json
                                          Here you can confirm your version number of electron.

                                          How to downgrade MagicMirror
                                          If you want to downgrade your MM version you will need to make a new install.
                                          I would suggest everyone doing this to NOT delete it BEFORE you have made a backup.

                                          You can find MM 2.1.0 here (thanks to Mykle for providing me with link):
                                          https://github.com/MichMich/MagicMirror/archive/v2.1.0.zip.

                                          Unpack the zip in you home folder, and rename it to MagicMirror
                                          then just run npm install from the folder.

                                          § cd ~/MagicMirror/
                                          § npm install
                                          

                                          Note: You will need to re-install electron 1.4.15 after the clean install of MM 2.1.0.
                                          Make sure to have everything up and running before you do that.

                                          I did run the gun and needed to redo everything twice.

                                          R 1 Reply Last reply Reply Quote 2
                                          • R Offline
                                            Reotch2 @Nystro0m
                                            last edited by

                                            @Nystro0m So went all out, and did a fresh install of Raspbian Stretch, MM2.1.0 and electron 1.4.15… even with just the default modules and htmlvideo, electron has the CPU pegged at >75% playing the .webm file. The video is slightly less choppy than before, but still not as seamless as OMXPlayer. Do I just have a crappy Pi3? Are there memory, GPU, or overclock settings I’m missing in my pi config file that may help? I’m also running it through PM2… is that causing issues?

                                            Thanks,
                                            Rich

                                            Mykle1M Nystro0mN 2 Replies Last reply Reply Quote 0

                                            Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                                            Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                                            With your input, this post could be even better 💗

                                            Register Login
                                            • 1
                                            • 2
                                            • 1 / 2
                                            • First post
                                              Last post
                                            Enjoying MagicMirror? Please consider a donation!
                                            MagicMirror created by Michael Teeuw.
                                            Forum managed by Sam, technical setup by Karsten.
                                            This forum is using NodeBB as its core | Contributors
                                            Contact | Privacy Policy