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.

    Making text etc clickable

    Scheduled Pinned Locked Moved Development
    14 Posts 3 Posters 10.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.
    • strawberry 3.141S Offline
      strawberry 3.141 Project Sponsor Module Developer @broberg
      last edited by

      @broberg what about this?

      this.interval = setInterval(function() {
          self.activeItem++;
          self.updateDom(self.config.animationSpeed);
        }, this.config.updateInterval);
      

      Please create a github issue if you need help, so I can keep track

      brobergB 1 Reply Last reply Reply Quote 1
      • brobergB Offline
        broberg Project Sponsor @strawberry 3.141
        last edited by

        @strawberry-3.141

        using that code snippet in the pause function just adds a new item with the updateInterval time,

        So I can change the interval on the next loaded news item, but not the current :(

        1 Reply Last reply Reply Quote 0
        • brobergB Offline
          broberg Project Sponsor
          last edited by broberg

          so after strawberry-pi explained the last snippet of code I got it to work,
          Big thanks for the patience!

          These are the changes I’ve made so far, please consider that the code is probably not optimal, at all.

           			var title = document.createElement("div");
          			title.className = "bright medium regular fed";
          			title.innerHTML = this.newsItems[this.activeItem].title;
          			title.addEventListener("click", () => showdesc(this)); //Show description on click
          			wrapper.appendChild(title);
          			
          
          			//below is the function to show description and hide title
          			function showdesc(thisdesc) {
          				
          				thisdesc.intpause();	//pause the interval			
          				title.style.display="none";
          				description = document.createElement("div");
          				description.className = "medium light infoCenter";
          				description.innerHTML = thisdesc.newsItems[thisdesc.activeItem].description;
          				description.addEventListener("click", () => hidedesc(thisdesc));  //Hide description on click 
          				wrapper.appendChild(description);
          			};
          
          			//and to close the description and return to title
          			function hidedesc(thisdesc) {
          				thisdesc.intresume();	//resume the interval
          				description.style.display="none";
          				title.style.display="block";
          				
          			};
          1 Reply Last reply Reply Quote 0
          • brobergB Offline
            broberg Project Sponsor
            last edited by broberg

            Changes to the scheduleUpdateInterval

            	scheduleUpdateInterval: function() {
            		var self = this;
            
            		self.updateDom(self.config.animationSpeed);
            
            		// setInterval placed within a variable so you can clear it
            		this.interval = setInterval(function() {
            			self.activeItem++;
            			self.updateDom(self.config.animationSpeed);
            		}, this.config.updateInterval);
            	},
            
            

            And some functions to start and stop the interval

            	intpause: function(){
            		clearInterval(this.interval);
            
            	},
            
            	intresume: function(){
            		this.scheduleUpdateInterval();
            	},
            
            
            1 Reply Last reply Reply Quote 0
            • brobergB Offline
              broberg Project Sponsor
              last edited by

              Next up, adding a timer to the description that doesn’t mess with the news items that is next in line,
              Tried one version, but it couldn’t handle multiple start/stop clicks.

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