Improve & refactor interactive tutorial code

Interactive tutorials: more consistent style

Interactive tutorials: Use new generics for send-xrp, use-tickets

Interactive tutorials: clean up now-unused code

Interactive tutorials: progress & debugging of errors

Interactive: Require Destination Tags; and related

- Validate addresses in Transaction Sender and warn on Mainnet X-address
- Option to load destination address from query param in Tx Sender
- Some more/updated helpers in interactive tutorial JS

Interactive tutorials: fix JA version

Interactive tutorials: readme, include code filter (incomplete)

Interactive tutorials: improvements for consistency

Interactive Tutorials: finish readme

Interactive tutorials: fix syntax errors

content/_snippets/interactive-tutorials/connect-step.ja.md

@@ -0,0 +1,17 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set ws_url = "wss://s.altnet.rippletest.net:51233" %}
+  {% set use_network = "Testnet" %}
+{% elif use_network == "Devnet" %}
+  {% set ws_url = "wss://s.devnet.rippletest.net:51233" %}
+{% elif use_network == "Mainnet" %}
+  {% set ws_url = "wss://xrplcluster.com" %}
+{% endif %}
+
+{{ start_step("Connect") }}
+<button id="connect-button" class="btn btn-primary" data-wsurl="{{ws_url}}">{{use_network}}に接続する</button>
+<div>
+  <strong>接続ステータス：</strong>
+  <span id="connection-status">接続されていません</span>
+  <div class="loader collapse" id="loader-connect"><img class="throbber" src="assets/img/xrp-loader-96.png"></div>
+</div>
+{{ end_step() }}

content/_snippets/interactive-tutorials/connect-step.md

@@ -0,0 +1,17 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set ws_url = "wss://s.altnet.rippletest.net:51233" %}
+  {% set use_network = "Testnet" %}
+{% elif use_network == "Devnet" %}
+  {% set ws_url = "wss://s.devnet.rippletest.net:51233" %}
+{% elif use_network == "Mainnet" %}
+  {% set ws_url = "wss://xrplcluster.com" %}
+{% endif %}
+
+{{ start_step("Connect") }}
+<button id="connect-button" class="btn btn-primary" data-wsurl="{{ws_url}}">Connect to {{use_network}}</button>
+<div>
+  <strong>Connection status:</strong>
+  <span id="connection-status">Not connected</span>
+  <div class="loader collapse" id="loader-connect"><img class="throbber" src="assets/img/xrp-loader-96.png"></div>
+</div>
+{{ end_step() }}

content/_snippets/interactive-tutorials/generate-step.ja.md

@@ -0,0 +1,15 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set use_network = "Testnet" %}
+  {% set faucet_url = "https://faucet.altnet.rippletest.net/accounts" %}
+{% elif use_network == "Devnet" %}
+  {% set faucet_url = "https://faucet.devnet.rippletest.net/accounts" %}
+{# No faucet for Mainnet! #}
+{% endif %}
+
+{{ start_step("Generate") }}
+<button id="generate-creds-button" class="btn btn-primary" data-fauceturl="{{faucet_url}}">{{use_network}}の暗号鍵を作成する</button>
+<div class="loader collapse"><img class="throbber" src="assets/img/xrp-loader-96.png">暗号鍵を作成しています…</div>
+<div class="output-area"></div>
+{{ end_step() }}
+
+**注意:** Rippleは[TestnetとDevnet](parallel-networks.html)をテストの目的でのみ運用しており、その状態とすべての残高を定期的にリセットしています。予防措置として、Testnet、DevnetとMainnetで同じアドレスを使用**しない**ことをお勧めします。

content/_snippets/interactive-tutorials/generate-step.md

@@ -0,0 +1,15 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set use_network = "Testnet" %}
+  {% set faucet_url = "https://faucet.altnet.rippletest.net/accounts" %}
+{% elif use_network == "Devnet" %}
+  {% set faucet_url = "https://faucet.devnet.rippletest.net/accounts" %}
+{# No faucet for Mainnet! #}
+{% endif %}
+
+{{ start_step("Generate") }}
+<button id="generate-creds-button" class="btn btn-primary" data-fauceturl="{{faucet_url}}">Get {{use_network}} credentials</button>
+<div class="loader collapse"><img class="throbber" src="assets/img/xrp-loader-96.png">Generating Keys...</div>
+<div class="output-area"></div>
+{{ end_step() }}
+
+**Caution:** Ripple provides the [Testnet and Devnet](parallel-networks.html) for testing purposes only, and sometimes resets the state of these test networks along with all balances. As a precaution, Ripple recommends **not** using the same addresses on Testnet/Devnet and Mainnet.

content/_snippets/interactive-tutorials/wait-step.ja.md

@@ -0,0 +1,27 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set explorer_url = "https://testnet.xrpl.org" %}
+{% elif use_network == "Devnet" %}
+  {% set explorer_url = "https://devnet.xrpl.org" %}
+{% elif use_network == "Mainnet" %}
+  {% set explorer_url = "https://livenet.xrpl.org" %}
+{% endif %}
+
+<table class="wait-step" data-explorerurl="{{explorer_url}}">
+  <tr>
+    <th>トランザクションのID:</th>
+    <td class="waiting-for-tx">(無）</td>
+  <tr>
+    <th>最新の検証レジャーインデックス：</th>
+    <td class="validated-ledger-version">接続されていません</td>
+  </tr>
+  <tr>
+    <th>送信時のレジャーインデックス：</th>
+    <td class="earliest-ledger-version">（まだ送信されません）</td>
+  </tr>
+  <tr>
+    <th>トランザクションの<code>LastLedgerSequence</code>:</th>
+    <td class="lastledgersequence">(準備されません）</td>
+  </tr>
+  <tr class="tx-validation-status">
+  </tr>
+</table>

content/_snippets/interactive-tutorials/wait-step.md

@@ -0,0 +1,27 @@
+{% if use_network is undefined or use_network == "Testnet" %}
+  {% set explorer_url = "https://testnet.xrpl.org" %}
+{% elif use_network == "Devnet" %}
+  {% set explorer_url = "https://devnet.xrpl.org" %}
+{% elif use_network == "Mainnet" %}
+  {% set explorer_url = "https://livenet.xrpl.org" %}
+{% endif %}
+
+<table class="wait-step" data-explorerurl="{{explorer_url}}">
+  <tr>
+    <th>Transaction ID:</th>
+    <td class="waiting-for-tx">(None)</td>
+  <tr>
+    <th>Latest Validated Ledger Index:</th>
+    <td class="validated-ledger-version">(Not connected)</td>
+  </tr>
+  <tr>
+    <th>Ledger Index at Time of Submission:</th>
+    <td class="earliest-ledger-version">(Not submitted)</td>
+  </tr>
+  <tr>
+    <th>Transaction <code>LastLedgerSequence</code>:</th>
+    <td class="lastledgersequence">(Not prepared)</td>
+  </tr>
+  <tr class="tx-validation-status">
+  </tr>
+</table>