Merge pull request #239 from FlowFuse/223-textinput-topic

Add "topic" option for a Text Input
FlowFuse · Oct 4, 2023 · f4352f6 · f4352f6
2 parents bbb87d9 + ea7fa0a
commit f4352f6
Showing 1 changed file with 16 additions and 0 deletions.
diff --git a/nodes/widgets/ui_text_input.html b/nodes/widgets/ui_text_input.html
@@ -1,5 +1,8 @@
 <script type="text/javascript">
     (function () {
+        function hasProperty (obj, prop) {
+            return Object.prototype.hasOwnProperty.call(obj, prop)
+        }
         RED.nodes.registerType('ui-text-input', {
             category: RED._('@flowforge/node-red-dashboard/ui-base:ui-base.label.category'),
             color: 'rgb(176, 223, 227)',
@@ -20,6 +23,8 @@
                     }
                 },
                 height: { value: 0 },
+                topic: { value: 'topic', validate: (hasProperty(RED.validators, 'typedInput') ? RED.validators.typedInput('topicType') : function (v) { return true }) },
+                topicType: { value: 'msg' },
                 mode: { value: 'text', required: true },
                 passthru: { value: true },
                 className: { value: '' }
@@ -35,6 +40,12 @@
                     height: '#node-input-height',
                     group: '#node-input-group'
                 })
+                // topic
+                $('#node-input-topic').typedInput({
+                    default: 'str',
+                    typeField: $('#node-input-topicType'),
+                    types: ['str', 'msg', 'flow', 'global']
+                })
 
                 // use jQuery UI tooltip to convert the plain old title attribute to a nice tooltip
                 $('.ui-node-popover-title').tooltip({
@@ -101,6 +112,11 @@
         <!--<label for="node-input-delay" style="text-align:right; width:100px"><i class="fa fa-clock-o"></i> Delay (ms)</label>
         <input type="text" style="width:58px" id="node-input-delay">-->
     </div>
+    <div class="form-row">
+        <label for="node-input-topic" style="padding-left:25px; margin-right:-25px">Topic</label>
+        <input type="text" id="node-input-topic">
+        <input type="hidden" id="node-input-topicType">
+    </div>
     <div class="form-row">
         <label style="width:auto" for="node-input-passthru"><i class="fa fa-arrow-right"></i> If <code>msg</code> arrives on input, pass through to output: </label>
         <input type="checkbox" checked id="node-input-passthru" style="display:inline-block; width:auto; margin-top: 0; margin-left: 3px;">