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.

    MMM-BackgroundSlideshow

    Scheduled Pinned Locked Moved Solved Troubleshooting
    30 Posts 4 Posters 11.6k Views 4 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.
    • S Offline
      sdetweil @CyruS1337
      last edited by

      @CyruS1337 no… it happened to me!

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 1
      • CyruS1337C Offline
        CyruS1337 Project Sponsor
        last edited by

        Now I thought it was solved, but after about 1 hour the screen was black again. I had to stop the MagicMirror with pm2 stop 0 and then restart it with pm2 start 0.

        I also changed the size from 100 to 1024.

        What else can it be?

        sudo dphys-swapfile swapoff
        sudo nano /etc/dphys-swapfile / (changed size 1024)
        sudo dphys-swapfile swapon
        
        
        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @CyruS1337
          last edited by

          @CyruS1337 and rebooted after changing swap file

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          CyruS1337C 1 Reply Last reply Reply Quote 0
          • CyruS1337C Offline
            CyruS1337 Project Sponsor @sdetweil
            last edited by

            @sdetweil said in MMM-BackgroundSlideshow:

            and rebooted after changing swap file

            I have now reboot the mirror …

            1 Reply Last reply Reply Quote 0
            • S Offline
              sdetweil
              last edited by

              free -m
              Command will show memory usage

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              CyruS1337C 1 Reply Last reply Reply Quote 0
              • CyruS1337C Offline
                CyruS1337 Project Sponsor @sdetweil
                last edited by CyruS1337

                @sdetweil said in MMM-BackgroundSlideshow:

                free -m
                Command will show memory usage

                pi@raspberrypi_1:~ $ free -m
                              total        used        free      shared  buff/cache   available
                Mem:            925         218         404           1         302         657
                Swap:          1023         111         912
                
                
                1 Reply Last reply Reply Quote 0
                • CyruS1337C Offline
                  CyruS1337 Project Sponsor
                  last edited by CyruS1337

                  This morning, the mirror was dark again.

                  This is the memory output

                  pi@raspberrypi_1:~ $ free -m
                                total        used        free      shared  buff/cache   available
                  Mem:            925         220         391           1         313         653
                  Swap:          1023         118         905
                  

                  Edit: The mirror was stopped and started and after 15min he was dark again …

                  1 Reply Last reply Reply Quote 0
                  • CyruS1337C Offline
                    CyruS1337 Project Sponsor
                    last edited by

                    I seem to have found the mistake. I have selected one to quality of photos for playing the photos (4mb per photo). The fact that I have chosen a lower quality of the photos, the problem is gone.

                    S 1 Reply Last reply Reply Quote 0
                    • S Offline
                      sdetweil @CyruS1337
                      last edited by

                      @CyruS1337 interesting, i use MMM-ImagesPhotos, and have lots of images over 4meg, most in the 11-13 meg range

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      1 Reply Last reply Reply Quote 0
                      • CyruS1337C Offline
                        CyruS1337 Project Sponsor
                        last edited by

                        Yes, that’s really interesting. But since I let the pictures play with max 1-2 MB, the mirror was never black anymore. Although I did the elevation of SWAP.

                        1 Reply Last reply Reply Quote 0
                        • H Offline
                          hootzter
                          last edited by

                          Hello,

                          I’m new to magic mirror. Since two weeks I try to get MMM-ImagesPhotos or MMM-BackgroundSlideshow to work with the photos of my camera (all pictures are JPEG with 5 to 10 meg).

                          Like @CyruS1337 the whole mirror goes black, if I use my photos but works if I use the example-pictures.

                          @sdetweil :
                          How did you get this to work with your pictures?
                          Could you post your config (including tweeks you did) and tell us which pi you are using?

                          I was so desperate that I looked for alternatives. I found pi3d but couldn’t integrate it into magic mirror.

                          I would really appreciate your help.

                          Best regards

                          hootzter

                          S 1 Reply Last reply Reply Quote 0
                          • S Offline
                            sdetweil @hootzter
                            last edited by

                            @hootzter said in MMM-BackgroundSlideshow:

                            MMM-ImagesPhotos

                            usually black screen means some missing library…
                            if u npm start from the terminal window you will see runtime messages
                            also from the developers window , ctrl-shift-i on the mirror keyboard, select the console tab, and scroll up.

                            you can try my MMM-ImagesPhotos
                            https://github.com/sdetweil/MMM-ImagesPhotos

                            my config

                            		{
                            			module: "MMM-ImagesPhotos",
                            			disabled: false,
                            			position: "fullscreen",  // < --- this is the div location NOT screen covered with image
                            			config: {
                            				opacity: 0.9, 
                            				animationSpeed: 0,
                            				updateInterval: 30000,  // how often to change pic
                            				backgroundColor: "#808080", // color around pic (if u want something other than black)
                            			},
                            		},
                            

                            I have run this on pi0 thru pi4, mac, and two non-pi SBCs, odroid Xu4, and nano jetson.
                            where did u put your pictures? the module is looking in the folder
                            ~/MagicMirror/modules/MMm_ImagesPhotos/uploads

                            I linked that to a mounted server volume

                            now, my tweaks were to display the images without distortion… same aspect ratio as taken.
                            I did NOT want the screen completely filled… (image stretched or clipped)

                            to use mine, just rename the old MMM-ImagesPhotos folder out of the way, and then git clone my version of the module.

                            Sam

                            How to add modules

                            learning how to use browser developers window for css changes

                            StoffbeuteluweS 1 Reply Last reply Reply Quote 0
                            • StoffbeuteluweS Offline
                              Stoffbeuteluwe Project Sponsor @sdetweil
                              last edited by

                              @sdetweil Hi, is it possible to cover the whole screen with mmm images photos?

                              S 1 Reply Last reply Reply Quote 0
                              • S Offline
                                sdetweil @Stoffbeuteluwe
                                last edited by sdetweil

                                @Stoffbeuteluwe not with my code, no

                                the original code does fill the screen if u set the max height and width to the screen size

                                img.style.maxWidth = this.config.maxWidth;
                                img.style.maxHeight = this.config.maxHeight;
                                

                                Sam

                                How to add modules

                                learning how to use browser developers window for css changes

                                StoffbeuteluweS 2 Replies Last reply Reply Quote 0
                                • StoffbeuteluweS Offline
                                  Stoffbeuteluwe Project Sponsor @sdetweil
                                  last edited by

                                  @sdetweil Thank you Sam 😀🙏

                                  1 Reply Last reply Reply Quote 0
                                  • StoffbeuteluweS Offline
                                    Stoffbeuteluwe Project Sponsor @sdetweil
                                    last edited by Stoffbeuteluwe

                                    @sdetweil hi Sam can you help me again I have tried a lot but no luck…my screensize is
                                    width: 1080
                                    high: 1920
                                    I don’t know how to set it the right way

                                    Thanks 🙏

                                    S 1 Reply Last reply Reply Quote 0
                                    • S Offline
                                      sdetweil @Stoffbeuteluwe
                                      last edited by sdetweil

                                      @Stoffbeuteluwe are u portrait, not landscape? original or mine?

                                      it should work, but ugly

                                      Sam

                                      How to add modules

                                      learning how to use browser developers window for css changes

                                      StoffbeuteluweS 1 Reply Last reply Reply Quote 0
                                      • StoffbeuteluweS Offline
                                        Stoffbeuteluwe Project Sponsor @sdetweil
                                        last edited by

                                        @sdetweil Portrait

                                        S 1 Reply Last reply Reply Quote 0
                                        • S Offline
                                          sdetweil @Stoffbeuteluwe
                                          last edited by

                                          @Stoffbeuteluwe oops. the width/height is from the imagesSlideshow

                                          this module only supports

                                          backgroundSize	The sizing of the background image. Values can be:
                                          cover: Resize the background image to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges.
                                          contain: Resize the background image to make sure the image is fully visible
                                          
                                          Example: 'contain'
                                          Default value: 'cover'
                                          This value is OPTIONAL
                                          

                                          Sam

                                          How to add modules

                                          learning how to use browser developers window for css changes

                                          1 Reply Last reply Reply Quote 0
                                          • S Offline
                                            sdetweil
                                            last edited by

                                            also, how are you rotated? physical or CSS?

                                            module does

                                            			div1.style.transform="rotate(0deg)";
                                            

                                            then adjusts if different

                                            var Orientation = EXIF.getTag(this, "Orientation");
                                            				if (Orientation != null) {
                                            

                                            Sam

                                            How to add modules

                                            learning how to use browser developers window for css changes

                                            StoffbeuteluweS 1 Reply 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