Merge pull request #3533 from Steve-Mcl/filename-typedinput

Feature: Change basic Filename field to a typedInput

packages/node_modules/@node-red/nodes/core/storage/10-file.html

@@ -3,6 +3,7 @@
     <div class="form-row node-input-filename">
          <label for="node-input-filename"><i class="fa fa-file"></i> <span data-i18n="file.label.filename"></span></label>
          <input id="node-input-filename" type="text">
+         <input type="hidden" id="node-input-filenameType">
     </div>
     <div class="form-row">
         <label for="node-input-overwriteFile"><i class="fa fa-random"></i> <span data-i18n="file.label.action"></span></label>
@@ -29,7 +30,7 @@
     </div>
     <div class="form-row">
         <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
-        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
+        <input type="text" id="node-input-name">
     </div>
     <div class="form-tips"><span data-i18n="file.tip"></span></div>
 </script>
@@ -37,7 +38,8 @@
 <script type="text/html" data-template-name="file in">
     <div class="form-row">
          <label for="node-input-filename"><i class="fa fa-file"></i> <span data-i18n="file.label.filename"></span></label>
-         <input id="node-input-filename" type="text" data-i18n="[placeholder]file.label.filename">
+         <input id="node-input-filename" type="text">
+         <input type="hidden" id="node-input-filenameType">
     </div>
     <div class="form-row">
         <label for="node-input-format"><i class="fa fa-sign-out"></i> <span data-i18n="file.label.outputas"></span></label>
@@ -60,7 +62,7 @@
     </div>
     <div class="form-row">
         <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
-        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
+        <input type="text" id="node-input-name">
     </div>
     <div class="form-tips"><span data-i18n="file.tip"></span></div>
 </script>
@@ -196,7 +198,8 @@
         category: 'storage',
         defaults: {
             name: {value:""},
-            filename: {value:""},
+            filename: {value:"filename"},
+            filenameType: {value:"msg"},
             appendNewline: {value:true},
             createDir: {value:false},
             overwriteFile: {value:"false"},
@@ -207,10 +210,13 @@
         outputs:1,
         icon: "file-out.svg",
         label: function() {
+            var fn = this.filename;
+            if(this.filenameType != "str" && this.filenameType != "env" ) { fn = ""; }
+            if(this.filenameType === "env") { fn = "env."+fn; }
             if (this.overwriteFile === "delete") {
-                return this.name||this._("file.label.deletelabel",{file:this.filename});
+                return this.name||this._("file.label.deletelabel",{file:fn});
             } else {
-                return this.name||this.filename||this._("file.label.write");
+                return this.name||fn||this._("file.label.write");
             }
         },
         paletteLabel: RED._("node-red:file.label.write"),
@@ -229,6 +235,31 @@
                 value: "setbymsg",
                 label: node._("file.encoding.setbymsg")
             }).text(label).appendTo(encSel);
