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_control.html 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <script type="text/javascript">
  2. (function () {
  3. // convert to i18 text
  4. function c_ (x) {
  5. return RED._('@flowfuse/node-red-dashboard/ui-control:ui-control.' + x)
  6. }
  7. RED.nodes.registerType('ui-control', {
  8. category: RED._('@flowfuse/node-red-dashboard/ui-base:ui-base.label.category'),
  9. color: RED._('@flowfuse/node-red-dashboard/ui-base:ui-base.colors.darkest'),
  10. defaults: {
  11. name: { value: '' },
  12. ui: { type: 'ui-base', value: '', required: true },
  13. events: { value: 'all' }
  14. },
  15. inputs: 1,
  16. outputs: 1,
  17. align: 'right',
  18. icon: 'font-awesome/fa-arrow-circle-right',
  19. paletteLabel: 'ui control',
  20. label: function () { return this.name || 'ui control' },
  21. labelStyle: function () { return this.name ? 'node_label_italic' : '' },
  22. outputLabels: function () { return this.events },
  23. oneditprepare: function () {
  24. const node = this
  25. const sel = $('#node-input-events')
  26. for (const name of ['all', 'change', 'connect']) {
  27. const text = c_('events.' + name)
  28. $('<option/>').val(name).text(text).appendTo(sel)
  29. }
  30. $(sel).val(node.events)
  31. }
  32. })
  33. })()
  34. </script>
  35. <script type="text/html" data-template-name="ui-control">
  36. <div class="form-row">
  37. <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="ui-control.label.name"></span></label>
  38. <input type="text" id="node-input-name" data-i18n="[placeholder]ui-control.placeholder.name">
  39. </div>
  40. <div class="form-row">
  41. <label for="node-input-ui"><i class="fa fa-bookmark"></i> UI</label>
  42. <input type="text" id="node-input-ui">
  43. </div>
  44. <div class="form-row">
  45. <label for="node-input-events"><i class="fa fa-sign-out"></i> <span data-i18n="ui-control.label.output"></span></label>
  46. <select id="node-input-events" style="width:70%;">
  47. </select>
  48. </div>
  49. </script>