mirror of
https://github.com/node-red/node-red.git
synced 2025-12-27 23:34:38 +01:00
Merge pull request #5117 from node-red/5102-telemetry
Add update notification
This commit is contained in:
@@ -358,7 +358,10 @@ var RED = (function() {
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (notificationId === "update-available") {
|
||||
// re-emit as an event to be handled in editor-client/src/js/ui/palette-editor.js
|
||||
RED.events.emit("notification/update-available", msg)
|
||||
}
|
||||
if (msg.text) {
|
||||
msg.default = msg.text;
|
||||
var text = RED._(msg.text,msg);
|
||||
@@ -672,14 +675,48 @@ var RED = (function() {
|
||||
|
||||
setTimeout(function() {
|
||||
loader.end();
|
||||
checkFirstRun(function() {
|
||||
if (showProjectWelcome) {
|
||||
RED.projects.showStartup();
|
||||
}
|
||||
});
|
||||
checkTelemetry(function () {
|
||||
checkFirstRun(function() {
|
||||
if (showProjectWelcome) {
|
||||
RED.projects.showStartup();
|
||||
}
|
||||
});
|
||||
})
|
||||
},100);
|
||||
}
|
||||
|
||||
function checkTelemetry(done) {
|
||||
const telemetrySettings = RED.settings.telemetryEnabled;
|
||||
// Can only get telemetry permission from a user with permission to modify settings
|
||||
if (RED.user.hasPermission("settings.write") && telemetrySettings === undefined) {
|
||||
|
||||
const dialog = RED.popover.dialog({
|
||||
title: RED._("telemetry.settingsTitle"),
|
||||
content: `${RED._("telemetry.settingsDescription")}${RED._("telemetry.settingsDescription2")}`,
|
||||
closeButton: false,
|
||||
buttons: [
|
||||
{
|
||||
text: RED._("telemetry.enableLabel"),
|
||||
click: () => {
|
||||
RED.settings.set("telemetryEnabled", true)
|
||||
dialog.close()
|
||||
done()
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("telemetry.disableLabel"),
|
||||
click: () => {
|
||||
RED.settings.set("telemetryEnabled", false)
|
||||
dialog.close()
|
||||
done()
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
} else {
|
||||
done()
|
||||
}
|
||||
}
|
||||
function checkFirstRun(done) {
|
||||
if (RED.settings.theme("tours") === false) {
|
||||
done();
|
||||
|
||||
@@ -163,13 +163,18 @@ RED.popover = (function() {
|
||||
}
|
||||
|
||||
var timer = null;
|
||||
let isOpen = false
|
||||
var active;
|
||||
var div;
|
||||
var contentDiv;
|
||||
var currentStyle;
|
||||
|
||||
var openPopup = function(instant) {
|
||||
if (isOpen) {
|
||||
return
|
||||
}
|
||||
if (active) {
|
||||
isOpen = true
|
||||
var existingPopover = target.data("red-ui-popover");
|
||||
if (options.tooltip && existingPopover) {
|
||||
active = false;
|
||||
@@ -334,6 +339,7 @@ RED.popover = (function() {
|
||||
|
||||
}
|
||||
var closePopup = function(instant) {
|
||||
isOpen = false
|
||||
$(document).off('mousedown.red-ui-popover');
|
||||
if (!active) {
|
||||
if (div) {
|
||||
@@ -673,6 +679,74 @@ RED.popover = (function() {
|
||||
show:show,
|
||||
hide:hide
|
||||
}
|
||||
},
|
||||
dialog: function(options) {
|
||||
|
||||
const dialogContent = $('<div style="position:relative"></div>');
|
||||
|
||||
if (options.closeButton !== false) {
|
||||
$('<button type="button" class="red-ui-button red-ui-button-small" style="float: right; margin-top: -4px; margin-right: -4px;"><i class="fa fa-times"></i></button>').appendTo(dialogContent).click(function(evt) {
|
||||
evt.preventDefault();
|
||||
close();
|
||||
})
|
||||
}
|
||||
|
||||
const dialogBody = $('<div class="red-ui-dialog-body"></div>').appendTo(dialogContent);
|
||||
if (options.title) {
|
||||
$('<h2>').text(options.title).appendTo(dialogBody);
|
||||
}
|
||||
$('<div>').css("text-align","left").html(options.content).appendTo(dialogBody);
|
||||
|
||||
const stepToolbar = $('<div>',{class:"red-ui-dialog-toolbar"}).appendTo(dialogContent);
|
||||
|
||||
if (options.buttons) {
|
||||
options.buttons.forEach(button => {
|
||||
const btn = $('<button type="button" class="red-ui-button"></button>').text(button.text).appendTo(stepToolbar);
|
||||
if (button.class) {
|
||||
btn.addClass(button.class);
|
||||
}
|
||||
if (button.click) {
|
||||
btn.on('click', function(evt) {
|
||||
evt.preventDefault();
|
||||
button.click();
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
const width = 500;
|
||||
const maxWidth = Math.min($(window).width()-10,Math.max(width || 0, 300));
|
||||
|
||||
let shade = $('<div class="red-ui-shade" style="z-index: 2000"></div>').appendTo(document.body);
|
||||
shade.fadeIn()
|
||||
|
||||
let popover = RED.popover.create({
|
||||
target: $(".red-ui-editor"),
|
||||
width: width || "auto",
|
||||
maxWidth: maxWidth+"px",
|
||||
direction: "inset",
|
||||
class: "red-ui-dialog",
|
||||
trigger: "manual",
|
||||
content: dialogContent
|
||||
}).open()
|
||||
|
||||
function close() {
|
||||
if (shade) {
|
||||
shade.fadeOut(() => {
|
||||
shade.remove()
|
||||
shade = null
|
||||
})
|
||||
}
|
||||
if (popover) {
|
||||
popover.close()
|
||||
popover = null
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
close
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -815,6 +815,14 @@ RED.palette.editor = (function() {
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
RED.events.on("notification/update-available", function (msg) {
|
||||
const updateKnownAbout = updateStatusState.version === msg.version
|
||||
updateStatusState.version = msg.version
|
||||
if (updateStatusWidgetPopover && !updateKnownAbout) {
|
||||
setTimeout(() => { updateStatusWidgetPopover.open(); setTimeout(() => updateStatusWidgetPopover.close(), 20000) }, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getSettingsPane() {
|
||||
@@ -1604,28 +1612,43 @@ RED.palette.editor = (function() {
|
||||
}
|
||||
|
||||
const updateStatusWidget = $('<button type="button" class="red-ui-footer-button red-ui-update-status"></button>');
|
||||
let updateStatusWidgetPopover;
|
||||
const updateStatusState = { moduleCount: 0 }
|
||||
let updateAvailable = [];
|
||||
|
||||
function addUpdateInfoToStatusBar() {
|
||||
updateStatusWidget.on("click", function (evt) {
|
||||
RED.actions.invoke("core:manage-palette", {
|
||||
view: "nodes",
|
||||
filter: '"' + updateAvailable.join('", "') + '"'
|
||||
});
|
||||
});
|
||||
|
||||
RED.popover.tooltip(updateStatusWidget, function () {
|
||||
const count = updateAvailable.length || 0;
|
||||
return RED._("palette.editor.updateCount", { count: count });
|
||||
updateStatusWidgetPopover = RED.popover.create({
|
||||
target: updateStatusWidget,
|
||||
trigger: "click",
|
||||
interactive: true,
|
||||
direction: "bottom",
|
||||
content: function () {
|
||||
const count = updateAvailable.length || 0;
|
||||
const content = $('<div style="display: flex; flex-direction: column; gap: 5px;"></div>');
|
||||
if (updateStatusState.version) {
|
||||
$(`<a class='red-ui-button' href="https://github.com/node-red/node-red/releases/tag/${updateStatusState.version}" target="_blank">${RED._("telemetry.updateAvailableDesc", updateStatusState)}</a>`).appendTo(content)
|
||||
}
|
||||
if (count > 0) {
|
||||
$(`<button type="button" class="red-ui-button"><i class="fa fa-cube"></i> ${RED._("palette.editor.updateCount", { count: count })}</button>`).on("click", function (evt) {
|
||||
updateStatusWidgetPopover.close()
|
||||
RED.actions.invoke("core:manage-palette", {
|
||||
view: "nodes",
|
||||
filter: '"' + updateAvailable.join('", "') + '"'
|
||||
});
|
||||
}).appendTo(content)
|
||||
}
|
||||
return content
|
||||
},
|
||||
delay: { show: 750, hide: 250 }
|
||||
});
|
||||
|
||||
RED.statusBar.add({
|
||||
id: "update",
|
||||
id: "red-ui-status-package-update",
|
||||
align: "right",
|
||||
element: updateStatusWidget
|
||||
});
|
||||
|
||||
updateStatus({ count: 0 });
|
||||
updateStatus();
|
||||
}
|
||||
|
||||
let pendingRefreshTimeout
|
||||
@@ -1648,18 +1671,22 @@ RED.palette.editor = (function() {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
updateStatus({ count: updateAvailable.length });
|
||||
updateStatusState.moduleCount = updateAvailable.length;
|
||||
updateStatus();
|
||||
}, 200)
|
||||
}
|
||||
|
||||
function updateStatus(opts) {
|
||||
if (opts.count) {
|
||||
RED.statusBar.show("update");
|
||||
function updateStatus() {
|
||||
if (updateStatusState.moduleCount || updateStatusState.version) {
|
||||
updateStatusWidget.empty();
|
||||
$('<span><i class="fa fa-cube"></i> ' + opts.count + '</span>').appendTo(updateStatusWidget);
|
||||
let count = updateStatusState.moduleCount || 0;
|
||||
if (updateStatusState.version) {
|
||||
count ++
|
||||
}
|
||||
$(`<span><i class="fa fa-cube"></i> ${RED._("telemetry.updateAvailable", { count: count })}</span>`).appendTo(updateStatusWidget);
|
||||
RED.statusBar.show("red-ui-status-package-update");
|
||||
} else {
|
||||
RED.statusBar.hide("update");
|
||||
RED.statusBar.hide("red-ui-status-package-update");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -435,10 +435,15 @@ RED.tourGuide = (function() {
|
||||
|
||||
function listTour() {
|
||||
return [
|
||||
{
|
||||
id: "4_1",
|
||||
label: "4.1",
|
||||
path: "./tours/welcome.js"
|
||||
},
|
||||
{
|
||||
id: "4_0",
|
||||
label: "4.0",
|
||||
path: "./tours/welcome.js"
|
||||
path: "./tours/4.0/welcome.js"
|
||||
},
|
||||
{
|
||||
id: "3_1",
|
||||
|
||||
@@ -144,6 +144,18 @@ RED.userSettings = (function() {
|
||||
{setting:"view-node-show-label",label:"menu.label.showNodeLabelDefault",default: true, toggle:true}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "telemetry.label",
|
||||
options: [
|
||||
{
|
||||
global: true,
|
||||
setting: "telemetryEnabled",
|
||||
label: "telemetry.settingsTitle",
|
||||
description: "telemetry.settingsDescription",
|
||||
toggle: true
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "menu.label.other",
|
||||
options: [
|
||||
@@ -170,13 +182,20 @@ RED.userSettings = (function() {
|
||||
var initialState;
|
||||
if (opt.local) {
|
||||
initialState = localStorage.getItem(opt.setting);
|
||||
} else if (opt.global) {
|
||||
initialState = RED.settings.get(opt.setting);
|
||||
} else {
|
||||
initialState = currentEditorSettings.view[opt.setting];
|
||||
}
|
||||
var row = $('<div class="red-ui-settings-row"></div>').appendTo(pane);
|
||||
var input;
|
||||
if (opt.toggle) {
|
||||
input = $('<label for="user-settings-'+opt.setting+'"><input id="user-settings-'+opt.setting+'" type="checkbox"> '+RED._(opt.label)+'</label>').appendTo(row).find("input");
|
||||
let label = RED._(opt.label)
|
||||
if (opt.description) {
|
||||
label = `<p>${label}</p>${RED._(opt.description)}`;
|
||||
}
|
||||
input = $('<input id="user-settings-'+opt.setting+'" type="checkbox">').appendTo(row)
|
||||
$('<label for="user-settings-'+opt.setting+'">'+label+'</label>').appendTo(row)
|
||||
input.prop('checked',initialState);
|
||||
} else if (opt.options) {
|
||||
$('<label for="user-settings-'+opt.setting+'">'+RED._(opt.label)+'</label>').appendTo(row);
|
||||
@@ -210,6 +229,8 @@ RED.userSettings = (function() {
|
||||
var opt = allSettings[id];
|
||||
if (opt.local) {
|
||||
localStorage.setItem(opt.setting,value);
|
||||
} else if (opt.global) {
|
||||
RED.settings.set(opt.setting, value)
|
||||
} else {
|
||||
var currentEditorSettings = RED.settings.get('editor') || {};
|
||||
currentEditorSettings.view = currentEditorSettings.view || {};
|
||||
@@ -238,7 +259,7 @@ RED.userSettings = (function() {
|
||||
|
||||
addPane({
|
||||
id:'view',
|
||||
title: RED._("menu.label.view.view"),
|
||||
title: RED._("menu.label.settings"),
|
||||
get: createViewPane,
|
||||
close: function() {
|
||||
viewSettings.forEach(function(section) {
|
||||
|
||||
Reference in New Issue
Block a user