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.

    Help with updateDom()

    Scheduled Pinned Locked Moved Development
    11 Posts 5 Posters 2.8k Views 5 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.
    • U Offline
      UjwalReddy267
      last edited by

      This module is supposed to show a slideshow of the two images that are given in the variablle loc. But, I am not able to update the Dom. It does not change the image. The setInterval function does not seem to be working.

      Module.register("MMM-Test",{
                      default: {loc: ["modules/MMM-Test/test1.jpg","modules/MMM-Test/test.jpg"], count:0},
      		start : function(){
      				setInterval(function() {this.updateDom()}, 1000);
      		},
      		getDom : function (){
                              var wrapper = document.createElement('div')
      			wrapper.id = 'FULL'
      			var img = document.createElement('div')
      			var i = this.config.count
                              img.style.backgroundImage = 'url(' + this.config.loc[i] + ')'
      			img.id = 'photo'
              		var blr = document.createElement('div')
      			blr.id = 'backgrnd'
      			blr.style.backgroundImage = 'url(' + this.config.loc[i] + ')'
      			wrapper.appendChild(blr)
      			wrapper.appendChild(img)
      			this.config.count = (this.config.count + 1) % 2
                              return wrapper
                      },
      		getStyles : function (){
      			return ['MMM-Test.css']
      		}
      })
      
      lavolp3L S 2 Replies Last reply Reply Quote 0
      • C Offline
        CreepinJesus
        last edited by

        This post is deleted!
        lavolp3L 1 Reply Last reply Reply Quote 0
        • lavolp3L Offline
          lavolp3 Module Developer @CreepinJesus
          last edited by

          @CreepinJesus said in Help with updateDom():

          I think (may be wrong) the config is read only inside the module,

          that’s not true. The config values can be manipulated.

          How to troubleshoot modules
          MMM-soccer v2, MMM-AVStock

          lavolp3L 1 Reply Last reply Reply Quote 1
          • lavolp3L Offline
            lavolp3 Module Developer @UjwalReddy267
            last edited by lavolp3

            @UjwalReddy267
            I would do this:
            the count variable out of defaults and into this. Then count it up in getdom.

            Module.register("MMM-Test",{
                            default: {loc: ["modules/MMM-Test/test1.jpg","modules/MMM-Test/test.jpg"]},
                            count: 0,
            		start : function(){
            				setInterval(function() {this.updateDom()}, 1000);
            		},
            		getDom : function (){
                                    var wrapper = document.createElement('div')
            			wrapper.id = 'FULL'
            			var img = document.createElement('div')
            			var i = this.count
                                    img.style.backgroundImage = 'url(' + this.config.loc[i] + ')'
            			img.id = 'photo'
                    		var blr = document.createElement('div')
            			blr.id = 'backgrnd'
            			blr.style.backgroundImage = 'url(' + this.config.loc[i] + ')'
            			wrapper.appendChild(blr)
            			wrapper.appendChild(img)
            			this.count = (this.count + 1) % 2
                                    return wrapper
                            },
            		getStyles : function (){
            			return ['MMM-Test.css']
            		}
            })
            ``

            How to troubleshoot modules
            MMM-soccer v2, MMM-AVStock

            lavolp3L 1 Reply Last reply Reply Quote 0
            • lavolp3L Offline
              lavolp3 Module Developer @lavolp3
              last edited by lavolp3

              @lavolp3 are you sure the image url is correct?
              I would always for debugging purposes print that out once.

              console.log('url(' + this.config.loc[i] + ')');
              console.log(this.count)
              

              Or check the dev console for errors not finding the pictures.

              How to troubleshoot modules
              MMM-soccer v2, MMM-AVStock

              1 Reply Last reply Reply Quote 0
              • S Away
                sdetweil @UjwalReddy267
                last edited by sdetweil

                @UjwalReddy267 your pointer ‘this’ is wrong inside the timer handle

                setInterval(function() {this.updateDom()
                

                you need to do

                var self=this
                

                and in the handler use self instead

                setInterval(function() {self.updateDom()
                

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                lavolp3L U 3 Replies Last reply Reply Quote 0
                • lavolp3L Offline
                  lavolp3 Module Developer @lavolp3
                  last edited by

                  @lavolp3 NOw I have the error, I think!

                  the thisin the interval might refer to another this and not to the original module-this
                  So you need to do the following in start:

                  start : function(){
                                                  var self = this;
                  				setInterval(function() {self.updateDom()}, 1000);
                  		},

                  How to troubleshoot modules
                  MMM-soccer v2, MMM-AVStock

                  1 Reply Last reply Reply Quote 0
                  • lavolp3L Offline
                    lavolp3 Module Developer @sdetweil
                    last edited by

                    @sdetweil You were faster sam!

                    How to troubleshoot modules
                    MMM-soccer v2, MMM-AVStock

                    1 Reply Last reply Reply Quote 0
                    • U Offline
                      UjwalReddy267 @sdetweil
                      last edited by

                      This post is deleted!
                      1 Reply Last reply Reply Quote 0
                      • U Offline
                        UjwalReddy267 @sdetweil
                        last edited by

                        @sdetweil said in Help with updateDom():

                        @UjwalReddy267 your pointer ‘this’ is wrong inside the timer handle

                        setInterval(function() {this.updateDom()
                        

                        you need to do

                        var self=this
                        

                        and in the handler use self instead

                        setInterval(function() {self.updateDom()
                        

                        Yes, that was the error, thank you it works now.

                        1 Reply Last reply Reply Quote 0
                        • 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