+            $("#node-input-filename").typedInput({
+                default: "msg",
+                types:[{ value: "str", label:"", icon:"red/images/typedInput/az.svg"}, "msg", "jsonata", "env"],
+                typeField: $("#node-input-filenameType")
+            });
+            if(typeof node.filenameType == 'undefined') {
+                //existing node AND filenameType is not set - inplace (compatible) upgrade to new typedInput
+                if(node.filename == "") { //was using empty value to denote msg.filename - set typedInput to match
+                    node.filename = "filename";
+                    node.filenameType = "msg";
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                } else if(/^\${[^}]+}$/.test(node.filename)) { //was using an ${ENV_VAR}
+                    node.filenameType = "env";
+                    node.filename = node.filename.replace(/\${([^}]+)}/g, function(match, name) {
+                        return (name === undefined)?"":name;
+                    });
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                } else { //was using a static filename - set typedInput type to str
+                    node.filenameType = "str";
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                }
+            }
             encodings.forEach(function(item) {
                 if(Array.isArray(item)) {
                     var group = $("<optgroup/>", {
@@ -266,7 +297,8 @@
         category: 'storage',
         defaults: {
             name: {value:""},
-            filename: {value:""},
+            filename: {value:"filename"},
+            filenameType: {value:"msg"},
             format: {value:"utf8"},
             chunk: {value:false},
             sendError: {value: false},
@@ -291,7 +323,10 @@
         },
         icon: "file-in.svg",
         label: function() {
-            return this.name||this.filename||this._("file.label.read");
+            var fn = this.filename;
+            if(this.filenameType != "str" && this.filenameType != "env" ) { fn = ""; }
+            if(this.filenameType === "env") { fn = "env."+fn; }
+            return this.name||fn||this._("file.label.read");
         },
         paletteLabel: RED._("node-red:file.label.read"),
         labelStyle: function() {
@@ -305,6 +340,31 @@
                 value: "none",
                 label: label
             }).text(label).appendTo(encSel);
+            $("#node-input-filename").typedInput({
+                default: "msg",
+                types:[{ value: "str", label:"", icon:"red/images/typedInput/az.svg"}, "msg", "jsonata", "env"],
+                typeField: $("#node-input-filenameType")
+            });
+            if(typeof node.filenameType == 'undefined') {
+                //existing node AND filenameType is not set - inplace (compatible) upgrade to new typedInput
+                if(node.filename == "") { //was using empty value to denote msg.filename - set typedInput to match
+                    node.filename = "filename";
+                    node.filenameType = "msg";
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                } else if(/^\${[^}]+}$/.test(node.filename)) { //was using an ${ENV_VAR}
+                    node.filenameType = "env";
+                    node.filename = node.filename.replace(/\${([^}]+)}/g, function(match, name) {
+                        return (name === undefined)?"":name;
+                    });
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                } else { //was using a static filename - set typedInput type to str
+                    node.filenameType = "str";
+                    $("#node-input-filename").typedInput("type", node.filenameType);
+                    $("#node-input-filename").typedInput("value", node.filename);
+                }
+            }
             encodings.forEach(function(item) {
                 if(Array.isArray(item)) {
                     var group = $("<optgroup/>", {

packages/node_modules/@node-red/nodes/core/storage/10-file.js

@@ -39,6 +39,7 @@ module.exports = function(RED) {
         // Write/delete a file
         RED.nodes.createNode(this,n);
         this.filename = n.filename;
+        this.filenameType = n.filenameType;
         this.appendNewline = n.appendNewline;
         this.overwriteFile = n.overwriteFile.toString();
         this.createDir = n.createDir || false;
@@ -50,7 +51,28 @@ module.exports = function(RED) {
         node.closeCallback = null;
 
         function processMsg(msg,nodeSend, done) {
-            var filename = node.filename || msg.filename || "";
+            var filename = node.filename || "";
+            //Pre V3 compatibility - if filenameType is empty, do in place upgrade
+            if(typeof node.filenameType == 'undefined' || node.filenameType == "") {
+                //existing node AND filenameType is not set - inplace (compatible) upgrade
+                if(filename == "") { //was using empty value to denote msg.filename
+                    node.filename = "filename";
+                    node.filenameType = "msg";
+                } else { //was using a static filename - set typedInput type to str
+                    node.filenameType = "str";
+                }
+            }
+
+            RED.util.evaluateNodeProperty(node.filename,node.filenameType,node,msg,(err,value) => {
+                if (err) {
+                    node.error(err,msg);
+                    return done();
+                } else {
+                    filename = value;
+                }
+            });
+            filename = filename || "";
+            msg.filename = filename;
             var fullFilename = filename;
             if (filename && RED.settings.fileWorkingDirectory && !path.isAbsolute(filename)) {
                 fullFilename = path.resolve(path.join(RED.settings.fileWorkingDirectory,filename));
@@ -158,7 +180,7 @@ module.exports = function(RED) {
                             done();
                         });
                     }
-                    if (node.filename) {
+                    if (node.filenameType === "str" || node.filenameType === "env") {
                         // Static filename - write and reuse the stream next time
                         node.wstream.write(buf, function() {
                             nodeSend(msg);
@@ -256,6 +278,7 @@ module.exports = function(RED) {
         // Read a file
         RED.nodes.createNode(this,n);
         this.filename = n.filename;
+        this.filenameType = n.filenameType;
         this.format = n.format;
         this.chunk = false;
         this.encoding = n.encoding || "none";
@@ -270,8 +293,28 @@ module.exports = function(RED) {
         var node = this;
 
         this.on("input",function(msg, nodeSend, nodeDone) {
-            var filename = (node.filename || msg.filename || "").replace(/\t|\r|\n/g,'');
+            var filename = node.filename || "";
+            //Pre V3 compatibility - if filenameType is empty, do in place upgrade
+            if(typeof node.filenameType == 'undefined' || node.filenameType == "") {
+                //existing node AND filenameType is not set - inplace (compatible) upgrade
+                if(filename == "") { //was using empty value to denote msg.filename
+                    node.filename = "filename";
+                    node.filenameType = "msg";
+                } else { //was using a static filename - set typedInput type to str
+                    node.filenameType = "str";
+                }
+            }
+            RED.util.evaluateNodeProperty(node.filename,node.filenameType,node,msg,(err,value) => {
+                if (err) {
+                    node.error(err,msg);
+                    return done();
+                } else {
+                    filename = (value || "").replace(/\t|\r|\n/g,'');
+                }
+            });
+            filename = filename || "";
             var fullFilename = filename;
+            var filePath = "";
             if (filename && RED.settings.fileWorkingDirectory && !path.isAbsolute(filename)) {
                 fullFilename = path.resolve(path.join(RED.settings.fileWorkingDirectory,filename));
             }

packages/node_modules/@node-red/nodes/locales/en-US/storage/10-file.html

@@ -20,7 +20,9 @@
     <h3>Inputs</h3>
     <dl class="message-properties">
         <dt class="optional">filename <span class="property-type">string</span></dt>
-        <dd>If not configured in the node, this optional property sets the name of the file to be updated.</dd>
+        <dd>The name of the file to be updated can be provided in the node configuration, or as a message property. 
+            By default it will use <code>msg.filename</code> but this can be customised in the node.
+        </dd>
         <dt class="optional">encoding <span class="property-type">string</span></dt>
         <dd>If encoding is configured to be set by msg, then this optional property can set the encoding.</dt>
     </dl>
@@ -43,7 +45,9 @@
     <h3>Inputs</h3>
     <dl class="message-properties">
         <dt class="optional">filename <span class="property-type">string</span></dt>
-        <dd>if not set in the node configuration, this property sets the filename to read.</dd>
+        <dd>The name of the file to be read can be provided in the node configuration, or as a message property. 
+            By default it will use <code>msg.filename</code> but this can be customised in the node.
+        </dd>
     </dl>
     <h3>Outputs</h3>
     <dl class="message-properties">