Apple TV meets MagicMirror.

yep_DD

@thejoaovitor very impressive, did you store your webm videos locally? If so how did you get MMM-htmlvideo to play all of those files?

Greetings

yep_DD

@rak

have you tried this? (#ff0000 just for presentation)

body {
  text-shadow: 1px 1px #ff0000;
}

rak

Thanks. Works like a charm. Did you “resize” the GoogleMapsTraffic somehow? Mine shows with very thick green lines for the highway/traffic. Can one with CSS resize the map to say 50% and double the size of the underlying graphic, which would thin out the lines a bit,

thejoaovitor

@yep_dd Thank you! I store locally for convenience, but I’ve read here that if you store those on a separate web server they play even more smoothly.

{
	module: 'MMM-htmlvideo',
	position: 'fullscreen_below',
	config: {
		  videoSRC: "http://127.0.0.1:8080/modules/MMM-htmlvideo/videos/video3.WebM"
		  }
}

@rak If you decrease the zoom, width, height from the module config you will lose some detail (smaller roads won’t appear), so I’ve added this in custom.css to make it smaller and denser:

.MMM-GoogleMapsTraffic{
  zoom: 0.7;
}

yep_DD

@thejoaovitor cool, thank you. did you leave it at 1080p or did you use 720p? Would you mind sharing your conversion details? I tried 720p and it still did not play very smooth.

thejoaovitor

@yep_dd I used Wondershare Video converter for Mac, 1080p WebM with standard options. It gets choppy once in a while, mostly when some module animates (RSS Feed fading in and out), but I’m ok with it as Pi’s are not powerhouses :) Try uploading your video in a separate host to check performance.

bachoo786

@thejoaovitor hi thanks alot for this share amazing work.

may I ask, the videos that you have used, do they contain some sort of text describing the video? how did you manage to remove them?

thanks.