hermanho / MMM-GooglePhotos

Display your photos on MagicMirror from Google Photos.
MIT License
172 stars 65 forks source link

Blurry Background Image #39

Closed EugenZimmermann closed 4 years ago

EugenZimmermann commented 5 years ago

Hi,

I recently set up my MagicMirror as a flexible image frame and like your google photos module. Is there a possibility to add a blurry copy of the same image as background to avoid having black bars (maybe as an additional mode)? Unfortunately, I'm not familiar with node so I don't know where to start for this.

Cheers, Eugen

eouia commented 5 years ago

Sorry, without source modification, it couldn't. you can use mode:cover to cover full area. (but some edge will be cropped by direction)

XenonofArcticus commented 4 years ago

Seems like it would be a simple modification of the source to add a second copy of the image to the DOM with different setting to mode:cover and do a CSS blur: https://www.w3schools.com/howto/howto_css_blurred_background.asp

You probably don't need to know much Node to hack up some CSS and javascript to do this and I bet others would appreciate it. (I would!)