Skip to content

Commit 5bb552d

Browse files
DennisDawsonDennisDawson
committed
Revise payment tutorials, add/remove screenshots
1 parent d89f9fb commit 5bb552d

File tree

108 files changed

+4847
-3614
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

108 files changed

+4847
-3614
lines changed

‎_code-samples/modular-tutorials/account-support.js

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
// ******************************************************
2+
// ************* Get the Preferred Network **************
3+
// ******************************************************
4+
5+
function getNet() {
6+
let net
7+
if (document.getElementById("tn").checked) net = "wss://s.altnet.rippletest.net:51233/"
8+
if (document.getElementById("dn").checked) net = "wss://s.devnet.rippletest.net:51233/"
9+
const client = new xrpl.Client(net)
10+
return net
11+
} // End of getNet()
12+
13+
// *******************************************************
14+
// ************* Get Account *****************************
15+
// *******************************************************
16+
17+
async function getAccount() {
18+
let net = getNet()
19+
const client = new xrpl.Client(net)
20+
await client.connect()
21+
let results = `\nConnected to ${net}.`
22+
let faucetHost = null
23+
const my_wallet = (await client.fundWallet(null, { faucetHost})).wallet
24+
const newAccount = [my_wallet.address, my_wallet.seed]
25+
return (newAccount)
26+
client.disconnect()
27+
} // End of getAccount()
28+
29+
async function getNewAccount1() {
30+
account1address.value = "Getting new account."
31+
const accountInfo= await getAccount()
32+
account1address.value = accountInfo[0]
33+
account1seed.value = accountInfo[1]
34+
}
35+
36+
async function getNewAccount2() {
37+
account2address.value = "Getting new account."
38+
const accountInfo= await getAccount()
39+
account2address.value = accountInfo[0]
40+
account2seed.value = accountInfo[1]
41+
}
42+
43+
// *****************************************************
44+
// ********** Get Account from Seed ********************
45+
// *****************************************************
46+
47+
async function getAccountFromSeed(my_seed) {
48+
const net = getNet()
49+
const client = new xrpl.Client(net)
50+
await client.connect()
51+
let results = '\nConnected, finding wallet.\n'
52+
resultField.value = results
53+
const wallet = xrpl.Wallet.fromSeed(my_seed)
54+
// ----------------------Populate the fields for left and right accounts.
55+
const address = wallet.address
56+
client.disconnect()
57+
return (address)
58+
} // End of getAccountFromSeed()
59+
60+
// *****************************************************
61+
// ********** Get Account from Seed1 *******************
62+
// *****************************************************
63+
64+
async function getAccountFromSeed1() {
65+
account1address.value = await getAccountFromSeed(account1seed.value)
66+
}
67+
68+
// *****************************************************
69+
// ********** Get Account from Seed2 *******************
70+
// *****************************************************
71+
72+
async function getAccountFromSeed2() {
73+
account2address.value = await getAccountFromSeed(account2seed.value)
74+
}
75+
76+
// *****************************************************
77+
// ************ Gather Account Info ********************
78+
// *****************************************************
79+
80+
function gatherAccountInfo() {
81+
let accountData = account1name.value + "\n" + account1address.value + "\n" + account1seed.value + "\n"
82+
accountData += account2name.value + "\n" + account2address.value + "\n" + account2seed.value
83+
resultField.value = accountData
84+
}
85+
86+
// *****************************************************
87+
// ********** Distribute Account Info ******************
88+
// *****************************************************
89+
90+
function distributeAccountInfo() {
91+
let accountInfo = resultField.value.split("\n")
92+
account1name.value = accountInfo[0]
93+
account1address.value = accountInfo[1]
94+
account1seed.value = accountInfo[2]
95+
account2name.value = accountInfo[3]
96+
account2address.value = accountInfo[4]
97+
account2seed.value = accountInfo[5]
98+
}
99+
100+
// *****************************************************
101+
// ************ Populate Active Form 1 *****************
102+
// *****************************************************
103+
104+
function populate1() {
105+
accountNameField.value = account1name.value
106+
accountAddressField.value = account1address.value
107+
accountSeedField.value = account1seed.value
108+
getXrpBalance()
109+
}
110+
111+
// *****************************************************
112+
// ************ Populate Active Form 2 *****************
113+
// *****************************************************
114+
115+
function populate2() {
116+
accountNameField.value = account2name.value
117+
accountAddressField.value = account2address.value
118+
accountSeedField.value = account2seed.value
119+
getXrpBalance()
120+
}
121+
122+
// *******************************************************
123+
// **************** Get Xrp Balance *********************
124+
// *******************************************************
125+
126+
async function getXrpBalance() {
127+
const net = getNet()
128+
const client = new xrpl.Client(net)
129+
await client.connect()
130+
xrpBalanceField.value = await client.getXrpBalance(accountAddressField.value)
131+
client.disconnect()
132+
} // End of getXrpBalance()
133+
134+
// *******************************************************
135+
// ************** Get Token Balance *********************
136+
// *******************************************************
137+
138+
async function getTokenBalance() {
139+
let net = getNet()
140+
const client = new xrpl.Client(net)
141+
results = 'Connecting to ' + getNet() + '....'
142+
resultField.value = results
143+
await client.connect()
144+
results += '\nConnected.'
145+
resultField.value = results
146+
const wallet = xrpl.Wallet.fromSeed(accountSeedField.value)
147+
results= "\nGetting account balance...\n"
148+
const balance = await client.request({
149+
command: "gateway_balances",
150+
account: wallet.address,
151+
ledger_index: "validated",
152+
})
153+
results += JSON.stringify(balance.result, null, 2)
154+
resultField.value = results
155+
xrpBalanceField.value = (await client.getXrpBalance(wallet.address))
156+
client.disconnect()
157+
} // End of getTokenBalance()
158+

