# \[ANNOUNCE\]node-red-contrib-button-events: beta preview

**URL:** <https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668>\
**Category:** Share Your Nodes\
**Created:** [2 October 2020 11:50 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668 "2020-10-02T11:50:36Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [2 October 2020 11:50 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/1 "2020-10-02T11:50:37Z")

</div>

Hi folks,

The lady of the house asked me to install some LED strips in the house, but those also have to be controllable via physical hardware switches.

So I started looking around about reading a physical button from Node-RED. The only thing I found were some nice [flows](https://discourse.nodered.org/t/single-button-multiple-press-options-new-thread-see-link-in-first-post/20559) flows from @Trying_to_learn. However I was looking for a single node, to keep my flows simple. I must admit I was "very" surprised that I found none, in an active IOT community like this one. Perhaps it already exists, and I used the wrong keywords during my search...

Anyway I have now developed my own one now: [node-red-contrib-button-events](https://github.com/bartbutenaers/node-red-contrib-button-events). 🍾 🥳

It can be wired to a GPIO-in node, and can detect all kind of button events:

- _ **pressed** _: when a button is pressed and held down.
- _ **clicked** _: when a button is pressed and released rapidly.
- _ **clicked\_pressed** _: when a click is quickly followed by pressing and holding the button.
- _ **double\_clicked** _: when a click is quickly followed with another click.
- _ **released** _: when the pressed button is released.

I would like to thank Bryan Nielsen. I found his [rpi-gpio-buttons](https://github.com/bnielsen1965/rpi-gpio-buttons) and asked him whether I could have a separate button event detection library, without the gpio stuff (since we already have that inside the gpio nodes). The next day he offered me already his [button-events](https://www.npmjs.com/package/button-events) library. What a support 👍

It would be nice to get some '_constructive_' feedback before I publish it on npm.

Have fun with it!!  
Bart

---

<div class="post-metadata">

**Author:** ![janvda](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/janvda/32/234_2.png) [@janvda](https://discourse.nodered.org/u/janvda)\
**Post date:** [2 October 2020 12:53 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/2 "2020-10-02T12:53:27Z")

</div>

Always nice to read your readmes.  
... far above the average readmes circulating on the net.

One little typo:

> Indeed otherwise all the switch values will travel through Node-RED from the gpio-in node to this node, and we would through them away here.

"through" must be "throw".

For the rest it looks perfect to me.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [2 October 2020 22:47 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/3 "2020-10-02T22:47:40Z")

</div>

Hmm, interesting, I have some proximity buttons. I normally avoid attaching electronics to the Pi's but as I'm moving away from the Pi's for my main platform, it could be useful to have a proximity switch on a Pi.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [3 October 2020 10:44 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/4 "2020-10-03T10:44:07Z")

</div>

This could be very useful for all sorts of inputs, not just GPIO pins. For example it could be connected to dashboard buttons, or MQTT inputs. I use some Sonoff devices with touch buttons that I need to detect such events and at the moment do it with Trigger nodes etc. For me it would be useful if the input values could be configured to other values such as "On"/"Off". It would not need the Idle value field if that were provided.

I am not able to test it at the moment (I will later when I have some time). Why does it wait after the first release before generating a clicked event? I would want it to generate that immediately and also generate the double click event on the second release if there is one.

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [3 October 2020 11:35 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/5 "2020-10-03T11:35:01Z")

</div>

minor Doc error - should say double-clicked

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/c/9c19db0723cfbff84aa3a9ee5c062206a8fe0d98.png)

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [3 October 2020 11:38 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/6 "2020-10-03T11:38:05Z")

</div>

> [@Colin](#):
>
> Why does it wait after the first release before generating a clicked event?

The idea behind things like this is to mask the click event if its part of a more complicated event such as a double-click

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [3 October 2020 13:03 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/7 "2020-10-03T13:03:21Z")

</div>

Having thought further about my previous comment I see there would be problems if it produced both click and double click, as it would be difficult for those not wanting both events to filter out the click, so the node would have to provide the option for the existing behaviour, so my suggestion on that front probably isn't worth pursuing.

Also I have realised that it cannot be used with the dashboard button as that doesn't provide a release action. I don't know whether there is a technical reason for this or if it just hasn't been provided.

The suggestion of configurable input values would be helpful to me though.

Another feature that would be useful would be to have the events on separate outputs which would often save a switch node. I suppose that might be a major change to the config i/f though, as probably one would need to have something like the Switch node config where you could add outputs and configure each with the type of event.

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [3 October 2020 21:43 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/8 "2020-10-03T21:43:19Z")

</div>

Could we have a checkbox to enable/disable the released event as well please?

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [3 October 2020 21:57 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/9 "2020-10-03T21:57:54Z")

</div>

Hey guys,  
Thanks!! This is the kind of feedback that we - as node developers - really appreciate with a beta version, because it is rather difficult to change it when it is released ...

> [@Colin](#):
>
> useful if the input values could be configured to other values such as "On"/"Off". It would not need the Idle value field if that were provided.

I have implemented your request (on Github):

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/6/e68db3ac7a05a2b5569d9fd8d3d82616ea6fdfbd.png)

So now you have to specify which values will arrive when the button is down (pressed/clicked) or when it is up (unused). This indeed allowed me to remove the _"Idle value"_.

> [@Colin](#):
>
> Why does it wait after the first release before generating a clicked event?

As simon already mentioned: it will wait for the _"Clicked"_ time interval to see whether the button is immediately being clicked again afterwards (resulting in 1 double-click event instead of 2 separate click events). If you don't want that, you will have to set the _"Clicked"_ time interval to `0` milliseconds. Then you will get your 'clicked' event immediately when you have released your button:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/3/9341640a7beb5883cf2edc6e7ab5b4d8d31c33c9.png)

> [@cymplecy](#):
>
> minor Doc error - should say double-clicked

I have corrected it. You guys see everything...

It took me a couple of hours to figure out when which event was triggered by Bryan's state machine, and to draw it in a timeline. But I think/hope it was worth all the effort, because it was not clear to me how it worked in the beginning...

> [@Colin](#):
>
> it cannot be used with the dashboard button as that doesn't provide a release action.

Indeed. In the test flow on my readme page, you will see that I use one button to produce zero's en one button to produce one's. But that is indeed a bit cheating. A button that would keep being pressed would have been nicer ...

> [@Colin](#):
>
> Another feature that would be useful would be to have the events on separate outputs which would often save a switch node. I suppose that might be a major change to the config i/f though, as probably one would need to have something like the Switch node config where you could add outputs and configure each with the type of event.

I have been playing with that idea also last week, since I also want to avoid as much Switch nodes as possible. But when I add an output port per event, then my node becomes rather big and heavy:

![button_events_outputs](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/7/f7a8b0f6ec28d7e42656dd8254d98d171db40bb4.gif)

So I don't think we would gain much with this design ...

> [@cymplecy](#):
>
> Could we have a checkbox to enable/disable the released event as well please?

I'm not sure whether I understand it correctly, because there is already a checkbox on the config screen:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/6/06cb6e131815ede72afa86bf5769c9502e094315.png)

You mean something else?

My time is up for today. Have to work tomorrow morning for my daily job 😖

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [3 October 2020 21:59 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/10 "2020-10-03T21:59:59Z")

</div>

I didn't scroll down 🙂

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/d/cdbe8fa9c80995dcde1274a0ad25d2870bccd023.jpeg)

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [3 October 2020 22:04 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/11 "2020-10-03T22:04:22Z")

</div>

Maybe get rid of the input or output choice fields or move them right to bottom

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [4 October 2020 07:01 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/12 "2020-10-04T07:01:40Z")

</div>

> [@BartButenaers](#):
>
> Have to work tomorrow morning for my daily job 😖

Work done. Was lucky because the systems were behaving well... The weekend can continue now at last ...

> [@cymplecy](#):
>
> get rid of the input or output choice fields

Those fields are very useful to reduce the number of Change nodes in the flows of my users, and they also allow people to avoid overwriting the original input by my event information (so the original input message will be extended instead of overwritten). That is why I'm not going to remove them ...

And indeed I could move them to the bottom of the config screen, since they are as relevant as the event checkboxes. But then I'm afraid that some people won't know that they exist. Because some kind of users don't know that there is a scrollbar to show all the options 🤣

But good that you mention this! Because seemed I had forgotten the basic rule: don't create a new message, but reuse the input message... However some functionality is missing in the button-events library to accomplish this, so I have create a [feature request](https://github.com/bnielsen1965/button-events/issues/1) for Bryan.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [4 October 2020 07:39 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/13 "2020-10-04T07:39:18Z")

</div>

> [@BartButenaers](#):
>
> when I add an output port per event, then my node becomes rather big and heavy

That is true if you provide them all every time. I was thinking you could use something like the Switch node GUI where you select what you want on each output, and outputs are only added when the user configures them, so typically an individual use case would require only two or three outputs. That would be a significant rework of the GUI code though, so maybe not worth the effort.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [4 October 2020 09:17 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/14 "2020-10-04T09:17:39Z")

</div>

...but would be a much more usable imho. In that you would need the out parameter, and the options for each pin become a simple select, rather than a large list of check boxes, And saves the subsequent switch.

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [4 October 2020 09:42 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/15 "2020-10-04T09:42:42Z")

</div>

Maybe move Name field to the bottom then?

And/or change layout of check-boxes to a 2D grid

---

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [4 October 2020 09:52 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/16 "2020-10-04T09:52:56Z")

</div>

I was wanting to measure duration timing so added a timestamp to the input to the node but it stripped it off

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/a/ba4e7b83853235aae574092cf8956019edd49c9d.png)

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [4 October 2020 22:32 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/17 "2020-10-04T22:32:43Z")

</div>

> [@BartButenaers](#):
>
> Work done. Was lucky because the systems were behaving well... The weekend can continue now at last ...

Damn. Seemed after all that the servers at work had a bad day.  
So a large part of my sunday was ruined 🤬

> [@Colin](#):
>
> you could use something like the Switch node GUI where you select what you want on each output, and outputs are only added when the user configures them, so typically an individual use case would require only two or three outputs. That would be a significant rework

Hmm, seems Dave agrees with you. Damn again.  
But indeed looks better. Although had to rewrite a major part of this node...  
Anyway it was worth the effort:

![button_events_list](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/8/f8c7b800d0039f228de612ebef46a70f02dafd0a.gif)

And then the output labels are automatically updated:

![button_events_labels](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/d/bdce6df784030801614743ec9cc9423fe7460d3b.gif)

This version is now available on Github...

> [@cymplecy](#):
>
> Maybe move Name field to the bottom then?

Well there was a [discussion](https://discourse.nodered.org/t/editing-nodes-inconsistency-where-the-name-is/33481/10) about that already last week.  
But - due to the editableList instead of the checkboxes - the config screen has become smaller, so hopefully the name field is not annoying for you anymore.

> [@cymplecy](#):
>
> I was wanting to measure duration timing so added a timestamp to the input to the node but it stripped it off

Yes indeed that is what I was talking about:

> But good that you mention this! Because seemed I had forgotten the basic rule: don't create a new message, but reuse the input message... However some functionality is missing in the button-events library to accomplish this, so I have create a [feature request](https://github.com/bnielsen1965/button-events/issues/1) for Bryan.

That feature request should be implemented before I can continue reusing the input message.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [5 October 2020 08:19 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/18 "2020-10-05T08:19:24Z")

</div>

Great stuff, I can see me refactoring some of my flows as soon as the spec is stable (well stable enough that it is released anyway).

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [5 October 2020 09:52 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/19 "2020-10-05T09:52:48Z")

</div>

Not sure about that icon though 🙂 hopefully just an artefact of the "video". Also the icon colour is a bit close to exec node with it's multiple outputs for me but... yes altogether much better.

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [5 October 2020 10:21 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668/20 "2020-10-05T10:21:03Z")

</div>

> [@dceejay](#):
>
> ust an artefact of the "video"

Nope it is also in my flow editor. Not sure why ...

> [@dceejay](#):
>
> Also the icon colour is a bit close to exec node with it's multiple outputs

Ok. Perhaps I should use the same color as the gpio nodes?

[Next page](https://discourse.nodered.org/t/announce-node-red-contrib-button-events-beta-preview/33668.md?page=2)