consistent tut subdirs

This commit is contained in:
ddawson
2024-03-05 13:22:52 -08:00
committed by Amarantha Kulkarni
parent e6c26969b1
commit 5679fc64e0
102 changed files with 338 additions and 346 deletions

View File

@@ -0,0 +1,641 @@
---
html: create-accounts-send-xrp-using-javascript.html
parent: send-payments-using-javascript.html
seo:
description: Create two accounts and transfer XRP between them.
labels:
- Accounts
- Quickstart
- Transaction Sending
- XRP
---
# Create Accounts and Send XRP Using JavaScript
This example shows how to:
1. Create accounts on the Testnet, funded with 1000 test XRP with no actual value.
2. Retrieve the accounts from seed values.
3. Transfer XRP between accounts.
When you create an account, you receive a public/private key pair offline. Your account does not appear on the ledger until it is funded with XRP. This example shows how to create accounts for Testnet, but not how to create an account that you can use on Mainnet.
[![Token Test Harness](/docs/img/quickstart2.png)](/docs/img/quickstart2.png)
## Prerequisites
To get started, create a new folder on your local disk and install the JavaScript library using `npm`.
```
npm install xrpl
```
Download and expand the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> archive.
**Note:** Without the Quickstart Samples, you will not be able to try the examples that follow.
## Usage
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/YnPccLPa0hc?si=U6uQNXzNRp5G_pri" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
To get test accounts:
1. Open `1.get-accounts-send-xrp.html` in a browser
2. Choose **Testnet** or **Devnet**.
3. Click **Get New Standby Account**.
4. Click **Get New Operational Account.**
5. Copy and paste the **Seeds** field in a persistent location, such as a Notepad, so that you can reuse the accounts after reloading the form.
[![Standby and Operational Accounts](/docs/img/quickstart3.png)](/docs/img/quickstart3.png)
You can transfer XRP between your new accounts. Each account has its own fields and buttons.
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/l2X7Vso5wWc?si=62bRYEd-pTrfhWbJ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
To transfer XRP from the Standby account to the Operational account:
1. On the Standby (left) side of the form, enter the **Amount** of XRP to send.
2. Copy and paste the **Operational Account** field to the Standby **Destination** field.
3. Click **Send XRP>** to transfer XRP from the standby account to the operational account
To transfer XRP from the Operational account to the Standby account:
1. On the Operational (right) side of the form, enter the **Amount** of XRP to send.
2. Copy and paste the **Standby Account** field to the Operational **Destination** field.
3. Click **&lt;Send XRP** to transfer XRP from the Operational account to the Standby account.
[![Transferred XRP](/docs/img/quickstart4.png)](/docs/img/quickstart4.png)
# Code Walkthrough
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> in the source repository for this website.
## ripplex-1-send-xrp.js
This example can be used with any XRP Ledger network, _Testnet_, or _Devnet_. You can update the code to choose different or additional XRP Ledger networks.
### getNet()
<!-- SPELLING_IGNORE: getnet -->
```javascript
// ******************************************************
// ************* Get the Preferred Network **************
// ******************************************************
function getNet() {
```
This function uses brute force `if` statements to discover the selected network instance and return the URI.
```javascript
let net
if (document.getElementById("tn").checked) net = "wss://s.altnet.rippletest.net:51233"
if (document.getElementById("dn").checked) net = "wss://s.devnet.rippletest.net:51233"
return net
} // End of getNet()
```
### getAccount(type)
<!-- SPELLING_IGNORE: getaccount -->
```javascript
// *******************************************************
// ************* Get Account *****************************
// *******************************************************
async function getAccount(type) {
```
Get the selected ledger.
```javascript
let net = getNet()
```
Instantiate a client.
```javascript
const client = new xrpl.Client(net)
```
Use the _results_ variable to capture progress information.
```javascript
results = 'Connecting to ' + net + '....'
```
Use the default faucet using a _null_ value.
```javascript
let faucetHost = null
```
Report progress in the appropriate results field.
```javascript
if (type == 'standby') {
standbyResultField.value = results
} else {
operationalResultField.value = results
}
```
Connect to the server.
```javascript
await client.connect()
results += '\nConnected, funding wallet.'
if (type == 'standby') {
standbyResultField.value = results
} else {
operationalResultField.value = results
}
```
Create and fund a test account.
```javascript
const my_wallet = (await client.fundWallet(null, { faucetHost })).wallet
results += '\nGot a wallet.'
if (type == 'standby') {
standbyResultField.value = results
} else {
operationalResultField.value = results
}
```
Get the current XRP balance for the account.
```javascript
const my_balance = (await client.getXrpBalance(my_wallet.address))
```
If this is a standby account, populate the standby account fields.
```javascript
if (type == 'standby') {
standbyAccountField.value = my_wallet.address
standbyPubKeyField.value = my_wallet.publicKey
standbyPrivKeyField.value = my_wallet.privateKey
standbyBalanceField.value = (await client.getXrpBalance(my_wallet.address))
standbySeedField.value = my_wallet.seed
results += '\nStandby account created.'
standbyResultField.value = results
```
Otherwise, populate the operational account fields.
```javascript
} else {
operationalAccountField.value = my_wallet.address
operationalPubKeyField.value = my_wallet.publicKey
operationalPrivKeyField.value = my_wallet.privateKey
operationalSeedField.value = my_wallet.seed
operationalBalanceField.value = (await client.getXrpBalance(my_wallet.address))
results += '\nOperational account created.'
operationalResultField.value = results
}
```
Insert the seed values for both accounts as they are created to the **Seeds** field as a convenience. You can copy the values and store them offline. When you reload this form or another in this tutorial, copy and paste them into the **Seeds** field to retrieve the accounts with the `getAccountsFromSeeds()` function.
```javascript
seeds.value = standbySeedField.value + '\n' + operationalSeedField.value
```
Disconnect from the XRP ledger.
```javascript
client.disconnect()
} // End of getAccount()
```
### Get Accounts from Seeds
```javascript
// *******************************************************
// ********** Get Accounts from Seeds ********************
// *******************************************************
async function getAccountsFromSeeds() {
```
Connect to the selected network.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected, finding wallets.\n'
standbyResultField.value = results
```
Parse the **Seeds** field.
```javascript
var lines = seeds.value.split('\n')
```
Get the `standby_wallet` based on the seed in the first line. Get the `operational_wallet` based on the seed in the second line.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(lines[0])
const operational_wallet = xrpl.Wallet.fromSeed(lines[1])
```
Get the current XRP balances for the accounts.
```javascript
const standby_balance = (await client.getXrpBalance(standby_wallet.address))
const operational_balance = (await client.getXrpBalance(operational_wallet.address))
```
Populate the fields for the standby and operational accounts.
```javascript
standbyAccountField.value = standby_wallet.address
standbyPubKeyField.value = standby_wallet.publicKey
standbyPrivKeyField.value = standby_wallet.privateKey
standbySeedField.value = standby_wallet.seed
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalAccountField.value = operational_wallet.address
operationalPubKeyField.value = operational_wallet.publicKey
operationalPrivKeyField.value = operational_wallet.privateKey
operationalSeedField.value = operational_wallet.seed
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // End of getAccountsFromSeeds()
```
### Send XRP
```javascript
// *******************************************************
// ******************** Send XRP *************************
// *******************************************************
async function sendXRP() {
```
Connect to your selected ledger.
```javascript
results = "Connecting to the selected ledger.\n"
standbyResultField.value = results
let net = getNet()
results = 'Connecting to ' + getNet() + '....'
const client = new xrpl.Client(net)
await client.connect()
results += "\nConnected. Sending XRP.\n"
standbyResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const sendAmount = standbyAmountField.value
results += "\nstandby_wallet.address: = " + standby_wallet.address
standbyResultField.value = results
```
Prepare the transaction. This is a Payment transaction from the standby address to the operational address.
The _Payment_ transaction expects the XRP to be expressed in drops, or 1/millionth of an XRP. You can use the `xrpToDrops()` method to convert the send amount for you (which beats having to type an extra 6 zeroes to send 1 XRP).
```javascript
const prepared = await client.autofill({
"TransactionType": "Payment",
"Account": standby_wallet.address,
"Amount": xrpl.xrpToDrops(sendAmount),
"Destination": standbyDestinationField.value
})
```
Sign the prepared transaction.
```
const signed = standby_wallet.sign(prepared)
```
Submit the transaction and wait for the results.
```
const tx = await client.submitAndWait(signed.tx_blob)
```
Request the balance changes caused by the transaction and report the results.
```
results += "\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
standbyResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
client.disconnect()
} // End of sendXRP()
```
### Reciprocal Transactions
For each of the transactions, there is an accompanying reciprocal transaction, with the prefix _oP,_ for the operational account. See the corresponding function for the standby account for code commentary.
```javascript
// **********************************************************************
// ****** Reciprocal Transactions ***************************************
// **********************************************************************
// *******************************************************
// ********* Send XRP from Operational account ***********
// *******************************************************
async function oPsendXRP() {
results = "Connecting to the selected ledger.\n"
operationalResultField.value = results
let net = getNet()
results = 'Connecting to ' + getNet() + '....'
const client = new xrpl.Client(net)
await client.connect()
results += "\nConnected. Sending XRP.\n"
operationalResultField.value = results
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const sendAmount = operationalAmountField.value
results += "\noperational_wallet.address: = " + operational_wallet.address
operationalResultField.value = results
// ---------------------------------------------------------- Prepare transaction
const prepared = await client.autofill({
"TransactionType": "Payment",
"Account": operational_wallet.address,
"Amount": xrpl.xrpToDrops(operationalAmountField.value),
"Destination": operationalDestinationField.value
})
// ---------------------------------------------------- Sign prepared instructions
const signed = operational_wallet.sign(prepared)
// ------------------------------------------------------------ Submit signed blob
const tx = await client.submitAndWait(signed.tx_blob)
results += "\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
operationalResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
client.disconnect()
} // End of oPsendXRP()
```
## 1.get-accounts-send-xrp.html
Create a standard HTML form to send transactions and requests, then display the results.
```html
<html>
<head>
<title>Token Test Harness</title>
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
<style>
body{font-family: "Work Sans", sans-serif;padding: 20px;background: #fafafa;}
h1{font-weight: bold;}
input, button {padding: 6px;margin-bottom: 8px;}
button{font-weight: bold;font-family: "Work Sans", sans-serif;}
td{vertical-align: middle;}
</style>
<script src='https://unpkg.com/xrpl@2.7.0/build/xrpl-latest-min.js'></script>
<script src='ripplex1-send-xrp.js'></script>
<script>
if (typeof module !== "undefined") {
const xrpl = require('xrpl')
}
</script>
</head>
<!-- ************************************************************** -->
<!-- ********************** The Form ****************************** -->
<!-- ************************************************************** -->
<body>
<h1>Token Test Harness</h1>
<form id="theForm">
Choose your ledger instance:
&nbsp;&nbsp;
<input type="radio" id="tn" name="server"
value="wss://s.altnet.rippletest.net:51233" checked>
<label for="testnet">Testnet</label>
&nbsp;&nbsp;
<input type="radio" id="dn" name="server"
value="wss://s.devnet.rippletest.net:51233">
<label for="devnet">Devnet</label>
<br/><br/>
<button type="button" onClick="getAccountsFromSeeds()">Get Accounts From Seeds</button>
<br/>
<textarea id="seeds" cols="40" rows= "2"></textarea>
<br/><br/>
<table>
<tr valign="top">
<td>
<table>
<tr valign="top">
<td>
<td>
<button type="button" onClick="getAccount('standby')">Get New Standby Account</button>
<table>
<tr valign="top">
<td align="right">
Standby Account
</td>
<td>
<input type="text" id="standbyAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="standbyPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="standbyPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="standbySeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="standbyBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="standbyAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="standbyDestinationField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="right">
<textarea id="standbyResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="sendXRP()">Send XRP&#62;</button>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<table>
<tr>
<td align="center" valign="top">
<button type="button" onClick="oPsendXRP()">&#60;Send XRP</button>
</td>
<td align="right">
<button type="button" onClick="getAccount('operational')">Get New Operational Account</button>
<table>
<tr valign="top">
<td align="right">
Operational Account
</td>
<td>
<input type="text" id="operationalAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="operationalPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="operationalPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="operationalSeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="operationalBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="operationalAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="operationalDestinationField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="right">
<textarea id="operationalResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
```

