Freeze/interactive tutorials: edits per reviews

CONTRIBUTING.md

@@ -115,7 +115,7 @@ At a minimum, most pages should have `html`, `parent` and `blurb` fields (plus t
 | `skip_spell_checker` | Boolean          | Use `true` to make the Dactyl's style checker skip spell-checking this page. |
 | `filters`            | Array of Strings | A list of additional filters to use on this page. [Filters](https://github.com/ripple/dactyl/blob/master/README.md#filters) are Python scripts that provide additional pre- or post-processing of page contents. |
 | `canonical_url`      | String           | Provides the canonical URL for a page that takes query parameters. Search engines and other tools may use this when linking to the page. |
-| `embed_ripple_lib`   | Boolean          | Use `true` to have the latest version of ripple-lib and its dependencies loaded on the page. |
+| `embed_xrpl_js`      | Boolean          | Use `true` to have the latest version of [xrpl.js](https://js.xrpl.org) loaded on the page. |
 
 ### Conventions
 

assets/js/tutorials/enable-no-freeze.js

@@ -47,10 +47,10 @@ $(document).ready(() => {
         <pre><code>${pretty_print(flags)}</code></pre>`)
     if (flags.lsfNoFreeze) {
       block.find(".output-area").append(`<p><i class="fa fa-check-circle"></i>
-          No Freeze is enabled.</p>`)
+          No Freeze flag is enabled.</p>`)
     } else {
       block.find(".output-area").append(`<p><i class="fa fa-times-circle"></i>
-          No Freeze Tag is DISABLED.</p>`)
+          No Freeze flag is DISABLED.</p>`)
     }
 
     complete_step("Confirm Settings")

assets/js/tutorials/enact-global-freeze.js

@@ -3,8 +3,8 @@
 // The code for these steps is handled by interactive-tutorial.js
 $(document).ready(() => {
 
-  // 3. Send AccountSet --------------------------------------------------------
-  // also 6. Send AccountSet to end the freeze.
+  // 3. Send AccountSet to Start the Freeze ------------------------------------
+  // also 6. Send AccountSet to End the Freeze.
   $(".send-accountset").click( async (event) => {
     const block = $(event.target).closest(".interactive-block")
     const address = get_address(event)
@@ -17,10 +17,10 @@ $(document).ready(() => {
     let step_name
     if ($(event.target).data("action") === "start_freeze") {
       astx["SetFlag"] = xrpl.AccountSetAsfFlags.asfGlobalFreeze
-      step_name = "Send AccountSet"
+      step_name = "Send AccountSet (Start Freeze)"
     } else if ($(event.target).data("action") === "end_freeze") {
       astx["ClearFlag"] = xrpl.AccountSetAsfFlags.asfGlobalFreeze
-      step_name = "End Freeze"
+      step_name = "Send AccountSet (End Freeze)"
     } else {
       show_error(block, "There was an error with this tutorial: the button clicked must have data-action defined.")
     }
@@ -60,10 +60,10 @@ $(document).ready(() => {
         <pre><code>${pretty_print(flags)}</code></pre>`)
     if (flags.lsfGlobalFreeze) {
       block.find(".output-area").append(`<p><i class="fa fa-check-circle"></i>
-          Global Freeze is enabled.</p>`)
+          Global Freeze flag is enabled.</p>`)
     } else {
       block.find(".output-area").append(`<p><i class="fa fa-times-circle"></i>
-          Global Freeze Tag is DISABLED.</p>`)
+          Global Freeze flag is DISABLED.</p>`)
     }
 
     complete_step("Confirm Settings")
@@ -73,7 +73,7 @@ $(document).ready(() => {
 
   // 7. Wait for Validation: handled by generic full send as before.
 
-  // 8. Confirm Account Settings (freeze ended)
+  // 8. Confirm Account Settings (Freeze Ended)
   $("#confirm-settings-end").click( async (event) => {
     const block = $(event.target).closest(".interactive-block")
     const address = get_address(event)

assets/js/tutorials/freeze-individual-line.js

@@ -89,8 +89,8 @@ $(document).ready(() => {
     complete_step("Choose Trust Line")
   })
 
-  // 4. Send TrustSet to freeze ------------------------------------------------
-  // also 7. Send TrustSet to end the freeze
+  // 4. Send TrustSet to Freeze ------------------------------------------------
+  // also 7. Send TrustSet to End the Freeze
   $(".send-trustset").click( async (event) => {
     const block = $(event.target).closest(".interactive-block")
     const address = get_address(event)
@@ -128,7 +128,8 @@ $(document).ready(() => {
     }
   })
 
-  // 5. Wait for Validation is handled by the snippet
+  // 5. Wait for Validation: handled by interactive-tutorial.js and by the
+  // generic full send in the previous step. -----------------------------------
 
   // 6. Check Trust Line Freeze Status
   $("#confirm-settings").click( async (event) => {
@@ -171,6 +172,6 @@ $(document).ready(() => {
     show_error(block, `Couldn't find a ${CURRENCY_TO_FREEZE} line between ${address} and ${peer.address}`)
   })
 
-  // 7. Send TrustSet to End the Freeze is covered by the shared handler above
+  // 7. Send TrustSet to End the Freeze: same handler as step 4
 
 })

content/_code-samples/freeze/js/check-global-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
   var { AccountRootFlags } = require('xrpl/dist/npm/models/ledger')
 }

content/_code-samples/freeze/js/check-individual-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/freeze/js/check-no-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/freeze/js/set-global-freeze-with-checks.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/freeze/js/set-global-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/freeze/js/set-individual-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/freeze/js/set-no-freeze.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/issue-a-token/js/issue-a-token.js

@@ -4,7 +4,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/require-destination-tags/require-destination-tags.js

@@ -4,7 +4,7 @@
 // Dependencies for Node.js.
 // In browsers, use <script> tags as in the example demo.html.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/send-xrp/js/send-xrp.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use a <script> tag instead.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/_code-samples/use-tickets/js/use-tickets.js

@@ -1,7 +1,7 @@
 // Dependencies for Node.js.
 // In browsers, use a <script> tag instead.
 if (typeof module !== "undefined") {
-  // gotta use var here because const/let are block-scoped to the if statement.
+  // Use var here because const/let are block-scoped to the if statement.
   var xrpl = require('xrpl')
 }
 

content/references/xrpljs2-migration-guide.md

@@ -11,7 +11,7 @@ Follow these instructions to migrate JavaScript / TypeScript code using the **ri
 
 ## High-Level Differences
 
-Many fields and functions have "new" names in xrpl.js v2.0; or more accurately, xrpl.js now uses the same names as the [HTTP / WebSocket APIs](rippled-api.html). Structures that were unique to ripple-lib such as an "orderCancellation" object are gone; in their place the library uses the XRP Ledger's native [transaction types](transaction-types.html) like "OfferCancel". Many API methods that return these structures in ripple-lib 1.x are gone; instead, you'll make requests and get responses in the same format as in the WebSocket API.
+Many fields and functions have "new" names in xrpl.js v2.0; or more accurately, xrpl.js now uses the same names as the [HTTP / WebSocket APIs](rippled-api.html). Structures that were unique to ripple-lib such as an "orderCancellation" object are gone; in their place the library uses the XRP Ledger's native [transaction types](transaction-types.html) like "OfferCancel". Many API methods that return these structures in ripple-lib 1.x are gone; with 2.0, you make requests and get responses in the same format as in the WebSocket API.
 
 The catch-all `RippleAPI` class from ripple-lib 1.x is also gone. With xrpl.js 2.x, there's a `Client` class to handle network operations, and all other operations are strictly offline. There's a new `Wallet` class for addresses & keys, and other classes and properties under the top-level `xrpl` object.
 

content/tutorials/get-started/send-xrp.ja.md

@@ -3,7 +3,7 @@ html: send-xrp.html
 parent: get-started.html
 blurb: Test Netを使用してXRPの送金をテストします。
 cta_text: XRPを送金しよう
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
     - interactive_steps
     - include_code

content/tutorials/get-started/send-xrp.md

@@ -3,7 +3,7 @@ html: send-xrp.html
 parent: get-started.html
 blurb: Learn how to send test payments right from your browser.
 cta_text: Send XRP
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -58,7 +58,7 @@ The secret key shown here is for example only. For development purposes, you can
 
 {% include '_snippets/interactive-tutorials/generate-step.md' %}
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 
 ### {{n.next()}}. Connect to a Testnet Server
@@ -83,7 +83,7 @@ _Java_
 
 <!-- MULTICODE_BLOCK_END -->
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 

content/tutorials/manage-account-settings/require-destination-tags.md

@@ -2,7 +2,7 @@
 html: require-destination-tags.html
 parent: manage-account-settings.html
 blurb: Require users to specify a destination tag when sending to your address.
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -37,7 +37,7 @@ To transact on the XRP Ledger, you need an address and secret key, and some XRP.
 
 {% include '_snippets/interactive-tutorials/generate-step.md' %}
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 ### {{n.next()}}. Connect to the Network
 
@@ -45,7 +45,7 @@ You must be connected to the network to submit transactions to it. The following
 
 {{ include_code("_code-samples/get-started/js/base.js", language="js") }}
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 

content/tutorials/manage-account-settings/use-tickets.md

@@ -2,7 +2,7 @@
 html: use-tickets.html
 parent: manage-account-settings.html
 blurb: Use Tickets to send a transaction outside of normal Sequence order.
-embed_ripple_lib: true
+embed_xrpl_js: true
 status: not_enabled
 filters:
   - interactive_steps
@@ -46,7 +46,7 @@ To transact on the XRP Ledger, you need an address and secret key, and some XRP.
 
 {% include '_snippets/interactive-tutorials/generate-step.md' %}
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 
 ### {{n.next()}}. Connect to Network
@@ -63,7 +63,7 @@ _JavaScript_
 
 **Note:** The code samples in this tutorial use JavaScript's [`async`/`await` pattern](https://javascript.info/async-await). Since `await` needs to be used from within an `async` function, the remaining code samples are written to continue inside the `main()` function started here. You can also use Promise methods `.then()` and `.catch()` instead of `async`/`await` if you prefer.
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 

content/tutorials/use-tokens/enable-no-freeze.md

@@ -2,7 +2,7 @@
 html: enable-no-freeze.html
 parent: use-tokens.html
 blurb: Permanently give up your account's ability to freeze tokens it issues.
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -43,7 +43,7 @@ For this tutorial, you can get credentials from the following interface:
 
 {% include '_snippets/interactive-tutorials/generate-step.md' %}
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 
 ### {{n.next()}}. Connect to the Network
@@ -58,7 +58,7 @@ _JavaScript_
 
 <!-- MULTICODE_BLOCK_END -->
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 

content/tutorials/use-tokens/enact-global-freeze.md

@@ -2,7 +2,7 @@
 html: enact-global-freeze.html
 parent: use-tokens.html
 blurb: Freeze all tokens issued by your address.
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -46,7 +46,7 @@ For this tutorial, you can get credentials from the following interface:
 
 {% include '_snippets/interactive-tutorials/generate-step.md' %}
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 
 ### {{n.next()}}. Connect to the Network
@@ -61,12 +61,12 @@ _JavaScript_
 
 <!-- MULTICODE_BLOCK_END -->
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 
 
-### {{n.next()}}. Send AccountSet Transaction to Enact the Freeze
+### {{n.next()}}. Send AccountSet Transaction to Start the Freeze
 
 To enable the Global Freeze setting, send an [AccountSet transaction][] with a `SetFlag` field containing the [`asfGlobalFreeze` value (`7`)](accountset.html#accountset-flags). To send the transaction, you first _prepare_ it to fill out all the necessary fields, then _sign_ it with your account's secret key, and finally _submit_ it to the network.
 
@@ -101,7 +101,7 @@ _WebSocket_
 
 <!-- MULTICODE_BLOCK_END -->
 
-{{ start_step("Send AccountSet") }}
+{{ start_step("Send AccountSet (Start Freeze)") }}
 <button class="btn btn-primary previous-steps-required send-accountset" data-wait-step-name="Wait" data-action="start_freeze">Send AccountSet</button>
 <div class="loader collapse"><img class="throbber" src="assets/img/xrp-loader-96.png">Sending...</div>
 <div class="output-area"></div>
@@ -225,7 +225,7 @@ _WebSocket_
 
 <!-- MULTICODE_BLOCK_END -->
 
-{{ start_step("End Freeze") }}
+{{ start_step("Send AccountSet (End Freeze)") }}
 <button class="btn btn-primary previous-steps-required send-accountset" data-wait-step-name="Wait (again)" data-action="end_freeze">Send AccountSet (end the freeze)</button>
 <div class="loader collapse"><img class="throbber" src="assets/img/xrp-loader-96.png">Sending...</div>
 <div class="output-area"></div>

content/tutorials/use-tokens/freeze-a-trust-line.md

@@ -2,7 +2,7 @@
 html: freeze-a-trust-line.html
 parent: use-tokens.html
 blurb: Freeze an individual holder of a token.
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -69,7 +69,7 @@ For purposes of this tutorial, use the following interface to connect and perfor
 
 ### {{n.next()}}. Choose Trust Line
 
-You can only freeze one trust line per transaction, so you need to know which one you want. A trust line is uniquely identified by these 3 things:
+You can only freeze one trust line per transaction, so you need to know which trust line you want. Each of your trust lines is uniquely identified by these 3 things:
 
 - Your own address.
 - The address of the account linked to yours via the trust line.
@@ -188,7 +188,7 @@ _WebSocket_
 <div class="output-area"></div>
 {{ end_step() }}
 
-**Note:** If you want to freeze multiple trust lines in different currencies with the same counterparty, repeat this step for each one, choosing a different currency code each time. It is possible to send several transactions in a single ledger if you use different [sequence numbers](basic-data-types.html#account-sequence) for each. <!--{# TODO: link rapid/batch submission guidelines when https://github.com/XRPLF/xrpl-dev-portal/issues/1025 is done #}-->
+**Note:** If you want to freeze multiple trust lines in different currencies with the same counterparty, repeat this step for each trust line. It is possible to send several transactions in a single ledger if you use a different [sequence number](basic-data-types.html#account-sequence) for each transaction. <!--{# TODO: link rapid/batch submission guidelines when https://github.com/XRPLF/xrpl-dev-portal/issues/1025 is done #}-->
 
 
 ### {{n.next()}}. Wait for Validation

content/tutorials/use-tokens/issue-a-fungible-token.md

@@ -2,7 +2,7 @@
 html: issue-a-fungible-token.html
 parent: use-tokens.html
 blurb: Create your own token and issue it on the XRP Ledger Testnet.
-embed_ripple_lib: true
+embed_xrpl_js: true
 filters:
   - interactive_steps
   - include_code
@@ -60,7 +60,7 @@ In this tutorial, the hot address receives the tokens you issue from the cold ad
 
 **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, **do not** use the same addresses on Testnet/Devnet and Mainnet.
 
-When you're [building actual production-ready software](production-readiness.html), you'll instead use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
+When you're [building production-ready software](production-readiness.html), you should use an existing account, and manage your keys using a [secure signing configuration](set-up-secure-signing.html).
 
 
 ### {{n.next()}}. Connect to the Network
@@ -86,7 +86,7 @@ _Java_
 
 **Note:** The JavaScript code samples in this tutorial use the [`async`/`await` pattern](https://javascript.info/async-await). Since `await` needs to be used from within an `async` function, the remaining code samples are written to continue inside the `main()` function started here. You can also use Promise methods `.then()` and `.catch()` instead of `async`/`await` if you prefer.
 
-For this tutorial, you can connect directly from your browser by pressing the following button:
+For this tutorial, click the following button to connect:
 
 {% include '_snippets/interactive-tutorials/connect-step.md' %}
 

dactyl-config.yml

@@ -3777,7 +3777,7 @@ pages:
         html: xrp-ledger-toml-checker.html
         parent: dev-tools.html
         template: page-toml-checker.html.jinja
-        embed_ripple_lib: true
+        embed_xrpl_js: true
         targets:
             - en
             - ja
@@ -3820,7 +3820,7 @@ pages:
         html: tx-sender.html
         parent: dev-tools.html
         template: page-tx-sender.html.jinja
-        embed_ripple_lib: true
+        embed_xrpl_js: true
         targets:
             - en
             - ja

template/base.html.jinja

@@ -143,7 +143,7 @@ $(document).ready(() => {
 })
 </script>
 
-{% if currentpage.embed_ripple_lib %}
+{% if currentpage.embed_xrpl_js %}
 <!-- ripple-lib & prerequisites -->
 {{currentpage.ripple_lib_tag}}
 {% endif %}

tool/INTERACTIVE_TUTORIALS_README.md

@@ -51,12 +51,12 @@ For privacy reasons, the memo does not and MUST NOT include personally identifyi
 
 An interactive tutorial is a page, so you add it to the `dactyl-config.yml` page like any other page. However, you need to add the following pieces to make the interactive stuff work:
 
-1. Set page properties, either in the config file or the page's frontmatter. The `interactive_steps` Dactyl filter gives you access to the functions you use to demarcate the interactive bits in your markdown file. The `include_code` filter is optional, but can be useful for pulling code samples out of another file. Most of the time, you'll also want to include xrpl.js and its dependencies as well; you can have the templates handle that for you by setting the field `embed_ripple_lib: true`. For example:
+1. Set page properties, either in the config file or the page's frontmatter. The `interactive_steps` Dactyl filter gives you access to the functions you use to demarcate the interactive bits in your markdown file. The `include_code` filter is optional, but can be useful for pulling code samples out of another file. Most of the time, you'll also want to include xrpl.js and its dependencies as well; you can have the templates handle that for you by setting the field `embed_xrpl_js: true`. For example:
 
         html: use-tickets.html
         parent: manage-account-settings.html
         blurb: Use Tickets to send a transaction outside of normal Sequence order.
-        embed_ripple_lib: true
+        embed_xrpl_js: true
         filters:
             - interactive_steps
             - include_code