Node-Red configuration
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ui_button.html 1.9KB

1234567891011121314151617181920
  1. <script type="text/html" data-help-name="ui_button">
  2. <p>Adds a button to the user interface.</p>
  3. <p>Clicking the button generates a message with <code>msg.payload</code> set to the <b>Payload</b> field.
  4. If no payload is specified, the node id is used.</p>
  5. <p>The <b>Size</b> defaults to 3 by 1.</p>
  6. <p>The <b>Icon</b> can be defined, as either a <a href="https://klarsys.github.io/angular-material-icons/" target="_blank">Material Design icon</a>
  7. <i>(e.g. 'check', 'close')</i> or a <a href="https://fontawesome.com/v4.7.0/icons/" target="_blank">Font Awesome icon</a>
  8. <i>(e.g. 'fa-fire')</i>, or a <a href="https://github.com/Paul-Reed/weather-icons-lite/blob/master/css_mappings.md">Weather icon</a>.
  9. You can use the full set of google material icons if you add 'mi-' to the icon name. e.g. 'mi-videogame_asset'.</p>
  10. <p>The colours of the text and background may be set. They can also be set by a message property by setting
  11. the field to the name of the property, for example <code>{{background}}</code>.
  12. You don't need to prepend the <i>msg.</i> part of the property name.</p>
  13. <p>The label and icon can also be set by a message property by setting
  14. the field to the name of the property, for example <code>{{topic}}</code> or <code>{{myicon}}</code>.</p>
  15. <p>If set to pass through mode a message arriving on the input will act like pressing the button.
  16. The output payload will be as defined in the node configuration.</p>
  17. <p>The incoming <b>topic</b> field can be used to set the <code>msg.topic</code> property that is output.</p>
  18. <p>Setting <code>msg.enabled</code> to <code>false</code> will disable the button.</p>
  19. <p>If a <b>Class</b> is specified, it will be added to the parent card. This way you can style the card and the elements inside it with custom CSS. The Class can be set at runtime by setting a <code>msg.className</code> string property.</p>
  20. </script>