darickc / mmm-backgroundslideshow Goto Github PK
View Code? Open in Web Editor NEWLicense: MIT License
License: MIT License
To reproduce, point the imagePath to a directory (e.g., "modules/pictures") with recursiveSubDirectories=true. Inside that path, have a subdir with spaces (e.g., "modules/pictures/e xamp le directory") and inside that put some pictures. The module fails to find these pictures and appears to crash when this setup is used.
FYI, it is also broken in the ImageSlideshow module where some of the code came from
This morning I applied the last update ( May 11 2020) and since then all seems ok ... except that no photo are loaded ... I just have a black screen instead... nothing else changed on the RPi, photo are there... no error message, nothing in the log ... all other modules are there.
Any clue how to debug?
edit: if I start MM in dev mode, I can see "No image to display" on the logs...
Edit2: Reverting to previous code is fixing the issue ... someone need to look what was breaking it...
Hello there,
I haven't been able to get an exact amount of time, but after say about a day or so the slideshow stops. All of the other modules are running just fine except this one. It's up to date with what ever the last revision is but it still freezes. Thoughts?
Hi, I love your slideshow, it looks great on my new magic mirror!
When using ianperrin/MMM-ModuleScheduler to switch the module off at night, it does turn off, but then when turning on again, it shows the image for a second and then goes dark. Only after a refresh (F5) I can see the image again when the scheduler has turned it on.
Are there any fixes known for this? It may also be related to the scheduler not being updated in years...
I'd like to:
I'm happy to follow any rules or processes that you feel most comfortable with.
Is it somehow possible to have the gradient effect (to make the text better visible) be displayed on left and right side, instead of top and bottom?
Issue:
When only a single client (browser) is connected to the MagicMirror, everything works fine. But open another tab with the MagicMirror Url and the images change in higher frequency in all tabs. Open a few more and the background image changes like crazy.
Config:
Default installation with default settings, only changed transitionImages
to false
so the image change is visible with high frequency.
Hi there,
just installed the module via GIT and added the following lines to the config.js, but there's still a black background instead of images. It seems like the node_helper doesn't receive the socket notification?
config.js:
[...]
{
module: 'MMM-BackgroundSlideshow',
position: 'fullscreen_below',
config: {
imagePaths: ['modules/MMM-BackgroundSlideshow/exampleImages'],
transitionImages: true,
randomizeImageOrder: true
}
},
[...]
Please help me :-)
Thx!
Any chance for an enhancement of this module so that is automatically looks for picturs in subfolders and randomly shows pictures?
It works great by the way!
Hello darickc,
my Synology NAS creates a hidden subfolder "@eadir" in each folder, in which thumbnails are stored in several different resolutions.
If the parameter "recursiveSubDirectories: true" is set, these thumbnails will also be displayed by the module in the low resolutions, then of course totally pixelated.
Is it possible to exclude these subfolders and not display their contents?
Thanks for the effort
I love the idea of this module, and it works great with a local directory. I mounted a shared directory and pointed the imagePaths to the mount point, and all I get is a black background. I've tried playing with permissions and paths, but haven't had any luck. Any ideas on why this is happening or how to better debug?
downloaded and installed latest code and couldn't get it to display the images it found. I added some console.log output so I could see the path of notifications into node_helper and then back out to module with the list of image file paths. Node_helper code sends a BACKGROUNDSLIDESHOW_FILELIST socket notification to the module but it is never received. Not sure what is going on.
Steve
0|mm | [2020-06-18 17:42:48.081] [LOG]
0|mm | MMM-BackgroundSlideshow node_helper module received BACKGROUNDSLIDESHOW_REGISTER_CONFIG socket notification...
0|mm | [2020-06-18 17:42:48.307] [LOG]
0|mm | MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/10_11_19, 10_12 AM Office Lens.jpg
0|mm | [2020-06-18 17:42:48.308] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/2020 03 Em Senior.jpg
0|mm | [2020-06-18 17:42:48.310] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/2020 05 14 WA Drivers License.jpg
0|mm | [2020-06-18 17:42:48.313] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Github Clone fail.png
0|mm | [2020-06-18 17:42:48.315] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Github Clone.png
0|mm | [2020-06-18 17:42:48.317] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Office Lens 20161004-153905 - (1).jpg
0|mm | [2020-06-18 17:42:48.318] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Office Lens 20161004-153905 - (2).jpg
0|mm | [2020-06-18 17:42:48.320] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Office Lens 20161004-153905 - (3).jpg
0|mm | [2020-06-18 17:42:48.323] [LOG] MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Office Lens 20161004-153905 - (4).jpg
0|mm | [2020-06-18 17:42:48.324] [LOG]
0|mm | MMM-BackgroundSlideshow node_helper module found an image: Media/NAS/Renter Ins Signature.PNG
0|mm | [2020-06-18 17:42:48.325] [LOG] MMM-BackgroundSlideshow node_helper module sending BACKGROUNDSLIDESHOW_FILELIST socket notification...
Hello
I wanted to ask what settings I need to make in your module so that my images are displayed on the PI as well as on the monitor on my computer. As you can see from the thread, my computer displays the pictures in the correct size, which is not the case with your module. Is there still a possibility that the images will be displayed correctly in your module? Because I love your module and do not want to switch to another.
Thank you already for your efforts!
https://forum.magicmirror.builders/topic/9084/mmm-backgroundslideshow
Is it possible to let the module look at an exernal USB drive that is mounted to " /media/pi/KINGSTON"?
I cannot find out how to configure the "imagePaths" variable in the config.js file.
Kerijn.
I use my MagicMirror as a digital photo frame and this Module is working great for me. But i am always confused where and when i have taken my pictures.
So is it somehow possible to Show the meta data like Date and Location on the screen?
Hi, I had the problem that background images never showed up. By reading through the closed issues I saw someone using "modules/MMM-BackgroundSlideshow/exampleImages/" instead of the path 'modules/MMM-BackgroundSlideshow/exampleImages/' stated in the description --> That worked for me
Great module - kudos. Works right, out of the box.
Does it support the "makeImagesGrayscale" property ?
If not, any plans to add that ?
First verry nice module. But my background go crazy like hell. it change every second without transition.
{
//disabled:true,
module: "MMM-BackgroundSlideshow",
position: "fullscreen_below",
config: {
imagePaths: ["modules/MMM-BackgroundSlideshow/exampleImages"],
transitionImages: true,
randomizeImageOrder: true,
gradient: ['rgba(2,0,36,1) 0%', 'rgba(0,0,0,0.7329306722689075) 0%'],
}
},
did someone know what happen there ?
I've tried this module along a few others (for example https://github.com/mykle1/MMM-EasyBack worked). Sadly i can't get this one running.
I've also tried to replace the inner div (div1 & div2) with an attribute - as seen in the working module - without success.
The URI i get at MMM-BackgroundSlideshow.js line 154 (image.src = ...) is the same I've tested on the working module. Therefore the problem isn't related to the image path.
Changes on the other attributes doesn't solve the problem, too.
Edit: Here is my config as well as an image from FileZilla which shows the folder: https://imgur.com/a/ybGCUFH. I am using a Raspberry Pi 3b+ with Raspbian as OS.
can barely read on screen modules
["calendar"],
["MMM-ATM"],
["calendarH"],
["MMM-Fortune"],
["MMM-DailyQuote"],
["MMM-Gas"],
["MMM-CloneWarsQuotes"],
["MMM-Globe"],
["MMM-icanhazdadjoke"],
is there a way to make the pictures in the background dimmer?
backgroundSize: cover is a default value ( i also added configuration) but still there is blank area left and right of the screen. How can i solve it ?
I am trying to use high quality images that I have shot and edited. All images are in a local directory and in JPG format. Sizes range from about 1.7MB to close to 12MB for each image.
I'm running on a RPi3 w/ 1GB RAM. Configuration is:
{ module: 'MMM-BackgroundSlideshow', position: 'fullscreen_below', config: { imagePaths: ['modules/MMM-BackgroundSlideshow/images/'], transitionImages: true, validImageFileExtensions: 'bmp,jpg,gif,png,JPEG', backgroundSize: 'contain', randomizeImageOrder: true } },
I start up MM and after only a short amount of run time, it will completely crash with the following error in the log:
[2219:1212/085505.692849:FATAL:memory.cc(22)] Out of memory. size=96641024
The error appears to always be the same, the image that is displayed when it crashes is not always the same.
Having used this module for the last year or so without issue, it's unfortunate that the latest MM doesn't play nicely with any longer.
With this module active in my config.js file my screen give me a "Something went wrong displaying this web page" error after a period of time. If I VNC into the headless Pi and refresh the page it loads fine, then after a period of time it drops back to the error again.
I've tried deleting and re-installing the module.
Would be great if it had a BACKGROUNDSLIDESHOW_PREVIOUS notification so you could go back to the previous image
I'm using to show photo library and my wife always wants to go back to see the photo that was just showing a second ago :)
Hi!
Thanks for the module.
I'm experiencing some laggin issues for now but I need to check from where it's coming on my side before digging in.
This ticket because I would love an module update that would support Play / Pause option of the rotation upon notification.
If you have any time for a future update, would be perfect!
Thanks already for your time, and thanks again for the module.
Thank you for providing us with this fantastic module!
It is so suitable for playing photos on a MagicMirror or a Digital Picture Frame, especially for world-famous paintings. Regrettably, it can't play music.
While enjoying the world famous paintings in front of the frame, I hope we also can listen to its audio guide. I can upload a .jpg photo file (e.g., xyz.jpg) and a .mp3 audio file (e.g., xyz.mp3) into the module upload sub-folder. when the module display a photo, its audio play function begin to work. After the audio play end, the module display the next photo and play the next audio.
Could you add audio guide player function into this module next version? It may be an excessive request to ask you to add the additional function. Anyway, I hope you will consider my request.
Good luck.
I'm not used to commit on github, so I post it here.
MMM-BackgroundSlideshow.js
line 259
is: this.createGradientDiv('right', this.config.gradient, wrapper);
should be: this.createGradientDiv('right', this.config.horizontalGradient, wrapper);
How do you install this? I added the config lines to config.js but nothing is happening. Does it install itself when you put it in the config.js file?
Has anyone else used the following setting in their config.js file?
randomizeImageOrder: false,
My images don't show if I set this value to false. They work if I set the value to true, though. Unfortunately I need to play my images in order so any help to fix this would be hugely appreciated!
Ali
Hello,
the parameter "gradientDirection" only "horizontal" or "vertical" works. If it is set to "both", the gradient is horizontal again.
The Parameter "horizontalGradient" does not change anything.
I am using this module with a mounted folder. The folder has about 16 images with total of 55MB size (each image JPG with ~5MB size). After running this module on MM2 for few hours, the MM goes to blank screen with Out of memory. I have isolated to out of memory to this module as disabling doesn't cause Out of memory. Is there any size or quantity restriction of number of images that can be in the folder? My goal was to have a folder that is managed on the server mounted at startup on PI that I can run slideshow on.
Any help will be greatly appreciated.
A Noob here......what are the install instructions
Since I updated this module the translations are broken. So I have to load a backup! Pls check if its not only my fault...
Some great big images are slowly loaded so the transition shows for a second a black image. This happens only with high resolution images. Maybe you should implement a preload function?
I am using a Raspberry 4 with 4GB RAM
Thanks for the module. It is working great for me except for one thing:
Photos are not always in correct orientation (upside-down / sideways). It seems the module is not taking the EXIF information of the jpg files into consideration.
Is there a way to scale the image size to that the image fits the screen. Tall images scale to the max height of the screen, or pre-determined size. And/or wide images scale to the max width of the screen, or pre-determined size.
Using last versions of magicmirror and backgroundslideshow.
Long standing issue => Images taken in portrait mode are shown lying on the side => they should be presented standing, centered and with a black canvas on both sides.
Recent issue (couple of months) => perfectly normal, landscape images are shown upside down
thanks in advance.
Here is the error that pops up:
`WARNING! Could not validate config file. Starting with default configuration. Please correct syntax errors at or above this line: /home/pi/MagicMirror/config/config.js:163
modules: [
^
SyntaxError: Unexpected token :
at new Script (vm.js:74:7)
at createScript (vm.js:246:10)
at Object.runInThisContext (vm.js:298:10)
at Module._compile (internal/modules/cjs/loader.js:678:28)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:722:10)
at Module.load (internal/modules/cjs/loader.js:620:32)
at tryModuleLoad (internal/modules/cjs/loader.js:559:12)
at Function.Module._load (internal/modules/cjs/loader.js:551:3)
at Module.require (internal/modules/cjs/loader.js:658:17)
at require (internal/modules/cjs/helpers.js:20:18)
Loading module helpers ...
`
Here is that part of the config.js file:
{
module: "weatherforecast",
position: "top_right",
header: "Weather Forecast",
config: {
location: "New York",
locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
appid: "YOUR_OPENWEATHER_API_KEY"
}
},
]
},
modules: [
{
module: 'MMM-BackgroundSlideshow',
position: 'fullscreen_below',
config: {
imagePaths: ['modules/MMM-BackgroundSlideshow/exampleImages/'],
transitionImages: true,
randomizeImageOrder: true
}
}
];
when using contain, there are areas of the screen where the background shows thru. I would like to set a color for that
very cool by the way.. I did much the same for my modified version of ImageSlideshow
All of the pictures I add are rotated 90 degrees counter clockwise. I double checked the orientation of the files on the pi and on multiple computers. They only display wrong when viewed through the BackgroundSlideshow module.
Hello! First off, thank you for the amazing (and best) photo-slideshow module for Magic Mirror! I was wondering if there was a way to apply the gradient array to all four sides? This would provide a sort of vignette-effect for the photos. Any thoughts would be appreciated! Thank you again!
Hello,
First I want to say that is really a great platform with a lot possibilities.
5 days ago I bought this raspberry 3b out of curiosity: I wanted to do a Magic Mirror!
Well it is working! only after following all the steps of this module I am not managing to make it work (ok that was not part of the the Mirror project since it will be more a wall monitor)
so in the config.js I have written (copy paste + some changes since if I copied the original it was giving me Syntax error)
{
module: "MMM-BackgroundSlideshow",
position: "fullscreen_below",
config: {
imagePaths: ["MMM-BackgroundSlideshow/example1"],
transitionImages: true,
randomizeImageOrder: true
}
},
now the Mirror works again but with no images. Since I am using a SHH thing (lol, sorry for my ignorance!) I could see the following message:
Whoops! There was an uncaught exception...
{ Error: ENOENT: no such file or directory, scandir 'MagicMirror/modules/MMM-BackgroundSlideshow/example1'
at Object.fs.readdirSync (fs.js:904:18)
at Object.fs.readdirSync (ELECTRON_ASAR.js:608:28)
at Class.gatherImageList (/home/pi/MagicMirror/modules/MMM-BackgroundSlideshow/node_helper.js:62:59)
at Class.socketNotificationReceived (/home/pi/MagicMirror/modules/MMM-BackgroundSlideshow/node_helper.js:121:28)
at Socket. (/home/pi/MagicMirror/modules/node_modules/node_helper/index.js:113:11)
at emitTwo (events.js:126:13)
at Socket.emit (events.js:214:7)
at /home/pi/MagicMirror/node_modules/socket.io/lib/socket.js:528:12
at _combinedTickCallback (internal/process/next_tick.js:131:7)
at process._tickCallback (internal/process/next_tick.js:180:9)
errno: -2,
code: 'ENOENT',
syscall: 'scandir',
path: 'MMM-BackgroundSlideshow/example1' }
Now the file with 4 pictures is existing in MMM-BackgroundSlideshow/example1 (well I did change the file name to example1
what can I do that is work?
thank you so much
I am attempting to use this with my Synology NAS where I have ~55000 photos stored.
I am getting a 400 Bad Request for a socket.io request. I am not sure how to diagnose this further, though, as I am not super experienced with Chrome Developer tools.
I am thinking that perhaps because it takes so long to recursively find the files throughout the folders the request is timing out or something?
I can get it to work fine by just choosing a single folder but that isn't ideal at all--I want this to be a digital photo frame that I can restart occasionally to grab new files automatically from the NAS.
WebSocket connection to 'ws://0.0.0.0:8080/socket.io/?EIO=3&transport=websocket&sid=o2JqpgdUAqwvTqN0AAAH' failed: WebSocket is closed before the connection is established.
Failed to load resource: the server responded with a status of 400 (Bad Request) : http://0.0.0.0:8080/socket.io/?EIO=3&transport=polling&t=MWWn7p3&sid=KtC2IMJJcINV7FWsAAAA
Can someone share an exemple how to setup the notification for the module ...I probably missed a simple step...
Thanks,
I have everything setup but it just stays on one picture.
When I load the module if looks like it's working. But right at the moment all modules are loaded all my text gets hidden and keep blinking.
I'm just curious if this module is capable of pointing to a network share located on a local NAS that stores photos?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.