Add i18n support to tours

This commit is contained in:
Nick O'Leary 2021-09-27 17:34:30 +01:00
parent e9e03c945b
commit ad542b91fa
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
2 changed files with 27 additions and 18 deletions

View File

@ -164,6 +164,15 @@ RED.tourGuide = (function() {
}
finish();
}
function getLocaleText(property) {
if (typeof property === 'string') {
return property;
}
var currentLang = RED.i18n.lang() || 'en-US';
var availableLangs = Object.keys(property);
return property[currentLang]||property['en-US']||property[availableLangs[0]]
}
function runTourStep(step, state, done) {
shade.fadeIn();
@ -214,9 +223,9 @@ RED.tourGuide = (function() {
$('<h2><i class="'+step.titleIcon+'"></i></h2>').appendTo(stepDescription);
}
if (step.title) {
$('<h2>').text(step.title).appendTo(stepDescription);
$('<h2>').text(getLocaleText(step.title)).appendTo(stepDescription);
}
$('<div>').css("text-align","left").html(step.description).appendTo(stepDescription);
$('<div>').css("text-align","left").html(getLocaleText(step.description)).appendTo(stepDescription);
var stepToolbar = $('<div>',{class:"red-ui-tourGuide-toolbar"}).appendTo(stepContent);

View File

@ -3,13 +3,13 @@ export default {
steps: [
{
titleIcon: "fa fa-map-o",
title: "Welcome to Node-RED 2.1!",
description: "Let's take a moment to discover the new features in this release."
title: { "en-US": "Welcome to Node-RED 2.1!" },
description: { "en-US": "Let's take a moment to discover the new features in this release." }
},
{
title: "A new Tour Guide",
description: "<p>First, as you've already found, we now have this tour of new features. We'll only show the tour the first time you open the editor for each new version of Node-RED.</p>"+
"<p>You can choose not to see this tour in the future by disabling it under the View tab of User Settings.</p>",
title: { "en-US": "A new Tour Guide" },
description: { "en-US": "<p>First, as you've already found, we now have this tour of new features. We'll only show the tour the first time you open the editor for each new version of Node-RED.</p>"+
"<p>You can choose not to see this tour in the future by disabling it under the View tab of User Settings.</p>" }
},
{
prepare() {
@ -22,9 +22,9 @@ export default {
element: "#menu-item-edit-menu-submenu",
interactive: false,
direction: "left",
title: "New Edit menu",
description: "<p>The main menu has been updated with a new 'Edit' section. This includes all of the familar options, like cut/paste and undo/redo.</p>"+
"<p>The menu now displays keyboard shortcuts for the options.</p>"
title: { "en-US": "New Edit menu" },
description: { "en-US": "<p>The main menu has been updated with a new 'Edit' section. This includes all of the familar options, like cut/paste and undo/redo.</p>"+
"<p>The menu now displays keyboard shortcuts for the options.</p>" }
},
{
@ -38,13 +38,13 @@ export default {
element: "#menu-item-arrange-menu-submenu",
interactive: false,
direction: "left",
title: "Arranging nodes",
description: "<p>The new 'Arrange' section of the menu provides new options to help arrange your nodes. You can align them to a common edge, spread them out evenly or change their order.</p>",
title: { "en-US": "Arranging nodes" },
description: { "en-US": "<p>The new 'Arrange' section of the menu provides new options to help arrange your nodes. You can align them to a common edge, spread them out evenly or change their order.</p>" },
},
{
element: "#red-ui-workspace-tabs > li:first-child",
title: "Flow and Group level environment variables",
description: "<p>Flows and Groups can now have their own environment variables that can be referenced by nodes inside them.</p>",
title: { "en-US": "Flow and Group level environment variables" },
description: { "en-US": "<p>Flows and Groups can now have their own environment variables that can be referenced by nodes inside them.</p>" },
},
{
prepare(done) {
@ -52,19 +52,19 @@ export default {
setTimeout(done,800);
},
element: "#red-ui-tab-editor-tab-envProperties-link-button",
description: "<p>Flows and Groups now have an Environment Variables section in their edit dialog.</p>"
description: { "en-US": "<p>Flows and Groups now have an Environment Variables section in their edit dialog.</p>" },
},
{
element: ".node-input-env-container-row .red-ui-editableList-addButton",
direction: "top",
description: '<p>The environment variables are listed in this table and new ones can be added by clicking the <i class="fa fa-plus"></i> button.</p>',
description: { "en-US": '<p>The environment variables are listed in this table and new ones can be added by clicking the <i class="fa fa-plus"></i> button.</p>' },
complete() {
$("#node-dialog-cancel").trigger("click");
}
},
{
title: "And that's not all...",
description: "<p>There's more still to come before 2.1.0 is released. Watch this space!</p>"
title: { "en-US": "And that's not all..." },
description: { "en-US": "<p>There's more still to come before 2.1.0 is released. Watch this space!</p>" }
},
]
}