NLS Swagger Help Box

Fixes #22

Author: codymwalker

package.json

@@ -21,6 +21,7 @@
         "name": "Nick O'Leary"
     },
     "dependencies": {
-        "swagger-ui": "2.1.0"
+        "swagger-ui": "2.1.0",
+        "i18next-client": "1.10.2"
     }
 }

swagger/locales/en-US/swagger.json

@@ -61,6 +61,15 @@
         "status": {
             "excluded": "Not included in Swagger",
             "missingconfig": "Swagger config not set"
+        },
+        "helpBox": {
+            "title": "I see you're lacking Swagger doc...",
+            "swaggerIntro": "Swagger is a simple yet powerful way to document your REST API.",
+            "swaggerInfo": "The Swagger plug-in dynamically generates Swagger documentation based on input provided when setting up your HTTP endpoint nodes.",
+            "swaggerInstructions0": "After building your REST APIs in the editor, click the HTTP endpoint node. You can then attach additional Swagger documentation to that node by clicking the add button next to Docs.",
+            "swaggerInstructions1": "You are able to add additional details on the types of inputs and outputs expected from your endpoint by quickly navigating through the screens and providing some information.",
+            "swaggerInstructions2": "Once your flow is deployed, this tab will be automatically populated by a visual representation of your API.",
+            "swaggerOutro": "You can then use this Swagger-UI tab to effortlessly test your APIs."
         }
     }
 }

swagger/swagger-ui/swagger-ui.html

@@ -17,6 +17,7 @@
   <script src='reqs/swagger-ui.js' type='text/javascript'></script>
   <script src='reqs/lib/highlight.7.3.pack.js' type='text/javascript'></script>
   <script src='reqs/lib/marked.js' type='text/javascript'></script>
+  <script src='reqs/i18next.min.js' type='text/javascript'></script>
   <script type="text/javascript">
     var url = parent.swaggerDocUrl;
     window.swaggerUi = new SwaggerUi({
@@ -35,6 +36,14 @@
 		console.log("Unable to Load SwaggerUI");
       },
     });
+    i18n.init({
+        resGetPath: 'nls/__lng__/__ns__.json',
+        load: 'current',
+        ns: 'swagger',
+        fallbackLng: 'en-us'
+    }, function() {
+        $('.empty-swagger-doc').i18n();
+    });
   </script>
   <style>
     .empty-swagger-doc {
@@ -66,13 +75,13 @@ <h2><span class="fa-stack fa-lg">
         <i class="fa fa-circle-thin fa-stack-2x"></i>
         <i class="fa fa-question fa-stack-1x"></i>
     </span></h2>
-    <h2>I see you're lacking Swagger doc...</h2>
-    <p>Swagger is a simple yet powerful way to document your REST API.</p>
-    <p>The Swagger plug-in dynamically generates Swagger documentation based on input provided when setting up your HTTP endpoint nodes.</p>
-    <p>After building your REST APIs in the editor, click the HTTP endpoint node. You can then attach additional Swagger documentation to that node by clicking the <b>add</b> button next to <b>Docs</b></p>
-    <p>You are able to add additional details on the types of inputs and outputs expected from your endpoint by quickly navigating through the screens and providing some information.</p>
-    <p>Once your flow is deployed, this tab will be automatically populated by a visual representation of your API.</p>
-    <p>You can then use this Swagger-UI tab to effortlessly test your APIs<p>
+    <h2 data-i18n>swagger.helpBox.title</h2>
+    <p data-i18n>swagger.helpBox.swaggerIntro</p>
+    <p data-i18n>swagger.helpBox.swaggerInfo</p>
+    <p data-i18n>swagger.helpBox.swaggerInstructions0</p>
+    <p data-i18n>swagger.helpBox.swaggerInstructions1</p>
+    <p data-i18n>swagger.helpBox.swaggerInstructions2</p>
+    <p data-i18n>swagger.helpBox.swaggerOutro<p>
 </div>
 <div id="swagger-ui-container" class="swagger-ui-wrap" style="margin: 10px"></div>
 

swagger/swagger.js

@@ -148,10 +148,19 @@ module.exports = function(RED) {
     }
     RED.nodes.registerType("swagger-doc",SwaggerDoc);
 
+    
+    RED.httpAdmin.get('/swagger-ui/reqs/i18next.min.js', function(req, res){
+        var filename = path.join(__dirname , '../node_modules/i18next-client/i18next.min.js');
+        res.sendfile(filename);
+    });
     RED.httpAdmin.get('/swagger-ui/reqs/*', function(req, res){
         var filename = path.join(__dirname , '../node_modules/swagger-ui/dist', req.params[0]);
         res.sendfile(filename);
     });
+    RED.httpAdmin.get('/swagger-ui/nls/*', function(req, res){
+        var filename = path.join(__dirname , 'locales', req.params[0]);
+        res.sendfile(filename);
+    });
     RED.httpAdmin.get('/swagger-ui/*', function(req, res){
         var filename = path.join(__dirname , 'swagger-ui', req.params[0]);
         res.sendfile(filename);