View File

@@ -0,0 +1,665 @@
---
html: create-conditional-escrows-using-javascript.html
parent: send-payments-using-javascript.html
seo:
description: Create, finish, or cancel condition-based escrow transactions.
labels:
- Accounts
- Quickstart
- Transaction Sending
- XRP
---
# Create Conditional Escrows Using JavaScript
This example shows how to:
1. Create escrow payments that become available when any account enters a fulfillment code.
2. Complete a conditional escrow transaction.
3. Cancel a conditional escrow transaction.
[![Conditional Escrow Tester Form](/docs/img/conditional-escrow1.png)](/docs/img/conditional-escrow1.png)
## Prerequisites
Download and expand the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> archive.
## Usage
### Create Escrow
You create a condition-based escrow using a fulfillment code associated with a condition code. Create the condition/fulfillment pair using the `five-bells-condition` application.
Install `five-bells-condition`:
1. In a terminal window, navigate to your local `Quickstart` directory (for convenience).
2. Enter the command `npm install five-bells-condition`.
To create a condition/fulfillment pair:
1. In a terminal window, navigate to your `Quickstart` directory.
2. Enter the command `node getConditionAndFulfillment.js`.
3. Copy and save the generated Condition and Fulfillment pair.
[![Condition and Fulfillment](/docs/img/conditional-escrow2.png)](/docs/img/conditional-escrow2.png)
To get test accounts:
1. Open `9.escrow-condition.html` in a browser
2. Choose **Testnet** or **Devnet**.
3. Get test accounts.
1. If you have existing account seeds
1. Paste account seeds in the **Seeds** field.
2. Click **Get Accounts from Seeds**.
2. If you do not have account seeds:
1. Click **Get New Standby Account**.
2. Click **Get New Operational Account**.
[![Escrow Tester with Account Information](/docs/img/conditional-escrow3.png)](/docs/img/conditional-escrow3.png)
### Create Conditional Escrow:
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/aUMqCFBsPW4?si=nUC4-yBOweti02be" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
When you create a conditional escrow, you need to specify the amount you want to reserve and the `Condition` value you generated above. You can also set a cancel date and time, after which the escrow is no longer available.
To create a conditional escrow:
1. Enter an **Amount** to transfer.
2. Copy the **Operational Account** value.
3. Paste it in the **Destination Account** field.
4. Enter the **Escrow Condition** value.
5. Enter the **Escrow Cancel (seconds)** value.
6. Click **Create Escrow**.
7. Copy and save the _Sequence Number_ of the escrow called out in the **Standby Result** field.
The escrow is created on the XRP Ledger instance, reserving your requested XRP amount plus the transaction cost.
When you create an escrow, capture and save the _Sequence Number_ so that you can use it to finish the escrow transaction.
[![Created Escrow Transaction](/docs/img/conditional-escrow4.png)](/docs/img/conditional-escrow4.png)
## Finish Conditional Escrow
Any account can finish the conditional escrow any time before the _Escrow Cancel_ time. Following on the example above, you can use the _Sequence Number_ to finish the transaction once the Escrow Cancel time has passed.
To finish a time-based escrow:
1. Paste the sequence number in the Operational account **Escrow Sequence Number** field.
2. Enter the `Fulfillment` code for the `Condition`.
3. Click **Finish Conditional Escrow**.
The transaction completes and balances are updated for both the Standby and Operational accounts.
[![Finished Escrow Transaction](/docs/img/conditional-escrow5.png)](/docs/img/conditional-escrow5.png)
## Get Escrows
Click **Get Escrows** for either the Standby account or the Operational account to see their current list of escrows.
## Cancel Escrow
When the Escrow Cancel time passes, the escrow is no longer available to the recipient. The initiator of the escrow can reclaim the XRP, less the transaction fees. Any account can cancel an escrow once the cancel time has elapsed. Accounts that try to cancel the transaction prior to the **Escrow Cancel** time are charged the nominal transaction cost (12 drops), but the actual escrow cannot be cancelled until after the Escrow Cancel time.
## Oh No! I Forgot to Save the Sequence Number!
If you forget to save the sequence number, you can find it in the escrow transaction record.
1. Create a new escrow as described in [Create Escrow](#create-escrow), above.
2. Click **Get Escrows** to get the escrow information.
3. Copy the _PreviousTxnID_ value from the results.
![Transaction ID in Get Escrows results](/docs/img/quickstart-escrow7.png)
4. Paste the _PreviousTxnID_ in the **Transaction to Look Up** field.
![Transaction to Look Up field](/docs/img/quickstart-escrow8.png)
5. Click **Get Transaction**.
6. Locate the _Sequence_ value in the results.
![Sequence number in results](/docs/img/quickstart-escrow9.png)
# Code Walkthrough
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> in the source repository for this website.
## getConditionAndFulfillment.js
To generate a condition/fulfillment pair, use Node.js to run the `getConditionAndFulfillment.js` script.
```javascript
function getConditionAndFulfillment() {
```
Instantiate the `five-bells-condition` and `crypto` libraries.
```javascript
const cc = require('five-bells-condition')
const crypto = require('crypto')
```
Create a random 32-byte seed string.
```javascript
const preimageData = crypto.randomBytes(32)
```
Create a fulfillment object.
```javascript
const fulfillment = new cc.PreimageSha256()
```
Generate a fulfillment code.
```javascript
fulfillment.setPreimage(preimageData)
```
Generate the condition value based on the fulfillment value.
```javascript
const condition = fulfillment.getConditionBinary().toString('hex').toUpperCase()
```
Return the condition.
```javascript
console.log('Condition:', condition)
```
Convert the fulfillment code to a hexadecimal string.
```javascript
const fulfillment_hex = fulfillment.serializeBinary().toString('hex').toUpperCase()
```
Return the fulfillment code. Keep it secret until you want to finish the escrow.
```javascript
console.log('Fulfillment:', fulfillment_hex)
}
getConditionAndFulfillment()
```
## ripplex9-escrow-condition.js
### Create Conditional Escrow
```javascript
async function createConditionalEscrow() {
```
Connect to your preferred ledger.
```javascript
results = "Connecting to the selected ledger.\n"
standbyResultField.value = results
let net = getNet()
results = "Connecting to " + net + "....\n"
const client = new xrpl.Client(net)
await client.connect()
results += "Connected. Creating conditional escrow.\n"
standbyResultField.value = results
```
Instantiate the standby and operational wallets
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Capture the amount to send in the escrow.
```javascript
const sendAmount = standbyAmountField.value
```
Update the results field.
```javascript
results += "\nstandby_wallet.address: = " + standby_wallet.address
standbyResultField.value = results
```
Create a date value and add your requested number of seconds.
```javascript
let escrow_cancel_date = new Date()
escrow_cancel_date = addSeconds(parseInt(standbyEscrowCancelDateField.value))
```
Prepare the `EscrowCreate` transaction.
```javascript
const escrowTx = await client.autofill({
"TransactionType": "EscrowCreate",
"Account": standby_wallet.address,
"Amount": xrpl.xrpToDrops(sendAmount),
"Destination": standbyDestinationField.value,
"CancelAfter": escrow_cancel_date,
"Condition": standbyEscrowConditionField.value
})
```
Sign the transaction.
```javascript
const signed = standby_wallet.sign(escrowTx)
```
Submit the transaction and wait for the results.
```javascript
const tx = await client.submitAndWait(signed.tx_blob)
```
Report the results and update balance fields.
```javascript
results += "\nSequence Number (Save!): " + JSON.stringify(tx.result.Sequence)
results += "\n\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
standbyResultField.value = results
```
Disconnect from the XRPL
```javascript
client.disconnect()
} // End of createTimeEscrow()
```
### Finish Conditional Escrow
Finish the escrow by submitting the condition and fulfillment codes.
```javascript
async function finishConditionalEscrow() {
```
Connect to your preferred XRP Ledger instance.
```javascript
results = "Connecting to the selected ledger.\n"
operationalResultField.value = results
let net = getNet()
results += 'Connecting to ' + getNet() + '....'
const client = new xrpl.Client(net)
await client.connect()
results += "\nConnected. Finishing escrow.\n"
operationalResultField.value = results
```
Get the standby and operational account wallets.
```javascript
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const sendAmount = operationalAmountField.value
results += "\noperational_wallet.address: = " + operational_wallet.address
operationalResultField.value = results
```
Prepare the transaction.
```javascript
const prepared = await client.autofill({
"TransactionType": "EscrowFinish",
"Account": operationalAccountField.value,
"Owner": standbyAccountField.value,
"OfferSequence": parseInt(operationalEscrowSequenceField.value),
"Condition": standbyEscrowConditionField.value,
"Fulfillment": operationalFulfillmentField.value
})
```
Sign the transaction.
```javascript
const signed = operational_wallet.sign(prepared)
```
Submit the transaction and wait for the results.
```javascript
const tx = await client.submitAndWait(signed.tx_blob)
```
Report the results.
```javascript
results += "\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
operationalResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRPL.
```javascript
client.disconnect()
} // End of finishEscrow()
```
## 9.escrow-condition.html
```html
<html>
<head>
<title>Conditional Escrow Test Harness</title>
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
<style>
body{font-family: "Work Sans", sans-serif;padding: 20px;background: #fafafa;}
h1{font-weight: bold;}
input, button {padding: 6px;margin-bottom: 8px;}
button{font-weight: bold;font-family: "Work Sans", sans-serif;}
td{vertical-align: middle;}
</style>
<script src='https://unpkg.com/xrpl@2.2.3'></script>
<script src='ripplex1-send-xrp.js'></script>
<script src='ripplex2-send-currency.js'></script>
<script src='ripplex8-escrow.js'></script>
<script src='ripplex9-escrow-condition.js'></script>
</head>
<!-- ************************************************************** -->
<!-- ********************** The Form ****************************** -->
<!-- ************************************************************** -->
<body>
<h1>Conditional Escrow Test Harness</h1>
<form id="theForm">
Choose your ledger instance:
&nbsp;&nbsp;
<input type="radio" id="tn" name="server"
value="wss://s.altnet.rippletest.net:51233" checked>
<label for="tn">Testnet</label>
&nbsp;&nbsp;
<input type="radio" id="dn" name="server"
value="wss://s.devnet.rippletest.net:51233">
<label for="dn">Devnet</label>
<br/><br/>
<button type="button" onClick="getAccountsFromSeeds()">Get Accounts From Seeds</button>
<br/>
<textarea id="seeds" cols="40" rows= "2"></textarea>
<br/><br/>
<table>
<tr valign="top">
<td>
<table>
<tr valign="top">
<td>
<td>
<button type="button" onClick="getAccount('standby')">Get New Standby Account</button>
<table>
<tr valign="top">
<td align="right">
Standby Account
</td>
<td>
<input type="text" id="standbyAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="standbyBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="standbyAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination Account
</td>
<td>
<input type="text" id="standbyDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Condition
</td>
<td>
<input type="text" id="standbyEscrowConditionField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Cancel (seconds)
</td>
<td>
<input type="text" id="standbyEscrowCancelDateField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Sequence Number
</td>
<td>
<input type="text" id="standbyEscrowSequenceNumberField" size="40"></input>
<br>
</td>
</tr>
<tr valign="top">
<td><button type="button" onClick="configureAccount('standby',document.querySelector('#standbyDefault').checked)">Configure Account</button></td>
<td>
<input type="checkbox" id="standbyDefault" checked="true"/>
<label for="standbyDefault">Allow Rippling</label>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="standbyPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="standbyPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="standbySeedField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="left">
<textarea id="standbyResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="sendXRP()">Send XRP &#62;</button>
<br/><br/>
<button type="button" onClick="getBalances()">Get Balances</button>
<br/>
<button type="button" onClick="createConditionalEscrow()">Create Conditional Escrow</button>
<br/>
<button type="button" onClick="getStandbyEscrows()">Get Escrows</button>
<br/>
<button type="button" onClick="cancelEscrow()">Cancel Escrow</button>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="oPsendXRP()">&#60; Send XRP</button>
<br/><br/>
<button type="button" onClick="getBalances()">Get Balances</button>
<br/>
<button type="button" onClick="finishConditionalEscrow()">Finish Conditional Escrow</button>
<br/>
<button type="button" onClick="getOperationalEscrows()">Get Escrows</button>
<br/>
<button type="button" onClick="getTransaction()">Get Transaction</button>
</td>
<td valign="top" align="right">
<button type="button" onClick="getAccount('operational')">Get New Operational Account</button>
<table>
<tr valign="top">
<td align="right">
Operational Account
</td>
<td>
<input type="text" id="operationalAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="operationalBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="operationalAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Fulfillment Code
</td>
<td>
<input type="text" id="operationalFulfillmentField" size="40"></input>
<br>
</td>
</tr>
<tr>
<tr>
<td align="right">
Escrow Sequence Number
</td>
<td>
<input type="text" id="operationalEscrowSequenceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Transaction to Look Up
</td>
<td>
<input type="text" id="operationalTransactionField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td>
</td>
<td align="right">
<input type="checkbox" id="operationalDefault" checked="true"/>
<label for="operationalDefault">Allow Rippling</label>
<button type="button" onClick="configureAccount('operational',document.querySelector('#operationalDefault').checked)">Configure Account</button>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="operationalPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="operationalPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="operationalSeedField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="right">
<textarea id="operationalResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
```

View File

@@ -0,0 +1,829 @@
---
html: create-time-based-escrows-using-javascript.html
parent: send-payments-using-javascript.html
seo:
description: Create, finish, or cancel time-based escrow transactions.
labels:
- Accounts
- Quickstart
- Transaction Sending
- XRP
---
# Create Time-based Escrows Using JavaScript
This example shows how to:
1. Create escrow payments that become available at a specified time and expire at a specified time.
2. Finish an escrow payment.
3. Retrieve information on escrows attached to an account.
3. Cancel an escrow payment and return the XRP to the sending account.
[![Escrow Tester Form](/docs/img/quickstart-escrow1.png)](/docs/img/quickstart-escrow1.png)
## Prerequisites
Download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} -->.
## Usage
To get test accounts:
1. Open `8.escrow.html` in a browser
2. Choose **Testnet** or **Devnet**.
3. Get test accounts.
1. If you have existing account seeds
1. Paste account seeds in the **Seeds** field.
2. Click **Get Accounts from Seeds**.
2. If you do not have account seeds:
1. Click **Get New Standby Account**.
2. Click **Get New Operational Account**.
[![Escrow Tester with Account Information](/docs/img/quickstart-escrow2.png)](/docs/img/quickstart-escrow2.png)
## Create Escrow
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/L-mSItlK36M?si=bltVKY7AtTnG0ucL" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
You can create a time-based escrow with a minimum time to finish the escrow and a cancel time after which the funds in escrow are no longer available to the recipient. This is a test harness: while a practical scenario might express time in days or weeks, this form lets you set the finish and cancel times in seconds so that you can quickly run through a variety of scenarios. (There are 86,400 seconds in a day, if you want to play with longer term escrows.)
To create a time-based escrow:
1. Enter an **Amount** to transfer.
2. Copy the **Operational Account** value.
3. Paste it in the **Destination Account** field.
4. Set the **Escrow Finish (seconds)** value. For example, enter _10_.
5. Set the **Escrow Cancel (seconds)** value. For example, enter _120_.
6. Click **Create Escrow**.
7. Copy the _Sequence Number_ of the escrow called out in the **Standby Result** field.
The escrow is created on the XRP Ledger instance, reserving 100 XRP plus the transaction cost. When you create an escrow, capture and save the **Sequence Number** so that you can use it to finish the escrow transaction.
[![Completed Escrow Transaction](/docs/img/quickstart-escrow3.png)](/docs/img/quickstart-escrow3.png)
## Finish Escrow
The recipient of the XRP held in escrow can finish the transaction any time within the time window after the Escrow Finish date and time but before the Escrow Cancel date and time. Following on the example above, you can use the _Sequence Number_ to finish the transaction once 10 seconds have passed.
To finish a time-based escrow:
1. Paste the sequence number in the Operational account **Escrow Sequence Number** field.
2. Click **Finish Escrow**.
The transaction completes and balances are updated for both the Standby and Operational accounts.
[![Completed Escrow Transaction](/docs/img/quickstart-escrow4.png)](/docs/img/quickstart-escrow4.png)
## Get Escrows
Click **Get Escrows** for either the Standby account or the Operational account to see their current list of escrows. If you click the buttons now, there are no escrows at the moment.
For the purposes of this tutorial, follow the steps in [Create Escrow](#create-escrow), above, to create a new escrow transaction, perhaps setting **Escrow Cancel (seconds)** field to _600_ seconds to give you extra time to explore. Remember to capture the _Sequence Number_ from the transaction results.
Click **Get Escrows** for both the Standby and the Operational account. The `account_info` request returns the same `account_object` for both accounts, demonstrating the link between the accounts created by the escrow transaction.
[![Get Escrows results](/docs/img/quickstart-escrow5.png)](/docs/img/quickstart-escrow5.png)
## Cancel Escrow
When the Escrow Cancel time passes, the escrow is no longer available to the recipient. The initiator of the escrow can reclaim the XRP, less the transaction fees. If you try to cancel the transaction prior to the **Escrow Cancel** time, you are charged for the transaction, but the actual escrow cannot be cancelled until the time limit is reached.
You can wait the allotted time for the escrow you created in the previous step, then use it to try out the **Cancel Escrow** button
To cancel an expired escrow:
1. Enter the sequence number in the Standby **Escrow Sequence Number** field.
2. Click **Cancel Escrow**.
The funds are returned to the Standby account, less the initial transaction fee.
[![Cancel Escrow results](/docs/img/quickstart-escrow6.png)](/docs/img/quickstart-escrow6.png)
## Oh No! I Forgot to Save the Sequence Number!
If you forget to save the sequence number, you can find it in the escrow transaction record.
1. Create a new escrow as described in [Create Escrow](#create-escrow), above.
2. Click **Get Escrows** to get the escrow information.
3. Copy the _PreviousTxnID_ value from the results.
![Transaction ID in Get Escrows results](/docs/img/quickstart-escrow7.png)
4. Paste the _PreviousTxnID_ in the **Transaction to Look Up** field.
![Transaction to Look Up field](/docs/img/quickstart-escrow8.png)
5. Click **Get Transaction**.
6. Locate the _Sequence_ value in the results.
![Sequence number in results](/docs/img/quickstart-escrow9.png)
# Code Walkthrough
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> in the source repository for this website.
## ripple8-escrow.js
This example can be used with any XRP Ledger network, _Testnet_, or _Devnet_. You can update the code to choose different or additional XRP Ledger networks.
### Add Seconds to Date
This function accomplishes two things. It creates a new date object and adds the number of seconds taken from a form field. Then, it adjusts the date from the JavaScript format to the XRP Ledger format.
You provide the _numOfSeconds_ argument, the second parameter is a new Date object.
```javascript
function addSeconds(numOfSeconds, date = new Date()) {
```
Set the _seconds_ value to the date seconds plus the number of seconds you provide.
```javascript
date.setSeconds(date.getSeconds() + numOfSeconds);
```
JavaScript dates are in milliseconds. Divide the date by 1000 to base it on seconds.
```javascript
date = Math.floor(date / 1000)
```
Subtract the number of seconds in the Ripple epoch to convert the value to an XRP Ledger compatible date value.
```javascript
date = date - 946684800
```
Return the result.
```javascript
return date;
}
```
### Create Time-based Escrow
```javascript
async function createTimeEscrow() {
```
Instantiate two new date objects, then set the dates to the current date plus the set number of seconds for the finish and cancel dates.
```javascript
let escrow_finish_date = new Date()
let escrow_cancel_date = new Date()
escrow_finish_date = addSeconds(parseInt(standbyEscrowFinishDateField.value))
escrow_cancel_date = addSeconds(parseInt(standbyEscrowCancelDateField.value))
```
Connect to the ledger.
```javascript
results = "Connecting to the selected ledger.\n"
standbyResultField.value = results
let net = getNet()
results = "Connecting to " + net + "....\n"
const client = new xrpl.Client(net)
await client.connect()
results += "Connected. Creating time-based escrow.\n"
standbyResultField.value = results
```
Get the wallet information based on the account seed values.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const sendAmount = standbyAmountField.value
results += "\nstandby_wallet.address: = " + standby_wallet.address
standbyResultField.value = results
```
Define the `EscrowCreate` transaction, automatically filling values in common fields.
```javascript
const escrowTx = await client.autofill({
"TransactionType": "EscrowCreate",
"Account": standby_wallet.address,
"Amount": xrpl.xrpToDrops(sendAmount),
"Destination": standbyDestinationField.value,
"FinishAfter": escrow_finish_date,
"CancelAfter": escrow_cancel_date
})
```
Sign the escrow transaction definition.
```javascript
const signed = standby_wallet.sign(escrowTx)
```
Submit the transaction.
```javascript
const tx = await client.submitAndWait(signed.tx_blob)
```
Report the results.
```javascript
results += "\nSequence Number (Save!): " + JSON.stringify(tx.result.Sequence)
results += "\n\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
standbyResultField.value = results
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // End of createTimeEscrow()
```
### Finish Time-based Escrow
```javascript
async function finishEscrow() {
```
Connect to the XRP Ledger and get the account wallets.
```javascript
results = "Connecting to the selected ledger.\n"
operationalResultField.value = results
let net = getNet()
results = 'Connecting to ' + getNet() + '....'
const client = new xrpl.Client(net)
await client.connect()
results += "\nConnected. Finishing escrow.\n"
operationalResultField.value = results
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const sendAmount = operationalAmountField.value
results += "\noperational_wallet.address: = " + operational_wallet.address
operationalResultField.value = results
```
Define the transaction. The _Owner_ is the account that created the escrow. The _OfferSequence_ is the sequence number of the escrow transaction. Automatically fill in the common fields for the transaction.
```javascript
const prepared = await client.autofill({
"TransactionType": "EscrowFinish",
"Account": operationalAccountField.value,
"Owner": standbyAccountField.value,
"OfferSequence": parseInt(operationalEscrowSequenceField.value)
})
```
Sign the transaction definition.
```javascript
const signed = operational_wallet.sign(prepared)
```
Submit the signed transaction to the XRP ledger.
```javascript
const tx = await client.submitAndWait(signed.tx_blob)
```
Report the results.
```javascript
results += "\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
operationalResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // End of finishEscrow()
```
### Get Standby Escrows
Get the escrows associated with the Standby account.
```javascript
async function getStandbyEscrows() {
```
Connect to the network. The information you are looking for is public information, so there is no need to instantiate your wallet.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
results= "\nGetting standby account escrows...\n"
```
Create the `account_objects` request. Specify that you want objects of the type _escrow_.
```javascript
const escrow_objects = await client.request({
"id": 5,
"command": "account_objects",
"account": standbyAccountField.value,
"ledger_index": "validated",
"type": "escrow"
})
```
Report the results.
```javascript
results += JSON.stringify(escrow_objects.result, null, 2)
standbyResultField.value = results
```
Disconnect from the XRP Ledger
```javascript
client.disconnect()
} // End of getStandbyEscrows()
```
### Get Operational Escrows
This function is the same as `getStandbyEscrows()`, but for the Operational account.
```javascript
async function getOperationalEscrows() {
```
Connect to the network. The information you are looking for is public information, so there is no need to instantiate your wallet.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
results= "\nGetting operational account escrows...\n"
```
Create the `account_objects` request. Specify that you want objects of the type _escrow_.
```javascript
const escrow_objects = await client.request({
"id": 5,
"command": "account_objects",
"account": operationalAccountField.value,
"ledger_index": "validated",
"type": "escrow"
})
```
Report the results.
```javascript
results += JSON.stringify(escrow_objects.result, null, 2)
operationalResultField.value = results
```
Disconnect from the XRP Ledger instance.
```javascript
client.disconnect()
} // End of getOperationalEscrows()
```
### Get Transaction Info
```javascript
async function getTransaction() {
```
Connect to the XRP Ledger.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
results= "\nGetting transaction information...\n"
```
Prepare and send the transaction information request. The only required parameter is the transaction ID.
```javascript
const tx_info = await client.request({
"id": 1,
"command": "tx",
"transaction": operationalTransactionField.value,
})
```
Report the results.
```javascript
results += JSON.stringify(tx_info.result, null, 2)
operationalResultField.value = results
```
Disconnect from the XRP Ledger instance.
```javascript
client.disconnect()
} // End of getTransaction()
```
### Cancel Escrow
Cancel an escrow after it passes the expiration date.
```javascript
async function cancelEscrow() {
```
Connect to the XRP Ledger instance.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
```
Get the account wallets.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Prepare the EscrowCancel transaction.
```javascript
const prepared = await client.autofill({
"TransactionType": "EscrowCancel",
"Account": standby_wallet.address,
"Owner": standbyAccountField.value,
"OfferSequence": parseInt(standbyEscrowSequenceNumberField.value)
})
```
Sign the transaction.
```javascript
const signed = standby_wallet.sign(prepared)
```
Submit the transaction and wait for the response.
``` javascript
const tx = await client.submitAndWait(signed.tx_blob)
```
Report the results.
```javascript
results += "\nBalance changes: " +
JSON.stringify(xrpl.getBalanceChanges(tx.result.meta), null, 2)
standbyResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger instance.
```javascript
client.disconnect()
}
```
## 8.escrow.html
```html
<html>
<head>
<title>Time-based Escrow Test Harness</title>
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
<style>
body{font-family: "Work Sans", sans-serif;padding: 20px;background: #fafafa;}
h1{font-weight: bold;}
input, button {padding: 6px;margin-bottom: 8px;}
button{font-weight: bold;font-family: "Work Sans", sans-serif;}
td{vertical-align: middle;}
</style>
<script src='https://unpkg.com/xrpl@2.2.3'></script>
<script src='ripplex1-send-xrp.js'></script>
<script src='ripplex2-send-currency.js'></script>
<script src='ripplex8-escrow.js'></script>
</head>
<!-- ************************************************************** -->
<!-- ********************** The Form ****************************** -->
<!-- ************************************************************** -->
<body>
<h1>Time-based Escrow Test Harness</h1>
<form id="theForm">
Choose your ledger instance:
&nbsp;&nbsp;
<input type="radio" id="tn" name="server"
value="wss://s.altnet.rippletest.net:51233" checked>
<label for="tn">Testnet</label>
&nbsp;&nbsp;
<input type="radio" id="dn" name="server"
value="wss://s.devnet.rippletest.net:51233">
<label for="dn">Devnet</label>
<br/><br/>
<button type="button" onClick="getAccountsFromSeeds()">Get Accounts From Seeds</button>
<br/>
<textarea id="seeds" cols="40" rows= "2"></textarea>
<br/><br/>
<table>
<tr valign="top">
<td>
<table>
<tr valign="top">
<td>
<td>
<button type="button" onClick="getAccount('standby')">Get New Standby Account</button>
<table>
<tr valign="top">
<td align="right">
Standby Account
</td>
<td>
<input type="text" id="standbyAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="standbyBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="standbyAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination Account
</td>
<td>
<input type="text" id="standbyDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Finish (seconds)
</td>
<td>
<input type="text" id="standbyEscrowFinishDateField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Cancel (seconds)
</td>
<td>
<input type="text" id="standbyEscrowCancelDateField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Escrow Sequence Number
</td>
<td>
<input type="text" id="standbyEscrowSequenceNumberField" size="40"></input>
<br>
</td>
</tr>
<tr valign="top">
<td><button type="button" onClick="configureAccount('standby',document.querySelector('#standbyDefault').checked)">Configure Account</button></td>
<td>
<input type="checkbox" id="standbyDefault" checked="true"/>
<label for="standbyDefault">Allow Rippling</label>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="standbyPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="standbyPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="standbySeedField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="left">
<textarea id="standbyResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="sendXRP()">Send XRP &#62;</button>
<br/><br/>
<button type="button" onClick="getBalances()">Get Balances</button>
<br/>
<button type="button" onClick="createTimeEscrow()">Create Time-based Escrow</button>
<br/>
<button type="button" onClick="getStandbyEscrows()">Get Escrows</button>
<br/>
<button type="button" onClick="cancelEscrow()">Cancel Escrow</button>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="oPsendXRP()">&#60; Send XRP</button>
<br/><br/>
<button type="button" onClick="getBalances()">Get Balances</button>
<br/>
<button type="button" onClick="finishEscrow()">Finish Time-based Escrow</button>
<br/>
<button type="button" onClick="getOperationalEscrows()">Get Escrows</button>
<br/>
<button type="button" onClick="getTransaction()">Get Transaction</button>
</td>
<td valign="top" align="right">
<button type="button" onClick="getAccount('operational')">Get New Operational Account</button>
<table>
<tr valign="top">
<td align="right">
Operational Account
</td>
<td>
<input type="text" id="operationalAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="operationalBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="operationalAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="operationalDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<tr>
<td align="right">
Escrow Sequence Number
</td>
<td>
<input type="text" id="operationalEscrowSequenceField" size="40"></input>
<br>
</td>
</tr>
<tr> <td align="right">
Transaction to Look Up
</td>
<td>
<input type="text" id="operationalTransactionField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td>
</td>
<td align="right">
<input type="checkbox" id="operationalDefault" checked="true"/>
<label for="operationalDefault">Allow Rippling</label>
<button type="button" onClick="configureAccount('operational',document.querySelector('#operationalDefault').checked)">Configure Account</button>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="operationalPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="operationalPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="operationalSeedField" size="40"></input>
<br>
</td>
</tr>
</table>
<p align="right">
<textarea id="operationalResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
```

View File

@@ -0,0 +1,810 @@
---
html: create-trustline-send-currency-using-javascript.html
parent: send-payments-using-javascript.html
seo:
description: Create Trust Lines and send currency.
labels:
- Cross-Currency
- Payments
- Quickstart
- Tokens
---
# Create Trust Line and Send Currency Using JavaScript
This example shows how to:
1. Configure accounts to allow transfer of funds to third party accounts.
2. Set a currency type for transactions.
3. Create a trust line between the standby account and the operational account.
4. Send issued currency between accounts.
5. Display account balances for all currencies.
[![Test harness with currency transfer](/docs/img/quickstart5.png)](/docs/img/quickstart5.png)
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> archive to try each of the samples in your own browser.
**Note:** Without the Quickstart Samples, you will not be able to try the examples that follow.
## Usage
Open the Token Test Harness and get accounts:
1. Open `2.create-trustline-send-currency.html` in a browser.
2. Get test accounts.
1. If you have existing account seeds
1. Paste account seeds in the **Seeds** field.
2. Click **Get Accounts from Seeds**.
2. If you do not have account seeds:
1. Click **Get New Standby Account**.
2. Click **Get New Operational Account**.
## Create Trust Line
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/EP_LOy8kK1U?si=Ulx8vUtil_yRcesd" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
To create a trust line between accounts:
1. Enter a [currency code](https://www.iban.com/currency-codes) in the **Currency** field.
2. Enter the maximum transfer limit in the **Amount** field.
3. Enter the destination account value in the **Destination** field.
4. Click **Create Trustline**. <!-- SPELLING_IGNORE: trustline --><!--{# TODO: update the test harness to spell trust line as two words #}-->
[![Trust line results](/docs/img/quickstart6.png)](/docs/img/quickstart6.png)
## Send an Issued Currency Token
To transfer an issued currency token, once you have created a trust line:
1. Enter the **Amount**.
2. Enter the **Destination**.
3. Enter the **Currency** type.
4. Click **Send Currency**.
[![Currency transfer](/docs/img/quickstart7.png)](/docs/img/quickstart7.png)
# Code Walkthrough
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/_code-samples/quickstart/js/)<!-- {.github-code-download} --> archive to try each of the samples in your own browser.
## ripplex2-send-currency.js
<!-- SPELLING_IGNORE: ripplex2 -->
### Configure Account
When transferring fiat currency, the actual transfer of funds is not simultaneous, as it is with XRP. If currency is transferred to a third party for a different currency, there can be a devaluation of the currency that impacts the originating account. To avoid this situation, this up and down valuation of currency, known as _rippling_, is not allowed by default. Currency transferred from one account can only be transferred back to the same account. To enable currency transfer to third parties, you need to set the `rippleDefault` value to true. The Token Test Harness provides a checkbox to enable or disable rippling.
```javascript
// *******************************************************
// **************** Configure Account ********************
// *******************************************************
async function configureAccount(type, defaultRippleSetting) {
```
Connect to the ledger
```javascript
let net = getNet()
let resultField = 'standbyResultField'
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
await client.connect()
results += '\nConnected, finding wallet.'
```
Get the account wallets.
```
if (type=='standby') {
my_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
} else {
my_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
resultField = 'operationalResultField'
}
results += '\nRipple Default Setting: ' + defaultRippleSetting
resultField.value = results
```
Prepare the transaction. If the `rippleDefault` argument is true, set the `asfDefaultRipple` flag. If it is false, clear the `asfDefaultRipple` flag.
```javascript
let settings_tx = {}
if (defaultRippleSetting) {
settings_tx = {
"TransactionType": "AccountSet",
"Account": my_wallet.address,
"SetFlag": xrpl.AccountSetAsfFlags.asfDefaultRipple
}
results += '\n Set Default Ripple flag.'
} else {
settings_tx = {
"TransactionType": "AccountSet",
"Account": my_wallet.address,
"ClearFlag": xrpl.AccountSetAsfFlags.asfDefaultRipple
}
results += '\n Clear Default Ripple flag.'
}
results += '\nSending account setting.'
resultField.value = results
```
Auto-fill the default values for the transaction.
```javascript
const prepared = await client.autofill(settings_tx)
```
Sign the transaction.
```javascript
const signed = my_wallet.sign(prepared)
```
Submit the transaction and wait for the result.
```javascript
const result = await client.submitAndWait(signed.tx_blob)
```
Report the result.
```javascript
if (result.result.meta.TransactionResult == "tesSUCCESS") {
results += '\nAccount setting succeeded.'
document.getElementById(resultField).value = results
} else {
throw 'Error sending transaction: ${result}'
results += '\nAccount setting failed.'
resultField.value = results
}
client.disconnect()
} // End of configureAccount()
```
### Create Trust Line
A trust line enables two accounts to trade a defined currency up to a set limit. This gives the participants assurance that any exchanges are between known entities at agreed upon maximum amounts.
```javascript
// *******************************************************
// ***************** Create TrustLine ********************
// *******************************************************
async function createTrustline() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
```
Get the standby and operational wallets.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Capture the currency code from the standby currency field.
```javascript
const currency_code = standbyCurrencyField.value
```
Define the transaction, capturing the currency code and (limit) amount from the form fields.
```javascript
const trustSet_tx = {
"TransactionType": "TrustSet",
"Account": standbyDestinationField.value,
"LimitAmount": {
"currency": standbyCurrencyField.value,
"issuer": standby_wallet.address,
"value": standbyAmountField.value
}
}
```
Prepare the transaction by automatically filling the default parameters.
```javascript
const ts_prepared = await client.autofill(trustSet_tx)
```
Sign the transaction.
```javascript
const ts_signed = operational_wallet.sign(ts_prepared)
results += '\nCreating trust line from operational account to standby account...'
standbyResultField.value = results
```
Submit the transaction and wait for the results.
```javascript
const ts_result = await client.submitAndWait(ts_signed.tx_blob)
```
Report the results.
```javascript
if (ts_result.result.meta.TransactionResult == "tesSUCCESS") {
results += '\nTrustline established between account \n' +
standbyDestinationField.value + ' \n and account\n' + standby_wallet.address + '.'
standbyResultField.value = results
} else {
results += '\nTrustLine failed. See JavaScript console for details.'
document.getElementById('standbyResultField').value = results
throw 'Error sending transaction: ${ts_result.result.meta.TransactionResult}'
}
} //End of createTrustline()
```
### Send Issued Currency
Once you have created a trust line from an account to your own, you can send issued currency tokens to that account, up to the established limit.
```javascript
// *******************************************************
// *************** Send Issued Currency ******************
// *******************************************************
async function sendCurrency() {
```
Connect to the ledger.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
document.getElementById('standbyResultField').value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
```
Get the account wallets.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const currency_code = standbyCurrencyField.value
const issue_quantity = standbyAmountField.value
const send_token_tx = {
"TransactionType": "Payment",
"Account": standby_wallet.address,
"Amount": {
"currency": standbyCurrencyField.value,
"value": standbyAmountField.value,
"issuer": standby_wallet.address
},
"Destination": standbyDestinationField.value
}
```
Prepare the transaction by automatically filling default values.
```javascript
const pay_prepared = await client.autofill(send_token_tx)
```
Sign the transaction.
```javascript
const pay_signed = standby_wallet.sign(pay_prepared)
results += 'Sending ${issue_quantity} ${currency_code} to ' +
standbyDestinationField.value + '...'
standbyResultField.value = results
```
Submit the transaction and wait for the results.
```javascript
const pay_result = await client.submitAndWait(pay_signed.tx_blob)
```
Report the results.
```javascript
if (pay_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${pay_signed.hash}'
standbyResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
standbyResultField.value = results
throw 'Error sending transaction: ${pay_result.result.meta.TransactionResult}'
}
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
getBalances()
client.disconnect()
} // end of sendCurrency()
```
### Get Balances
```javascript
// *******************************************************
// ****************** Get Balances ***********************
// *******************************************************
async function getBalances() {
```
Connect to the ledger.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
```
Get the account wallets.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
results = "\nGetting standby account balances...\n"
```
Define and send the request for the standby account, then wait for the results.
```javascript
const standby_balances = await client.request({
command: "gateway_balances",
account: standby_wallet.address,
ledger_index: "validated",
hotwallet: [operational_wallet.address]
})
```
Report the results.
```javascript
results += JSON.stringify(standby_balances.result, null, 2)
standbyResultField.value = results
```
Define and send the request for the operational account, then wait for the results.
```javascript
results += "\nGetting operational account balances...\n"
const operational_balances = await client.request({
command: "gateway_balances",
account: operational_wallet.address,
ledger_index: "validated"
})
```
Report the results.
```javascript
results += JSON.stringify(operational_balances.result, null, 2)
operationalResultField.value = results
```
Update the form with current XRP balances.
```javascript
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
standbyResultField.value = results
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
```
Disconnect from the ledger.
```javascript
client.disconnect()
} // End of getBalances()
```
### Reciprocal Transactions
For each of the transactions, there is an accompanying reciprocal transaction, with the prefix _oP,_ for the operational account. See the corresponding function for the standby account for code commentary. The `getBalances()` request does not have a reciprocal transaction, because it reports balances for both accounts.
```javascript
// *******************************************************
// ************ Create Operational TrustLine *************
// *******************************************************
async function oPcreateTrustline() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const trustSet_tx = {
"TransactionType": "TrustSet",
"Account": operationalDestinationField.value,
"LimitAmount": {
"currency": operationalCurrencyField.value,
"issuer": operational_wallet.address,
"value": operationalAmountField.value
}
}
const ts_prepared = await client.autofill(trustSet_tx)
const ts_signed = standby_wallet.sign(ts_prepared)
results += '\nCreating trust line from operational account to ' +
operationalDestinationField.value + ' account...'
operationalResultField.value = results
const ts_result = await client.submitAndWait(ts_signed.tx_blob)
if (ts_result.result.meta.TransactionResult == "tesSUCCESS") {
results += '\nTrustline established between account \n' + operational_wallet.address +
' \n and account\n' + operationalDestinationField.value + '.'
operationalResultField.value = results
} else {
results += '\nTrustLine failed. See JavaScript console for details.'
operationalResultField.value = results
throw 'Error sending transaction: ${ts_result.result.meta.TransactionResult}'
}
} //End of oPcreateTrustline
// *******************************************************
// ************* Operational Send Issued Currency ********
// *******************************************************
async function oPsendCurrency() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const currency_code = operationalCurrencyField.value
const issue_quantity = operationalAmountField.value
const send_token_tx = {
"TransactionType": "Payment",
"Account": operational_wallet.address,
"Amount": {
"currency": currency_code,
"value": issue_quantity,
"issuer": operational_wallet.address
},
"Destination": operationalDestinationField.value
}
const pay_prepared = await client.autofill(send_token_tx)
const pay_signed = operational_wallet.sign(pay_prepared)
results += 'Sending ${issue_quantity} ${currency_code} to ' +
operationalDestinationField.value + '...'
operationalResultField.value = results
const pay_result = await client.submitAndWait(pay_signed.tx_blob)
if (pay_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${pay_signed.hash}'
operationalResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
operationalResultField.value = results
throw 'Error sending transaction: ${pay_result.result.meta.TransactionResult}'
}
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
getBalances()
client.disconnect()
} // end of oPsendCurrency()
```
## 2.create-trustline-send-currency.html
Update the form to support the new functions.
```html
<html>
<head>
<title>Token Test Harness</title>
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
<style>
body{font-family: "Work Sans", sans-serif;padding: 20px;background: #fafafa;}
h1{font-weight: bold;}
input, button {padding: 6px;margin-bottom: 8px;}
button{font-weight: bold;font-family: "Work Sans", sans-serif;}
td{vertical-align: middle;}
</style>
<script src='https://unpkg.com/xrpl@2.7.0/build/xrpl-latest-min.js'></script>
<script src='ripplex1-send-xrp.js'></script>
<script src='ripplex2-send-currency.js'></script>
<script>
if (typeof module !== "undefined") {
const xrpl = require('xrpl')
}
</script>
</head>
<!-- ************************************************************** -->
<!-- ********************** The Form ****************************** -->
<!-- ************************************************************** -->
<body>
<h1>Token Test Harness</h1>
<form id="theForm">
Choose your ledger instance:
&nbsp;&nbsp;
<input type="radio" id="tn" name="server"
value="wss://s.altnet.rippletest.net:51233" checked>
<label for="testnet">Testnet</label>
&nbsp;&nbsp;
<input type="radio" id="dn" name="server"
value="wss://s.devnet.rippletest.net:51233">
<label for="devnet">Devnet</label>
<br/><br/>
<button type="button" onClick="getAccountsFromSeeds()">Get Accounts From Seeds</button>
<br/>
<textarea id="seeds" cols="40" rows= "2"></textarea>
<br/><br/>
<table>
<tr valign="top">
<td>
<table>
<tr valign="top">
<td>
<td>
<button type="button" onClick="getAccount('standby')">Get New Standby Account</button>
<table>
<tr valign="top">
<td align="right">
Standby Account
</td>
<td>
<input type="text" id="standbyAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="standbyPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="standbyPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="standbySeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="standbyBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="standbyAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="standbyDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr valign="top">
<td><button type="button" onClick="configureAccount('standby',document.querySelector('#standbyDefault').checked)">Configure Account</button></td>
<td>
<input type="checkbox" id="standbyDefault" checked="true"/>
<label for="standbyDefault">Allow Rippling</label>
</td>
</tr>
<tr>
<td align="right">
Currency
</td>
<td>
<input type="text" id="standbyCurrencyField" size="40" value="USD"></input>
</td>
</tr>
</table>
<p align="left">
<textarea id="standbyResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="sendXRP()">Send XRP&#62;</button>
<br/><br/>
<button type="button" onClick="createTrustline()">Create TrustLine</button>
<br/>
<button type="button" onClick="sendCurrency()">Send Currency</button>
<br/>
<button type="button" onClick="getBalances()">Get Balances</button>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<td>
<table>
<tr>
<td align="center" valign="top">
<button type="button" onClick="oPsendXRP()">&#60; Send XRP</button>
<br/><br/>
<button type="button" onClick="oPcreateTrustline()">Create TrustLine</button>
<br/>
<button type="button" onClick="oPsendCurrency()">Send Currency</button>
<br/>
<button type="button" onClick="getBalances()">Get Balances</button>
</td>
<td valign="top" align="right">
<button type="button" onClick="getAccount('operational')">Get New Operational Account</button>
<table>
<tr valign="top">
<td align="right">
Operational Account
</td>
<td>
<input type="text" id="operationalAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="operationalPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="operationalPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="operationalSeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="operationalBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="operationalAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="operationalDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td>
</td>
<td align="right">
<input type="checkbox" id="operationalDefault" checked="true"/>
<label for="operationalDefault">Allow Rippling</label>
<button type="button" onClick="configureAccount('operational',document.querySelector('#operationalDefault').checked)">Configure Account</button>
</td>
</tr>
<tr>
<td align="right">
Currency
</td>
<td>
<input type="text" id="operationalCurrencyField" size="40" value="USD"></input>
</td>
</tr>
</table>
<p align="right">
<textarea id="operationalResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
```

View File

@@ -0,0 +1,13 @@
---
html: send-payments-using-javascript.html
parent: javascript.html
top_nav_grouping: Article Types
metadata:
indexPage: true
---
# Send Payments Using JavaScript
Send XRP and issued currency on the XRP Ledger using JavaScript.
{% child-pages /%}

View File

@@ -0,0 +1,901 @@
---
html: send-and-cash-checks.html
parent: send-payments-using-javascript.html
labels:
- Accounts
- Quickstart
- Transaction Sending
- Checks
- XRP
---
# Send and Cash Checks
This example shows how to:
1. Send a check to transfer XRP or issued currency to another account.
2. Get a list of checks you have sent or received.
3. Cash a check received from another account.
4. Cancel a check you have sent.
Checks offer another option for transferring funds between accounts. Checks have two particular advantages.
1. You can use a check to send funds to another account without first creating a trust line - the trust line is created automatically when the receiver chooses to accept the funds.
2. The receiver can choose to accept less than the full amount of the check. This allows you to authorize a maximum amount when the actual cost is not finalized.
[![Empty Check Form](/docs/img/quickstart-checks1.png)](/docs/img/quickstart-checks1.png)
## Prerequisites
Clone or download the [Modular Tutorial Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/content/_code-samples/quickstart/js/){.github-code-download}.
**Note:** Without the Quickstart Samples, you will not be able to try the examples that follow.
## Usage
To get test accounts:
1. Open and launch `10check.html`.
2. Click **Get Standby Account**.
3. Click **Get Operational Account**.
[![Form with New Accounts](/docs/img/quickstart-checks2.png)](/docs/img/quickstart-checks2.png)
You can transfer XRP between your new accounts. Each account has its own fields and buttons.
<div align="center">
<iframe width="560" height="315" src="https://www.youtube.com/embed/5zRBC7dGSaM?si=Glf3_uh7w0UUNHU8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
### Send a Check for XRP
To send a check for XRP from the Standby account to the Operational account:
1. On the Standby (left) side of the form, enter the **Amount** of XRP to send, in drops.
2. Copy and paste the **Operational Account** field to the Standby **Destination** field.
3. Set the **Currency** to _XRP_.
4. Click **Send Check**.
[![Send Check Settings](/docs/img/quickstart-checks3.png)](/docs/img/quickstart-checks3.png)
### Send a Check for an Issued Currency
To send a check for an issued currency token from the Standby account to the Operational account:
1. On the Standby side of the form, enter the **Amount** of currency to send.
2. Copy and paste the **Operational Account** field to the Standby **Destination** field.
3. Copy the **Standby Account** field and paste the value in the **Issuer** field.
4. Enter the **Currency** code for your token.
5. Click **Send Check**.
[![Send Token Check Settings](/docs/img/quickstart-checks4.png)](/docs/img/quickstart-checks4.png)
### Get Checks
Click **Get Checks** to get a list of the current checks you have sent or received. To uniquely identify a check (for existence, when cashing a check), capture the _index_ value for the check.
[![Get Checks with index highlighted](/docs/img/quickstart-checks5.png)](/docs/img/quickstart-checks5.png)
### Cash Check
To cash a check you have received:
1. Enter the **Check ID** (**index** value).
2. Enter the **Amount** you want to collect, up to the full amount of the check.
3. Enter the currency code.
a. If you cashing a check for XRP, enter _XRP_ in the **Currency** field.
b. If you are cashing a check for an issued currency token:
1. Enter the **Issuer** of the token.
2. Enter the **Currency** code for the token.
4. Click **Cash Check**.
[![Cashed check results](/docs/img/quickstart-checks6.png)](/docs/img/quickstart-checks6.png)
### Get Balances
Click **Get Balances** to get a list of obligations and assets for each account.
[![Account Balances](/docs/img/quickstart-checks7.png)](/docs/img/quickstart-checks7.png)
### Cancel Check
To cancel a check you have previously sent to another account.
1. Enter the **Check ID** (**index** value).
2. Click **Cancel Check**.
[![Canceled check results](/docs/img/quickstart-checks8.png)](/docs/img/quickstart-checks8.png)
# Code Walkthrough
You can download the [Quickstart Samples](https://github.com/XRPLF/xrpl-dev-portal/tree/master/content/_code-samples/quickstart/js/){.github-code-download} in the source repository for this website.
## ripplex10-check.js
### sendCheck()
Connect to the XRP ledger.
```javascript
async function sendCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
```
Instantiate the account wallets.
```javascript
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Create the `check_amount` variable, based on the standby amount field.
```javascript
var check_amount = standbyAmountField.value
```
If the currency is anything but _XRP_, it's an issued currency. Update the `check_amount` variable to include the `currency` and `issuer` fields.
```javascript
if (standbyCurrencyField.value != "XRP") {
check_amount = {
"currency": standbyCurrencyField.value,
"value": standbyAmountField.value,
"issuer": standby_wallet.address
}
}
```
Define the `CheckCreate` transaction.
```javascript
const send_check_tx = {
"TransactionType": "CheckCreate",
"Account": standby_wallet.address,
"SendMax": check_amount,
"Destination": standbyDestinationField.value
}
```
Prepare and sign the transaction.
```javascript
const check_prepared = await client.autofill(send_check_tx)
const check_signed = standby_wallet.sign(check_prepared)
results += 'Sending ' + check_amount + ' ' + standbyCurrencyField + ' to ' +
standbyDestinationField.value + '...'
standbyResultField.value = results
```
Submit the transaction to the XRP Ledger and wait for the response.
```
const check_result = await client.submitAndWait(check_signed.tx_blob)
```
Report the results
```javascript
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${check_signed.hash}'
standbyResultField.value = JSON.stringify(check_result.result, null, 2)
} else {
results += 'Transaction failed: See JavaScript console for details.'
standbyResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
```
Update the XRP balance fields.
```javascript
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // end of sendCheck()
```
### getChecks()
```javascript
async function getChecks() {
```
Connect to the XRP Ledger.
```javascript
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
results= "\nGetting standby account checks...\n"
```
Define and send the `account_objects` request, specifying `check` objects.
```javascript
const check_objects = await client.request({
"id": 5,
"command": "account_objects",
"account": standbyAccountField.value,
"ledger_index": "validated",
"type": "check"
})
```
Report the results.
```javascript
standbyResultField.value = JSON.stringify(check_objects.result, null, 2)
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // End of getChecks()
```
### cashCheck()
Connect to the XRP Ledger and instantiate the account wallets.
```javascript
async function cashCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Set the `check_amount` variable to the value in the **Amount** field.
```javascript
var check_amount = standbyAmountField.value
```
If the **Currency** is anything other than `XRP`, the check is for an issued currency. Redefine the variable to include the `currency` and `issuer` for the token.
```
if (standbyCurrencyField.value != "XRP") {
check_amount = {
"value": standbyAmountField.value,
"currency": standbyCurrencyField.value,
"issuer": standbyIssuerField.value
}
}
```
Define the `CheckCash` transaction.
```javascript
const cash_check_tx = {
"TransactionType": "CheckCash",
"Account": standby_wallet.address,
"Amount": check_amount,
"CheckID": standbyCheckID.value
}
```
Prepare and sign the transaction.
```javascript
const cash_prepared = await client.autofill(cash_check_tx)
const cash_signed = standby_wallet.sign(cash_prepared)
results += ' Receiving ' + standbyAmountField.value + ' ' + standbyCurrencyField.value + '.\n'
standbyResultField.value = results
```
Submit the transaction and wait for the results.
```javascript
const check_result = await client.submitAndWait(cash_signed.tx_blob)
```
Report the results.
```javascript
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${cash_signed.hash}'
standbyResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
standbyResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
```
Update the XRP balance fields.
```javascript
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // end of cashCheck()
```
### cancelCheck
Connect to the XRP Ledger and instantiate the account wallets.
```javascript
async function cancelCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
standbyResultField.value = results
await client.connect()
results += '\nConnected.'
standbyResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
```
Define the `CheckCancel` transaction.
```javascript
const cancel_check_tx = {
"TransactionType": "CheckCancel",
"Account": standby_wallet.address,
"CheckID": standbyCheckID.value
}
```
Prepare and sign the transaction object.
```javascript
const cancel_prepared = await client.autofill(cancel_check_tx)
const cancel_signed = standby_wallet.sign(cancel_prepared)
results += ' Cancelling check.\n'
standbyResultField.value = results
```
Submit the transaction and wait for the results.
```javascript
const check_result = await client.submitAndWait(cancel_signed.tx_blob)
```
Report the results.
```javascript
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${cash_signed.hash}'
standbyResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
standbyResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
```
Update the XRP balance fields.
```javascript
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
```
Disconnect from the XRP Ledger.
```javascript
client.disconnect()
} // end of cancelCheck()
```
### Reciprocal functions for the Operational account.
```javascript
// *******************************************************
// ************ Operational Send Check *******************
// *******************************************************
async function opSendCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const issue_quantity = operationalAmountField.value
var check_amount = operationalAmountField.value
if (operationalCurrencyField.value != "XRP") {
check_amount = {
"currency": operationalCurrencyField.value,
"value": operationalAmountField.value,
"issuer": operational_wallet.address
}
}
const send_check_tx = {
"TransactionType": "CheckCreate",
"Account": operational_wallet.address,
"SendMax": check_amount,
"Destination": operationalDestinationField.value
}
const check_prepared = await client.autofill(send_check_tx)
const check_signed = operational_wallet.sign(check_prepared)
results += '\nSending check to ' +
operationalDestinationField.value + '...'
operationalResultField.value = results
const check_result = await client.submitAndWait(check_signed.tx_blob)
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${check_signed.hash}'
operationalResultField.value = JSON.stringify(check_result.result, null, 2)
} else {
results += 'Transaction failed: See JavaScript console for details.'
operationalResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
client.disconnect()
} // end of opSendCheck()
// *******************************************************
// ************ Operational Get Checks *******************
// *******************************************************
async function opGetChecks() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
results= "\nGetting standby account checks...\n"
const check_objects = await client.request({
"id": 5,
"command": "account_objects",
"account": operationalAccountField.value,
"ledger_index": "validated",
"type": "check"
})
operationalResultField.value = JSON.stringify(check_objects.result, null, 2)
client.disconnect()
} // End of opGetChecks()
// *******************************************************
// ************* Operational Cash Check ******************
// *******************************************************
async function opCashCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
var check_amount = operationalAmountField.value
if (operationalCurrencyField.value != "XRP") {
check_amount = {
"value": operationalAmountField.value,
"currency": operationalCurrencyField.value,
"issuer": operationalIssuerField.value
}
}
const cash_check_tx = {
"TransactionType": "CheckCash",
"Account": operational_wallet.address,
"Amount": check_amount,
"CheckID": operationalCheckIDField.value
}
const cash_prepared = await client.autofill(cash_check_tx)
const cash_signed = operational_wallet.sign(cash_prepared)
results += ' Receiving ' + operationalAmountField.value + ' ' + operationalCurrencyField.value + '.\n'
operationalResultField.value = results
const check_result = await client.submitAndWait(cash_signed.tx_blob)
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${cash_signed.hash}'
operationalResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
operationalResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
client.disconnect()
}
// end of opCashCheck()
// *******************************************************
// ************* Operational Cancel Check ****************
// *******************************************************
async function opCancelCheck() {
let net = getNet()
const client = new xrpl.Client(net)
results = 'Connecting to ' + getNet() + '....'
operationalResultField.value = results
await client.connect()
results += '\nConnected.'
operationalResultField.value = results
const standby_wallet = xrpl.Wallet.fromSeed(standbySeedField.value)
const operational_wallet = xrpl.Wallet.fromSeed(operationalSeedField.value)
const cancel_check_tx = {
"TransactionType": "CheckCancel",
"Account": operational_wallet.address,
"CheckID": operationalCheckIDField.value
}
const cancel_prepared = await client.autofill(cancel_check_tx)
const cancel_signed = operational_wallet.sign(cancel_prepared)
results += ' Cancelling check.\n'
operationalResultField.value = results
const check_result = await client.submitAndWait(cancel_signed.tx_blob)
if (check_result.result.meta.TransactionResult == "tesSUCCESS") {
results += 'Transaction succeeded: https://testnet.xrpl.org/transactions/${cash_signed.hash}'
operationalResultField.value = results
} else {
results += 'Transaction failed: See JavaScript console for details.'
operationalResultField.value = results
throw 'Error sending transaction: ${check_result.result.meta.TransactionResult}'
}
standbyBalanceField.value = (await client.getXrpBalance(standby_wallet.address))
operationalBalanceField.value = (await client.getXrpBalance(operational_wallet.address))
client.disconnect()
} // end of cancelCheck()
```
## 10.check.html
```html
<html>
<head>
<title>Token Test Harness</title>
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
<style>
body{font-family: "Work Sans", sans-serif;padding: 20px;background: #fafafa;}
h1{font-weight: bold;}
input, button {padding: 6px;margin-bottom: 8px;}
button{font-weight: bold;font-family: "Work Sans", sans-serif;}
td{vertical-align: middle;}
</style>
<script src='https://unpkg.com/xrpl@2.7.0/build/xrpl-latest-min.js'></script>
<script src='ripplex1-send-xrp.js'></script>
<script src='ripplex2-send-currency.js'></script>
<script src='ripplex10-check.js'></script>
</head>
<!-- ************************************************************** -->
<!-- ********************** The Form ****************************** -->
<!-- ************************************************************** -->
<body>
<h1>Token Test Harness</h1>
<form id="theForm">
Choose your ledger instance:
&nbsp;&nbsp;
<input type="radio" id="tn" name="server"
value="wss://s.altnet.rippletest.net:51233" checked>
<label for="testnet">Testnet</label>
&nbsp;&nbsp;
<input type="radio" id="dn" name="server"
value="wss://s.devnet.rippletest.net:51233">
<label for="devnet">Devnet</label>
<br/><br/>
<button type="button" onClick="getAccountsFromSeeds()">Get Accounts From Seeds</button>
<br/>
<textarea id="seeds" cols="40" rows= "2"></textarea>
<br/><br/>
<table>
<tr valign="top">
<td>
<table>
<tr valign="top">
<td>
<td>
<button type="button" onClick="getAccount('standby')">Get New Standby Account</button>
<table>
<tr valign="top">
<td align="right">
Standby Account
</td>
<td>
<input type="text" id="standbyAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="standbyPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="standbyPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="standbySeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="standbyBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="standbyAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="standbyDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Issuer
</td>
<td>
<input type="text" id="standbyIssuerField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Check ID
</td>
<td>
<input type="text" id="standbyCheckID" size="40"></input>
<br>
</td>
</tr>
<tr valign="top">
<td><button type="button" onClick="configureAccount('standby',document.querySelector('#standbyDefault').checked)">Configure Account</button></td>
<td>
<input type="checkbox" id="standbyDefault" checked="true"/>
<label for="standbyDefault">Allow Rippling</label>
</td>
</tr>
<tr>
<td align="right">
Currency
</td>
<td>
<input type="text" id="standbyCurrencyField" size="40" value="USD"></input>
</td>
</tr>
</table>
<p align="left">
<textarea id="standbyResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
<td>
<table>
<tr valign="top">
<td align="center" valign="top">
<button type="button" onClick="sendXRP()">Send XRP&#62;</button>
<br/><br/>
<button type="button" onClick="sendCheck()">Send Check</button>
<br/>
<button type="button" onClick="getChecks()">Get Checks</button>
<br/>
<button type="button" onClick="cashCheck()">Cash Check</button>
<br/>
<button type="button" onClick="cancelCheck()">Cancel Check</button>
<br/>
<button type="button" onClick="getBalances()">Get Balances</button>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<td>
<table>
<tr>
<td align="center" valign="top">
<button type="button" onClick="oPsendXRP()">&#60; Send XRP</button>
<br/><br/>
<button type="button" onClick="opSendCheck()">Send Check</button>
<br/>
<button type="button" onClick="opGetChecks()">Get Checks</button>
<br/>
<button type="button" onClick="opCashCheck()">Cash Check</button>
<br/>
<button type="button" onClick="opCancelCheck()">Cancel Check</button>
<br/>
<button type="button" onClick="getBalances()">Get Balances</button>
</td>
<td valign="top" align="right">
<button type="button" onClick="getAccount('operational')">Get New Operational Account</button>
<table>
<tr valign="top">
<td align="right">
Operational Account
</td>
<td>
<input type="text" id="operationalAccountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Public Key
</td>
<td>
<input type="text" id="operationalPubKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Private Key
</td>
<td>
<input type="text" id="operationalPrivKeyField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Seed
</td>
<td>
<input type="text" id="operationalSeedField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
XRP Balance
</td>
<td>
<input type="text" id="operationalBalanceField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Amount
</td>
<td>
<input type="text" id="operationalAmountField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Destination
</td>
<td>
<input type="text" id="operationalDestinationField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Issuer
</td>
<td>
<input type="text" id="operationalIssuerField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td align="right">
Check ID
</td>
<td>
<input type="text" id="operationalCheckIDField" size="40"></input>
<br>
</td>
</tr>
<tr>
<td>
</td>
<td align="right">
<input type="checkbox" id="operationalDefault" checked="true"/>
<label for="operationalDefault">Allow Rippling</label>
<button type="button" onClick="configureAccount('operational',document.querySelector('#operationalDefault').checked)">Configure Account</button>
</td>
</tr>
<tr>
<td align="right">
Currency
</td>
<td>
<input type="text" id="operationalCurrencyField" size="40" value="USD"></input>
</td>
</tr>
</table>
<p align="right">
<textarea id="operationalResultField" cols="80" rows="20" ></textarea>
</p>
</td>
</td>
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
```