‎_code-samples/modular-tutorials/base-module.html

Lines changed: 201 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
<html>
2+
<head>
3+
<title>XRPL Base Module</title>
4+
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
5+
<link href="modular-tutorials.css" rel="stylesheet">
6+
<script src='https://unpkg.com/xrpl@4.1.0/build/xrpl-latest.js'></script>
7+
<script src="account-support.js"></script>
8+
<script src='send-xrp.js'></script>
9+
</head>
10+
11+
<!-- ************************************************************** -->
12+
<!-- ********************** The Form ****************************** -->
13+
<!-- ************************************************************** -->
14+
15+
<body>
16+
<h1>XRPL Base Module</h1>
17+
<form id="theForm">
18+
<span class="tooltip" tooltip-data="Choose the XRPL host server for your account.">
19+
Choose your ledger instance:
20+
</span>
21+
&nbsp;&nbsp;
22+
<input type="radio" id="dn" name="server" value="wss://s.devnet.rippletest.net:51233" checked>
23+
<label for="dn">Devnet</label>
24+
&nbsp;&nbsp;
25+
<input type="radio" id="tn" name="server" value="wss://s.altnet.rippletest.net:51233">
26+
<label for="tn">Testnet</label>
27+
<br /><br />
28+
<table>
29+
<tr>
30+
<td>
31+
<button type="button" onClick="getNewAccount1()">Get New Account 1</button>
32+
</td>
33+
<td>
34+
<button type="button" onClick="getAccountFromSeed1()">Get Account 1 From Seed</button>
35+
</td>
36+
<td>
37+
<button type="button" onClick="getNewAccount2()">Get New Account 2</button>
38+
</td>
39+
<td>
40+
<button type="button" onClick="getAccountFromSeed2()">Get Account 2 From Seed</button>
41+
</td>
42+
</tr>
43+
<tr>
44+
<td>
45+
<span class="tooltip" tooltip-data="Arbitrary human-readable name for the account."><label for="account1name">Account 1 Name</label>
46+
</span>
47+
</td>
48+
<td>
49+
<input type="text" id="account1name" size="40"></input>
50+
</td>
51+
<td>
52+
<span class="tooltip" tooltip-data="Arbitrary human-readable name for the account.">
53+
<label for="account2name">Account 2 Name</label>
54+
</span>
55+
</td>
56+
<td>
57+
<input type="text" id="account2name" size="40"></input>
58+
</td>
59+
</tr>
60+
<tr>
61+
<td>
62+
<span class="tooltip" tooltip-data="Identifying address for the account.">
63+
<label for="account1address">Account 1 Address</label>
64+
</span>
65+
</td>
66+
<td>
67+
<input type="text" id="account1address" size="40"></input>
68+
</td>
69+
<td>
70+
<span class="tooltip" tooltip-data="Identifying address for the account.">
71+
<label for="account2address">Account 2 Address</label>
72+
</span>
73+
</td>
74+
<td>
75+
<input type="text" id="account2address" size="40"></input>
76+
</td>
77+
</tr>
78+
<tr>
79+
<td>
80+
<span class="tooltip" tooltip-data="Seed for deriving public and private keys for the account.">
81+
<label for="account1seed">Account 1 Seed</label>
82+
</span>
83+
</td>
84+
<td>
85+
<input type="text" id="account1seed" size="40"></input>
86+
</td>
87+
<td>
88+
<span class="tooltip" tooltip-data="Seed for deriving public and private keys for the account.">
89+
<label for="account2seed">Account 2 Seed</label>
90+
</span>
91+
</td>
92+
<td>
93+
<input type="text" id="account2seed" size="40"></input>
94+
</td>
95+
</tr>
96+
</table>
97+
<hr />
98+
<table>
99+
<tr valign="top">
100+
<td align="right">
101+
<span class="tooltip" tooltip-data="Name of the currently selected account.">
102+
<label for="accountNameField">Account Name</label>
103+
</span>
104+
</td>
105+
<td>
106+
<input type="text" id="accountNameField" size="40" readonly></input>
107+
<input type="radio" id="account1" name="accounts" value="account1">
108+
<label for="account1">Account 1</label>
109+
</td>
110+
</tr>
111+
<tr valign="top">
112+
<td align="right">
113+
<span class="tooltip" tooltip-data="Address of the currently selected account.">
114+
<label for="accountAddressField">Account Address</label>
115+
</span>
116+
</td>
117+
<td>
118+
<input type="text" id="accountAddressField" size="40" readonly></input>
119+
<input type="radio" id="account2" name="accounts" value="account2">
120+
<label for="account2">Account 2</label>
121+
</td>
122+
</tr>
123+
<tr valign="top">
124+
<td align="right">
125+
<span class="tooltip" tooltip-data="Seed of the currently selected account.">
126+
<label for="accountSeedField">Account Seed</label>
127+
</span>
128+
</td>
129+
<td>
130+
<input type="text" id="accountSeedField" size="40" readonly></input>
131+
<br>
132+
</td>
133+
</tr>
134+
<tr>
135+
<td align="right">
136+
<span class="tooltip" tooltip-data="XRP balance for the currently selected account.">
137+
<label for="xrpBalanceField">XRP Balance</label>
138+
</span>
139+
</td>
140+
<td>
141+
<input type="text" id="xrpBalanceField" size="40" readonly></input>
142+
</td>
143+
<td>
144+
<button type="button" onClick="sendXRP()">Send XRP</button>
145+
</td>
146+
</tr>
147+
<tr>
148+
<td align="right">
149+
<span class="tooltip" tooltip-data="Amount of XRP to send.">
150+
<label for="amountField">Amount</label>
151+
</span>
152+
</td>
153+
<td>
154+
<input type="text" id="amountField" size="40"></input>
155+
<br>
156+
</td>
157+
<td align="left" valign="top">
158+
<button type="button" onClick="getXrpBalance()">Get XRP Balance</button>
159+
</td>
160+
</tr>
161+
<tr>
162+
<td align="right">
163+
<span class="tooltip" tooltip-data="Destination account address where XRP is sent.">
164+
<lable for="destinationField">Destination</lable>
165+
</span>
166+
</td>
167+
<td>
168+
<input type="text" id="destinationField" size="40"></input>
169+
<br>
170+
</td>
171+
<td align="left" valign="top">
172+
<button type="button" onClick="getTokenBalance()">Get Token Balance</button>
173+
</td>
174+
</tr>
175+
<tr>
176+
<td colspan="2">
177+
<p align="right">
178+
<textarea id="resultField" cols="80" rows="20"></textarea>
179+
</p>
180+
</td>
181+
<td align="left" valign="top">
182+
<button type="button" onClick="gatherAccountInfo()">Gather Account Info</button><br/>
183+
<button type="button" onClick="distributeAccountInfo()">Distribute Account Info</button>
184+
</td>
185+
</tr>
186+
</table>
187+
</form>
188+
</body>
189+
<script>
190+
const radioButtons = document.querySelectorAll('input[type="radio"]');
191+
radioButtons.forEach(radio => {
192+
radio.addEventListener('change', function() {
193+
if (this.value === 'account1') {
194+
populate1()
195+
} else if (this.value === 'account2') {
196+
populate2()
197+
}
198+
});
199+
});
200+
</script>
201+
</html>

0 commit comments

Comments
 (0)