Ghost Overlay / OMXPlayerTransparency

Reotch2 · Sep 28, 2017, 2:16 AM

@jasondreher Running a pi3, no overclock.

pyrosmiley · Sep 28, 2017, 5:45 AM

@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!

cowboysdude · Sep 29, 2017, 2:36 AM

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

Nystro0m · Sep 28, 2017, 4:17 PM

@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

Reotch2 · Sep 29, 2017, 2:29 AM

@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

Reotch2 · Sep 29, 2017, 2:36 AM

@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.

Reotch2 · Sep 29, 2017, 2:42 AM

@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.

pyrosmiley · Sep 29, 2017, 6:54 AM

@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!

pyrosmiley · Sep 29, 2017, 6:56 AM

@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.

Nystro0m · Sep 29, 2017, 5:59 PM

@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.