• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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.

Timer on Module

Scheduled Pinned Locked Moved Unsolved Troubleshooting
22 Posts 4 Posters 5.9k 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.
  • D Offline
    dsmtweaker @sdetweil
    last edited by Dec 19, 2018, 9:18 PM

    @sdetweil I made all the corrections noted.

    but on if (noti == “DOM_OBJECT_CREATED”) this.job() I am still getting the error SyntaxError: Invalid or unexpected token

    M S 2 Replies Last reply Dec 19, 2018, 10:36 PM Reply Quote 0
    • M Offline
      Mykle1 Project Sponsor Module Developer @dsmtweaker
      last edited by Dec 19, 2018, 10:36 PM

      @dsmtweaker said in Timer on Module:

      but on if (noti == “DOM_OBJECT_CREATED”) this.job() I am still getting the error SyntaxError: Invalid or unexpected token

      Excuse me for jumping in but the curly quotes containing DOM_OBJECT_CREATED will cause that error. Try:

      if (noti == "DOM_OBJECT_CREATED") this.job()

      The difference is slight, but enough.

      Create a working config
      How to add modules

      1 Reply Last reply Reply Quote 0
      • S Away
        sdetweil @dsmtweaker
        last edited by Dec 19, 2018, 11:30 PM

        @dsmtweaker its the darned cut/paste of the double quotes… in the web posting it shows the MS word document style quotes which cause an error with the javascript parser…

        overtype those double quotes with the text editor…

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 1
        • ? Offline
          A Former User
          last edited by A Former User Dec 20, 2018, 7:40 AM Dec 20, 2018, 7:39 AM

          I’m back. Sorry for my prior mistypo and unsufficient post. I was typing that on my phone.

          start: function() {
            this.timer = null  
            this.videoDom = null
          },
          getDom: function() {
            var container =  document.createElement("div")
            var video = document.createElement("video")
            video.id = "VIDEO"
            video.style.display = "none"
            video.autoplay = true
            video.loop = this.config.loop
            container.appendChild(video)
            this.videoDom = video
            return container 
          // Just create DOMs in getDom(). It's better to control DOMs outside of getDom().
          },
          notificationReceived: function(noti, payload, sender) {
            if (noti == "DOM_OBJECT_CREATED") this.work()
          //DOM_OBJECT_CREATED would be the best time to start your job. Your DOM would be created and be ready to work on that message.
          },
          work: function(src = null, interval = null) {
            clearTimer(this.timer)
            interval = (interval) ? interval : this.config.interval
            src = (src) ? src : this.config.videoSRC
            this.playVideo(src)
            this.timer = setTimeout(()=>{
              this.work()
            }, interval)
          //setTimeout is better than setInterval.
          // you can repeat this function by interval. you can change interval and src with parameters of this function.
          },
          playVideo: function(src) {
            this.videoDom.src = src
            if (this.videoDom.style.display == "none") this.videoDom.style.display = "block"
            this.videoDom.play()
            // assign src to your videoDom and play it.
          }
          

          Not tested on real device, so maybe somthig is missed, but this is basic approach.
          I didn’t use updateDom because there is no need to redraw whole module just for playing video.

          D 1 Reply Last reply Dec 20, 2018, 2:13 PM Reply Quote 0
          • D Offline
            dsmtweaker @Guest
            last edited by Dec 20, 2018, 2:13 PM

            @sean Thank you, and everyone else for all the help. It’s refreshing to find a forum that doesn’t automatically start bashing beginners.

            I think my knowledge is just not ready for something this advanced yet. I used your code, and tried changes here and there to make it work, but still no luck. I am no longer getting any errors in the console. But nothing happens(ie- no video ever loads/plays) this is where I got the code so far…

            Module.register(“MMM-htmlvideo”,{

            // Default module config.
            defaults: {
            	videoSRC: 'https://www.mid-americantitle.com/wp-content/uploads/output_HD7205.mp4',
            	loop: true,
            		},
            
            // get stylesheet
            getStyles: function() {
            	return ["htmlvideo.css"];
            },
            
            
            
            start: function() {
              this.timer = null  
              this.videoDom = null
            },
            getDom: function() {
             var container =  document.createElement("div")
             var video = document.createElement("video")
             video.src = this.config.videoSRC;
            video.id = "VIDEO"
            video.style.display = "none"
            video.autoplay = true
             video.loop = this.config.loop
             container.appendChild(video)
             this.videoDom = video
             return container 
            // Just create DOMs in getDom(). It's better to control DOMs outside of getDom().
            },
            notificationReceived: function(noti, payload, sender) {
             if (noti == "DOM_OBJECT_CREATED") this.work()
            //DOM_OBJECT_CREATED would be the best time to start your job. Your DOM would be created and be ready to work on that message.
            },
            work: function(src = null, interval = null) {
             clearTimer(this.timer)
             interval = (interval) ? interval : 30000
             src = (src) ? src : this.config.videoSRC
              this.playVideo(src)
              this.timer = setTimeout(()=>{
               this.work()
              }, interval)
            //setTimeout is better than setInterval.
            // you can repeat this function by interval. you can change interval and src with parameters of this function.
            },
            playVideo: function(src) {
            this.videoDom.src = src
             if (this.videoDom.style.display == "none") this.videoDom.style.display = "block"
              this.videoDom.play()
              // assign src to your videoDom and play it.
            },
            
            });
            

            I tried changing “interval” with actual numbers, as well as changing the source in multiple locations. Still just get a black screen.

            ? 1 Reply Last reply Dec 20, 2018, 2:38 PM Reply Quote 0
            • ? Offline
              A Former User @dsmtweaker
              last edited by A Former User Dec 20, 2018, 2:38 PM Dec 20, 2018, 2:38 PM

              @dsmtweaker
              Sorry there were another mistypes. DOM_OBJECT_CREATED => DOM_OBJECTS_CREATED (and clearTimer => clearTimeout)

              use this. tested.

              Module.register("test",{
                defaults: {
                  videoSRC: 'https://www.mid-americantitle.com/wp-content/uploads/output_HD7205.mp4',
                  loop: true,
                  interval: 36000,
                },
              
                start: function() {
                  this.timer = null
                  this.videoDom = null
                },
              
                getDom: function() {
                  var container =  document.createElement("div")
                  var video = document.createElement("video")
                  video.id = "VIDEO"
                  video.style.display = "none"
                  video.autoplay = true
                  video.loop = this.config.loop
                  container.appendChild(video)
                  this.videoDom = video
                  return container
                },
                notificationReceived: function(noti, payload, sender) {
                  if (noti == "DOM_OBJECTS_CREATED") this.work()
                },
                work: function(src = null, interval = null) {
                  clearTimeout(this.timer)
                  interval = (interval) ? interval : this.config.interval
                  src = (src) ? src : this.config.videoSRC
                  this.playVideo(src)
                  this.timer = setTimeout(()=>{
                    this.work()
                  }, interval)
                },
                playVideo: function(src) {
                  this.videoDom.src = src
                  if (this.videoDom.style.display == "none") this.videoDom.style.display = "block"
                  this.videoDom.play()
                },
              })
              

              Anyway, your video is already repeating by loop: true, why you need to repeat it with timer?

              D 2 Replies Last reply Dec 20, 2018, 9:15 PM Reply Quote 0
              • D Offline
                dsmtweaker @Guest
                last edited by Dec 20, 2018, 9:15 PM

                @sean You are a genius, thank you so much.

                Extra bonus, do you know of anyway to use a local source, instead of a web source?

                IE- videoSRC: “/home/pi/content/videos/video1.mp4”

                It’s not necessary, I just figured running something locally instead of from the web
                would help reduce lag/buffer/tearing etc.

                ? 1 Reply Last reply Dec 20, 2018, 9:21 PM Reply Quote 0
                • D Offline
                  dsmtweaker @Guest
                  last edited by Dec 20, 2018, 9:20 PM

                  @sean said in Timer on Module:

                  Anyway, your video is already repeating by loop: true, why you need to repeat it with timer?

                  Because I don’t want it to loop. I want it to play in intervals. Like maybe every 15 minutes it runs the video(once)

                  1 Reply Last reply Reply Quote 0
                  • ? Offline
                    A Former User @dsmtweaker
                    last edited by Dec 20, 2018, 9:21 PM

                    @dsmtweaker
                    If your local content locates under MagicMirror and it’s sub directory, you can contact via http.
                    ~/MagicMirror/YOUR_RESOURCE => http://localhost:8080/YOUR_RESOURCE
                    ~/MagicMirror/modules/MMM-SOMETHING/SOMEWHERE/SOME => http://localhost:8080/modules/MMM-SOMETHING/SOMEWHERE/SOME

                    But other location… hmmm I’m not sure whether symbolic_link would work. If not so, you need another approach. - more complex… just to move your content under MagicMirror would be simpler.

                    1 Reply Last reply Reply Quote 0
                    • 1
                    • 2
                    • 3
                    • 2 / 3
                    2 / 3
                    • First post
                      18/22
                      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