From ede940a3986559c3ca5af4f88edf8906b0ecff3b Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Fri, 7 Apr 2017 12:24:39 +0100
Subject: [PATCH] Allow tips to be hidden and cycled through

---
 editor/js/ui/tab-info.js  | 22 +++++++++++++++++++++-
 editor/sass/tab-info.scss | 14 +++++++++++++-
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/editor/js/ui/tab-info.js b/editor/js/ui/tab-info.js
index f2a1e3133..6ff3686e5 100644
--- a/editor/js/ui/tab-info.js
+++ b/editor/js/ui/tab-info.js
@@ -63,6 +63,20 @@ RED.sidebar.info = (function() {
 
         tipContainer = $('<div class="node-info-tips"></div>').appendTo(content);
         tipBox = $('<div class="node-info-tip"></div>').appendTo(tipContainer);
+        var tipButtons = $('<div class="node-info-tips-buttons"></div>').appendTo(tipContainer);
+
+        var tipRefresh = $('<a href="#" class="workspace-footer-button"><i class="fa fa-refresh"></a>').appendTo(tipButtons);
+        tipRefresh.click(function(e) {
+            e.preventDefault();
+            tips.next();
+        })
+
+        var tipClose = $('<a href="#" class="workspace-footer-button"><i class="fa fa-times"></a>').appendTo(tipButtons);
+        tipClose.click(function(e) {
+            e.preventDefault();
+            RED.actions.invoke("core:toggle-show-tips");
+            RED.notify("You can re-open the tips from the side menu");
+        });
 
         RED.sidebar.addTab({
             id: "info",
@@ -272,9 +286,15 @@ RED.sidebar.info = (function() {
             refreshTimeout = null;
             startTimeout = null;
         }
+        function nextTip() {
+            clearInterval(refreshTimeout);
+            startTimeout = true;
+            setTip();
+        }
         return {
             start: startTips,
-            stop: stopTips
+            stop: stopTips,
+            next: nextTip
         }
     })();
 
diff --git a/editor/sass/tab-info.scss b/editor/sass/tab-info.scss
index bc74edd75..b1c096d87 100644
--- a/editor/sass/tab-info.scss
+++ b/editor/sass/tab-info.scss
@@ -200,6 +200,8 @@ div.node-info {
     border-top: 1px solid $secondary-border-color;
     background-color: #fff;
     padding: 20px;
+    box-shadow: 0 5px 20px 0px rgba(0, 0, 0, 0.3);
+    overflow-y: auto;
 }
 .sidebar-node-info.show-tips {
     .sidebar-node-info-stack {
@@ -221,7 +223,7 @@ div.node-info {
 .node-info-tip {
     display: inline-block;
     vertical-align: middle;
-    width: calc(100% - 30px);
+    width: 100%;
     font-size: 16px;
     text-align: center;
     line-height: 1.9em;
@@ -229,3 +231,13 @@ div.node-info {
     @include disable-selection;
     cursor: default;
 }
+.node-info-tips-buttons {
+    position: absolute;
+    top: 4px;
+    right: 6px;
+    a {
+        color: #ddd !important;
+        border-color: #d9d9d9 !important;
+        margin-left: 4px;
+    }
+}