Add 310 tour

CHANGELOG.md

@@ -1,5 +1,6 @@
 #### 3.1.0-beta.1: Beta Release
 
+
 Editor
 
  - NEW: Locking Flows (#3938) @knolleary
@@ -7,7 +8,8 @@ Editor
  - NEW: Add support for inline image in markdown editor by drag and drop of an image file (#4006) @HiroyasuNishiyama
  - NEW: Add support for mermaid diagram to markdown editor (#4007) @HiroyasuNishiyama
  - NEW: Support uri fragments for nodes and groups including edit support (#3870) @knolleary
- 
+ - NEW: Add global environment variable feature (#3941) @HiroyasuNishiyama
+
  - Remember compact/pretty flow export user choice (#3974) @Steve-Mcl
  - fix .red-ui-notification class (#4035) @xiaobinqt
  - Fix border radius on Modules list header (#4038) @bonanitech
@@ -38,7 +40,6 @@ Editor
 
 Runtime
 
- - NEW: Add global environment variable feature (#3941) @HiroyasuNishiyama
  - Force IPv4 name resolution to have priority (#4019) @dceejay
  - Fix async loading of modules containing both nodes and plugins (#3999) @knolleary
  - Use main branch as default in project feature (#4036) @kazuhitoyokoi

packages/node_modules/@node-red/editor-client/src/js/ui/tour/tourGuide.js

@@ -435,10 +435,15 @@ RED.tourGuide = (function() {
 
     function listTour() {
         return [
+            {
+                id: "3_1",
+                label: "3.1",
+                path: "./tours/welcome.js"
+            },
             {
                 id: "3_0",
                 label: "3.0",
-                path: "./tours/welcome.js"
+                path: "./tours/3.0/welcome.js"
             },
             {
                 id: "2_2",

packages/node_modules/@node-red/editor-client/src/tours/3.0/welcome.js

@@ -0,0 +1,155 @@
+export default {
+    version: "3.0.0",
+    steps: [
+        {
+            titleIcon: "fa fa-map-o",
+            title: {
+                "en-US": "Welcome to Node-RED 3.0!",
+                "ja": "Node-RED 3.0へようこそ!"
+            },
+            description: {
+                "en-US": "<p>Let's take a moment to discover the new features in this release.</p>",
+                "ja": "<p>本リリースの新機能を見つけてみましょう。</p>"
+            }
+        },
+        {
+            title: {
+                "en-US": "Context Menu",
+                "ja": "コンテキストメニュー"
+            },
+            image: 'images/context-menu.png',
+            description: {
+                "en-US": `<p>The editor now has its own context menu when you
+                          right-click in the workspace.</p>
+                          <p>This makes many of the built-in actions much easier
+                          to access.</p>`,
+                "ja": `<p>ワークスペースで右クリックすると、エディタに独自のコンテキストメニューが表示されるようになりました。</p>
+                       <p>これによって多くの組み込み動作を、より簡単に利用できます。</p>`
+            }
+        },
+        {
+            title: {
+                "en-US": "Wire Junctions",
+                "ja": "分岐点をワイヤーに追加"
+            },
+            image: 'images/junction-slice.gif',
+            description: {
+                "en-US": `<p>To make it easier to route wires around your flows,
+                             it is now possible to add junction nodes that give
+                             you more control.</p>
+                          <p>Junctions can be added to wires by holding both the Alt key and the Shift key
+                          then click and drag the mouse across the wires.</p>`,
+                "ja": `<p>フローのワイヤーの経路をより制御しやすくするために、分岐点ノードを追加できるようになりました。</p>
+                       <p>Altキーとシフトキーを押しながらマウスをクリックし、ワイヤーを横切るようにドラッグすることで、分岐点を追加できます。</p>`
+            },
+        },
+        {
+            title: {
+                "en-US": "Wire Junctions",
+                "ja": "分岐点をワイヤーに追加"
+            },
+            image: 'images/junction-quick-add.png',
+            description: {
+                "en-US": `<p>Junctions can also be added using the quick-add dialog.</p>
+                          <p>The dialog is opened by holding the Ctrl (or Cmd) key when
+                             clicking in the workspace.</p>`,
+                "ja": `<p>クイック追加ダイアログを用いて、分岐点を追加することもできます。</p>
+                       <p>本ダイアログを開くには、Ctrl(またはCmd)キーを押しながら、ワークスペース上でクリックします。</p>`
+            },
+        },
+        {
+            title: {
+                "en-US": "Debug Path Tooltip",
+                "ja": "デバッグパスのツールチップ"
+            },
+            image: 'images/debug-path-tooltip.png',
+            description: {
+                "en-US": `<p>When hovering over a node name in the Debug sidebar, a
+                             new tooltip shows the full location of the node.</p>
+                          <p>This is useful when working with subflows, making it
+                             much easier to identify exactly which node generated
+                             the message.</p>
+                          <p>Clicking on any item in the list will reveal it in
+                             the workspace.</p>`,
+                "ja": `<p>デバックサイドバー内のノード名の上にマウスカーソルを乗せると、新たにツールチップが表示され、ノードの場所が分かるようになっています。</p>
+                       <p>これは、サブフローを用いる時に役立つ機能であり、メッセージがどのノードから出力されたかを正確に特定することが遥かに簡単になります。</p>
+                       <p>本リスト内の要素をクリックすると、ワークスペース内にその要素が表示されます。</p>`
+            },
+        },
+        {
+            title: {
+                "en-US": "Continuous Search",
+                "ja": "連続した検索"
+            },
+            image: 'images/continuous-search.png',
+            description: {
+                "en-US": `<p>When searching for things in the editor, a new toolbar in
+                             the workspace provides options to quickly jump between
+                             the search results.</p>`,
+                "ja": `<p>ワークスペース内の新しいツールバーにあるオプションによって、エディタ内を検索する際に、検索結果の間を素早く移動できます。</p>`
+            },
+        },
+        {
+            title: {
+                "en-US": "New wiring actions",
+                "ja": "新しいワイヤー操作"
+            },
+            image: "images/split-wire-with-links.gif",
+            description: {
+                "en-US": `<p>A new action has been added that will replace a wire with a pair of connected Link nodes:</p>
+                          <ul>
+                          <li><b><code>Split Wire With Link Nodes</code></b></li>
+                          </ul>
+                          <p>Actions can be accessed from the Action List in the main menu.</p>`,
+                "ja": `<p>ワイヤーを、接続されたLinkノードのペアに置き換える動作が新たに追加されました:</p>
+                       <ul>
+                       <li><b><code>ワイヤーをlinkノードで分割</code></b></li>
+                       </ul>
+                       <p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>`,
+            },
+        },
+        {
+            title: {
+                "en-US": "Default node names",
+                "ja": "標準ノードの名前"
+            },
+            // image: "images/",
+            description: {
+                "en-US": `<p>Some nodes have been updated to generate a unique name when
+                             new instances are added to the workspace. This applies to
+                             <code>Debug</code>, <code>Function</code> and <code>Link</code> nodes.</p>
+                          <p>A new action has also been added to generate default names for the selected
+                             nodes:</p>
+                             <ul>
+                             <li><b><code>Generate Node Names</code></b></li>
+                             </ul><p>Actions can be accessed from the Action List in the main menu.</p>
+                            `,
+                "ja": `<p>一部のノードは、ワークスペース上に新インスタンスとして追加した際に、一意の名前を付けるよう変更されました。この変更は、<code>Debug</code>、<code>Function</code>、<code>Link</code>ノードに適用されています。</p>
+                       <p>選択したノードに対して、標準の名前を生成する動作も新たに追加されました:</p>
+                          <ul>
+                          <li><b><code>ノード名を生成</code></b></li>
+                          </ul><p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>
+                         `
+            }
+        },
+        {
+            title: {
+                "en-US": "Node Updates",
+                "ja": "ノードの更新"
+            },
+            // image: "images/",
+            description: {
+                "en-US": `<ul>
+                            <li>The Debug node can be configured to count messages it receives</li>
+                            <li>The Link Call node can use a message property to dynamically target the link it should call</li>
+                            <li>The HTTP Request node can be preconfigured with HTTP headers</li>
+                          </ul>`,
+                "ja": `<ul>
+                         <li>Debugノードは、受信したメッセージの数をカウントするよう設定できるようになりました。</li>
+                         <li>Link Callノードは、メッセージのプロパティによって、呼び出し対象のlinkを動的に指定できるようになりました。</li>
+                         <li>HTTP Requestノードは、HTTPヘッダを事前設定できるようになりました。</li>
+                       </ul>`
+            }
+        }
+    ]
+}

packages/node_modules/@node-red/editor-client/src/tours/welcome.js

@@ -1,137 +1,97 @@
 export default {
-    version: "3.0.0",
+    version: "3.1.0-beta.1",
     steps: [
         {
             titleIcon: "fa fa-map-o",
             title: {
-                "en-US": "Welcome to Node-RED 3.0!",
+                "en-US": "Welcome to Node-RED 3.1 Beta 1!",
-                "ja": "Node-RED 3.0へようこそ!"
+                // "ja": "Node-RED 3.1へようこそ!"
             },
             description: {
-                "en-US": "<p>Let's take a moment to discover the new features in this release.</p>",
+                "en-US": "<p>This is the first beta release for 3.1.0 and we have a few new features to tell you about.</p>",
-                "ja": "<p>本リリースの新機能を見つけてみましょう。</p>"
+                // "ja": ""
             }
         },
         {
             title: {
-                "en-US": "Context Menu",
+                "en-US": "Improved Context Menu",
-                "ja": "コンテキストメニュー"
+                // "ja": ""
             },
             image: 'images/context-menu.png',
             description: {
-                "en-US": `<p>The editor now has its own context menu when you
+                "en-US": `<p>The editor's context menu has been expanded to make lots more of
-                          right-click in the workspace.</p>
+                        the built-in actions available.</p>
-                          <p>This makes many of the built-in actions much easier
+                        <p>Adding nodes, working with groups and plenty
-                          to access.</p>`,
+                        of other useful tools are now just a click away.</p>
-                "ja": `<p>ワークスペースで右クリックすると、エディタに独自のコンテキストメニューが表示されるようになりました。</p>
+                        <p>The flow tab bar also has its own context menu to make working
-                       <p>これによって多くの組み込み動作を、より簡単に利用できます。</p>`
+                        with your flows much easier.</p>`,
+                // "ja": ``
             }
         },
         {
             title: {
-                "en-US": "Wire Junctions",
+                "en-US": "Hiding Flows",
-                "ja": "分岐点をワイヤーに追加"
+                // "ja": ""
             },
-            image: 'images/junction-slice.gif',
+            image: 'images/hiding-flows.png',
             description: {
-                "en-US": `<p>To make it easier to route wires around your flows,
+                "en-US": `<p>Hiding flows is now done through the flow context menu.</p>
-                             it is now possible to add junction nodes that give
+                          <p>The 'hide' button in previous releases has been removed from the tabs
-                             you more control.</p>
+                             as they were being clicked accidentally too often.</p>`,
-                          <p>Junctions can be added to wires by holding both the Alt key and the Shift key
+                // "ja": ``
-                          then click and drag the mouse across the wires.</p>`,
-                "ja": `<p>フローのワイヤーの経路をより制御しやすくするために、分岐点ノードを追加できるようになりました。</p>
-                       <p>Altキーとシフトキーを押しながらマウスをクリックし、ワイヤーを横切るようにドラッグすることで、分岐点を追加できます。</p>`
             },
         },
         {
             title: {
-                "en-US": "Wire Junctions",
+                "en-US": "Locking Flows",
-                "ja": "分岐点をワイヤーに追加"
+                // "ja": ""
             },
-            image: 'images/junction-quick-add.png',
+            image: 'images/locking-flows.png',
             description: {
-                "en-US": `<p>Junctions can also be added using the quick-add dialog.</p>
+                "en-US": `<p>Flows can now be locked to prevent accidental changes being made.</p>
-                          <p>The dialog is opened by holding the Ctrl (or Cmd) key when
+                          <p>When locked you cannot modify the nodes in any way.</p>
-                             clicking in the workspace.</p>`,
+                          <p>The flow context menu provides the options to lock and unlock flows,
-                "ja": `<p>クイック追加ダイアログを用いて、分岐点を追加することもできます。</p>
+                             as well as in the Info sidebar explorer.</p>`,
-                       <p>本ダイアログを開くには、Ctrl(またはCmd)キーを押しながら、ワークスペース上でクリックします。</p>`
+                // "ja": ``
             },
         },
         {
             title: {
-                "en-US": "Debug Path Tooltip",
+                "en-US": "Adding Images to node/flow descriptions",
-                "ja": "デバッグパスのツールチップ"
+                // "ja": ""
             },
-            image: 'images/debug-path-tooltip.png',
+            // image: 'images/debug-path-tooltip.png',
             description: {
-                "en-US": `<p>When hovering over a node name in the Debug sidebar, a
+                "en-US": `<p>You can now add images to a node's or flows's description.</p>
-                             new tooltip shows the full location of the node.</p>
+                          <p>Simply drag the image into the text editor and it will get added inline.</p>
-                          <p>This is useful when working with subflows, making it
+                          <p>When the description is shown in the Info sidebar, the image will be displayed.`,
-                             much easier to identify exactly which node generated
+                // "ja": ``
-                             the message.</p>
-                          <p>Clicking on any item in the list will reveal it in
-                             the workspace.</p>`,
-                "ja": `<p>デバックサイドバー内のノード名の上にマウスカーソルを乗せると、新たにツールチップが表示され、ノードの場所が分かるようになっています。</p>
-                       <p>これは、サブフローを用いる時に役立つ機能であり、メッセージがどのノードから出力されたかを正確に特定することが遥かに簡単になります。</p>
-                       <p>本リスト内の要素をクリックすると、ワークスペース内にその要素が表示されます。</p>`
             },
         },
         {
             title: {
-                "en-US": "Continuous Search",
+                "en-US": "Adding Mermaid Diagrams",
-                "ja": "連続した検索"
+                // "ja": ""
             },
-            image: 'images/continuous-search.png',
+            image: 'images/mermaid.png',
             description: {
-                "en-US": `<p>When searching for things in the editor, a new toolbar in
+                "en-US": `<p>You can also add <a href="https://github.com/mermaid-js/mermaid">Mermaid</a> diagrams directly into your node or flow descriptions.</p>
-                             the workspace provides options to quickly jump between
+                          <p>This gives you much richer options for documenting your flows.</p>`,
-                             the search results.</p>`,
+                // "ja": ``
-                "ja": `<p>ワークスペース内の新しいツールバーにあるオプションによって、エディタ内を検索する際に、検索結果の間を素早く移動できます。</p>`
             },
         },
         {
             title: {
-                "en-US": "New wiring actions",
+                "en-US": "Managing Global Environment Variables",
-                "ja": "新しいワイヤー操作"
+                // "ja": ""
             },
-            image: "images/split-wire-with-links.gif",
+            image: 'images/global-env-vars.png',
             description: {
-                "en-US": `<p>A new action has been added that will replace a wire with a pair of connected Link nodes:</p>
+                "en-US": `<p>You can set environment variables that apply to all nodes and flows in the new
-                          <ul>
+                          'Global Environment Variables' section of User Settings.</p>`,
-                          <li><b><code>Split Wire With Link Nodes</code></b></li>
+                // "ja": ``
-                          </ul>
-                          <p>Actions can be accessed from the Action List in the main menu.</p>`,
-                "ja": `<p>ワイヤーを、接続されたLinkノードのペアに置き換える動作が新たに追加されました:</p>
-                       <ul>
-                       <li><b><code>ワイヤーをlinkノードで分割</code></b></li>
-                       </ul>
-                       <p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>`,
             },
         },
-        {
-            title: {
-                "en-US": "Default node names",
-                "ja": "標準ノードの名前"
-            },
-            // image: "images/",
-            description: {
-                "en-US": `<p>Some nodes have been updated to generate a unique name when
-                             new instances are added to the workspace. This applies to
-                             <code>Debug</code>, <code>Function</code> and <code>Link</code> nodes.</p>
-                          <p>A new action has also been added to generate default names for the selected
-                             nodes:</p>
-                             <ul>
-                             <li><b><code>Generate Node Names</code></b></li>
-                             </ul><p>Actions can be accessed from the Action List in the main menu.</p>
-                            `,
-                "ja": `<p>一部のノードは、ワークスペース上に新インスタンスとして追加した際に、一意の名前を付けるよう変更されました。この変更は、<code>Debug</code>、<code>Function</code>、<code>Link</code>ノードに適用されています。</p>
-                       <p>選択したノードに対して、標準の名前を生成する動作も新たに追加されました:</p>
-                          <ul>
-                          <li><b><code>ノード名を生成</code></b></li>
-                          </ul><p>本アクションは、メインメニュー内の動作一覧から呼び出せます。</p>
-                         `
-            }
-        },
         {
             title: {
                 "en-US": "Node Updates",
@@ -139,16 +99,9 @@ export default {
             },
             // image: "images/",
             description: {
-                "en-US": `<ul>
+                "en-US": `<p>The core nodes have received lots of minor fixes, documentation updates and
-                            <li>The Debug node can be configured to count messages it receives</li>
+                          small enhancements. Check the full changelog in the Help sidebar for a full list.</p>`,
-                            <li>The Link Call node can use a message property to dynamically target the link it should call</li>
+                // "ja": ``
-                            <li>The HTTP Request node can be preconfigured with HTTP headers</li>
-                          </ul>`,
-                "ja": `<ul>
-                         <li>Debugノードは、受信したメッセージの数をカウントするよう設定できるようになりました。</li>
-                         <li>Link Callノードは、メッセージのプロパティによって、呼び出し対象のlinkを動的に指定できるようになりました。</li>
-                         <li>HTTP Requestノードは、HTTPヘッダを事前設定できるようになりました。</li>
-                       </ul>`
             }
         }
     ]