From db2425c473c4e73259ca89745819b71956099ff1 Mon Sep 17 00:00:00 2001
From: Dave Conway-Jones <conway@uk.ibm.com>
Date: Mon, 14 Nov 2016 19:10:02 +0000
Subject: [PATCH] Seperated info messages to their own file

auto detect size still needs work
---
 editor/js/i18n.js                   |  2 +-
 editor/js/ui/tab-info.js            | 11 ++++++++---
 editor/sass/tab-info.scss           | 18 ++++++++++++++++++
 red/api/index.js                    |  2 +-
 red/api/info.js                     |  2 +-
 red/api/locales/en-US/infotips.json | 16 ++++++++++++++++
 red/runtime/i18n.js                 |  2 +-
 7 files changed, 46 insertions(+), 7 deletions(-)
 create mode 100644 red/api/locales/en-US/infotips.json

diff --git a/editor/js/i18n.js b/editor/js/i18n.js
index cf29a6b43..149b48c1a 100644
--- a/editor/js/i18n.js
+++ b/editor/js/i18n.js
@@ -23,7 +23,7 @@ RED.i18n = (function() {
                 dynamicLoad: false,
                 load:'current',
                 ns: {
-                    namespaces: ["editor","node-red"],
+                    namespaces: ["editor","node-red","infotips"],
                     defaultNs: "editor"
                 },
                 fallbackLng: ['en-US'],
diff --git a/editor/js/ui/tab-info.js b/editor/js/ui/tab-info.js
index 1daf683ff..7ac0611f9 100644
--- a/editor/js/ui/tab-info.js
+++ b/editor/js/ui/tab-info.js
@@ -127,7 +127,6 @@ RED.sidebar.info = (function() {
             //$('<div class="node-help">'+(typeof info === "function" ? info.call(node) : info)+'</div>';
         }
 
-
         $(".node-info-property-header").click(function(e) {
             var icon = $(this).find("i");
             if (icon.hasClass("fa-caret-right")) {
@@ -146,8 +145,14 @@ RED.sidebar.info = (function() {
         });
     }
 
+    var infotimeout;
     function clear() {
-        $(content).html("");
+        //$(content).html("");
+        if (!infotimeout) {
+            var r = parseInt(Math.random() * RED._("infotips:infoLength"));
+            $(content).html('<div class="node-info-tip">'+RED._("infotips:info.tip"+r)+'</div>');
+            infotimeout = setTimeout(function() { infotimeout=null; }, 20000);
+        }
     }
 
     function set(html) {
@@ -177,7 +182,7 @@ RED.sidebar.info = (function() {
     return {
         init: init,
         show: show,
-        refresh:refresh,
+        refresh: refresh,
         clear: clear,
         set: set
     }
diff --git a/editor/sass/tab-info.scss b/editor/sass/tab-info.scss
index 976da027c..c7cf8e27e 100644
--- a/editor/sass/tab-info.scss
+++ b/editor/sass/tab-info.scss
@@ -81,3 +81,21 @@ div.node-info {
         margin: 8px auto;
     }
 }
+.node-info-tip {
+    margin: 10px;
+    margin-top: 30px;
+    border-radius: 6px;
+    padding: 12px;
+    font-size: 18px;
+    text-align: center;
+    color : #aaa;
+    background-color: #fff;
+    code {
+        font-size: 16px;
+        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+        font-weight: 700;
+        padding: 3px 8px 3px 8px;
+        border-radius: 4px;
+        color: #aaa;
+    }
+}
diff --git a/red/api/index.js b/red/api/index.js
index 4200af192..5e6ab84dc 100644
--- a/red/api/index.js
+++ b/red/api/index.js
@@ -155,7 +155,7 @@ function init(_server,_runtime) {
     }
 }
 function start() {
-    return i18n.registerMessageCatalog("editor",path.resolve(path.join(__dirname,"locales")),"editor.json").then(function(){
+    return i18n.registerMessageCatalog("editor",path.resolve(path.join(__dirname,"locales")),"editor.json").then(i18n.registerMessageCatalog("infotips",path.resolve(path.join(__dirname,"locales")),"infotips.json")).then(function() {
         comms.start();
     });
 }
diff --git a/red/api/info.js b/red/api/info.js
index 9504713b0..5bb4c7ba8 100644
--- a/red/api/info.js
+++ b/red/api/info.js
@@ -42,13 +42,13 @@ module.exports = {
         if (settings.flowFilePretty) {
             safeSettings.flowFilePretty = settings.flowFilePretty;
         }
+
         if (!runtime.nodes.paletteEditorEnabled()) {
             safeSettings.editorTheme = safeSettings.editorTheme || {};
             safeSettings.editorTheme.palette = safeSettings.editorTheme.palette || {};
             safeSettings.editorTheme.palette.editable = false;
         }
 
-
         res.json(safeSettings);
     }
 }
diff --git a/red/api/locales/en-US/infotips.json b/red/api/locales/en-US/infotips.json
new file mode 100644
index 000000000..cc7f68826
--- /dev/null
+++ b/red/api/locales/en-US/infotips.json
@@ -0,0 +1,16 @@
+{
+    "info": {
+        "tip0" : "Use the <code>delete</code> key to remove a node.",
+        "tip1" : "Press the <code>Deploy</code> button above to start the flow running. You can choose to deploy the whole flow or just the changes.",
+        "tip2" : "Options like <b>Show grid</b> and <b>Snap to grid</b> are under the menu icon<br/><i class='fa fa-bars'></i> <i class='fa fa-caret-right'></i> <b>View</b>",
+        "tip3" : "<code>ctrl .</code> or <code>⌘ .</code> can be used to search for nodes and tabs.",
+        "tip4" : "<i class='fa fa-bars'></i> <i class='fa fa-caret-right'></i> <b>Manage palette</b> can be used to find, add and remove extra nodes.",
+        "tip5" : "Nodes may install examples under<br/><i class='fa fa-bars'></i> <i class='fa fa-caret-right'></i> <b>Import</b> <i class='fa fa-caret-right'></i> <b>Examples</b>",
+        "tip6" : "Lots of example flows can be found on <a href='http://flows.nodered.org' target='_blank'>flows.nodered.org</a><br/>They can then be imported by drag and drop to the workspace.",
+        "tip7" : "<b>Shift-click and drag</b> on a connector to move all the attached wires in one go.",
+        "tip8" : "The <b>Node-RED Dashboard</b> package can be used to create simple User Interfaces.",
+        "tip9" : "<code>ctrl</code><code>space</code> will toggle the view of this sidebar.",
+        "tip10": "Got a question?<br/>Join us on <a href='https://node-red.slack.com/' target='_blank'>Slack</a><br/>or the<br/><a href='https://groups.google.com/forum/#!forum/node-red' target='_blank'>Node-RED Google group</a>"
+    },
+    "infoLength": "11"
+}
diff --git a/red/runtime/i18n.js b/red/runtime/i18n.js
index 44cdf4b44..0d45b71e4 100644
--- a/red/runtime/i18n.js
+++ b/red/runtime/i18n.js
@@ -111,7 +111,7 @@ var obj = module.exports = {
     registerMessageCatalog: registerMessageCatalog,
     catalog: getCatalog,
     i: i18n,
-    defaultLang:defaultLang
+    defaultLang: defaultLang
 }
 
 obj['_'] = function() {