1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Allow tips to be hidden and cycled through

This commit is contained in:
Nick O'Leary 2017-04-07 12:24:39 +01:00
parent 67da853146
commit ede940a398
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
2 changed files with 34 additions and 2 deletions

View File

@ -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
}
})();

View File

@ -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;
}
}