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.

    Need help sending a notification after a click event

    Scheduled Pinned Locked Moved Solved Troubleshooting
    5 Posts 2 Posters 3.5k Views 1 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.
    • J Offline
      jason02
      last edited by jason02

      Hi All,

      I have a button on my magic mirror. When I click the button, I want it to send a notification to another module so that it can perform an action.

      Here’s a snippet of what I have so far, sorry if i’m way off, not really great at javascript :S

      getDom: function() {
      	var wrapper = document.createElement("div");
      	var button = document.createElement("div");	
              var text = document.createElement("span");	
               text.innerHTML = 'click me';
              button.appendChild(text);
      	wrapper.appendChild(button);
      
      	$(button).on("click", function(){
                            this.sendNotification("BUTTON_PRESSED", {});
      	});
                   return wrapper;
                  }
           });
      

      When I execute this code, I get an error, ‘this.sendNotification is not a function’. So obviously I’m trying to call that function when it is not in scope. But I don’t really know of another way to wire up the button click to the send notification function. Any ideas anyone?

      Thanks!

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

        A button connected to the gpio of the raspberry?

        Then you’ll need either the MMM-button or MMM-buttons modules to read the state from the gpio.

        1 Reply Last reply Reply Quote 0
        • J Offline
          jason02
          last edited by

          Actually this isn’t a button connected to the gpio of the raspberry. This is literally a button displayed on the screen of the raspberry pi

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

            Ohh okey,
            I’m no coder myself, but,

            Try this one :

            getDom: function() {
            
                    var self = this;
            	var wrapper = document.createElement("div");
                    var text = document.createElement("span");	
                    text.innerHTML = 'click me';
                    text.addEventListener("click", () => button());
            
            	function button(){
                         self.sendNotification("BUTTON_PRESSED", {});
                         text.innerHTML = "You clicked me!";
            	};
            
                    return wrapper;
                    }
               });
            
            

            I’m at work so I can’t try this right now, but, give it a go

            1 Reply Last reply Reply Quote 0
            • J Offline
              jason02
              last edited by

              Thanks for your input, I modified it a bit to get the result I wanted! Works like a charm!

              getDom: function() {
              	var wrapper = document.createElement("div");
              	var button = document.createElement("div");
              	var text = document.createElement("span");
              	var hidden = true;		
              	button.className = "hide-toggle";
              	text.innerHTML = this.config.caption;
              	text.addEventListener("click", () => this.sendNotification("BUTTON_PRESSED", {}));
                button.appendChild(text);
                wrapper.appendChild(button);
              	return wrapper;
              }
              
              1 Reply Last reply Reply Quote 0
              • 1 / 1
              • 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