Skip to content

Commit 484db5a

Browse files
DennisDawsonDennisDawson
authored
Merge pull request #2997 from XRPLF/add_mpt_uc_1
MPT use case with MPT generator, Send MPT Tutorial
2 parents fe1e0f4 + 58b6b2e commit 484db5a

29 files changed

+2356
-2
lines changed

‎_code-samples/mpt-generator/modular-tutorials.css

Lines changed: 150 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,150 @@
1+
body {
2+
font-family: "Inter", sans-serif;
3+
padding: 20px;
4+
background: #abe2ff;
5+
}
6+
7+
h1 {
8+
font-weight: bold;
9+
}
10+
11+
td {
12+
padding-left: 25px;
13+
vertical-align: top;
14+
}
15+
16+
input,
17+
button {
18+
padding: 6px;
19+
margin-bottom: 8px;
20+
border: none
21+
}
22+
23+
input:read-only {
24+
background-color:rgb(11, 96, 132);
25+
color:white;
26+
border: 0;
27+
}
28+
29+
button {
30+
font-weight: bold;
31+
font-family: "Work Sans", sans-serif;
32+
background-color: #006aff;
33+
-webkit-text-fill-color: white;
34+
}
35+
36+
button:hover {
37+
background-color: #0555c5;
38+
cursor: pointer;
39+
}
40+
41+
td {
42+
vertical-align: middle;
43+
}
44+
45+
/* The switch - the box around the slider */
46+
.switch {
47+
position: relative;
48+
display: inline-block;
49+
width: 30px;
50+
height: 16px;
51+
}
52+
53+
/* Hide default HTML checkbox */
54+
.switch input {
55+
opacity: 0;
56+
width: 0;
57+
height: 0;
58+
}
59+
60+
/* The slider */
61+
.slider {
62+
position: absolute;
63+
cursor: pointer;
64+
top: 0;
65+
left: 0;
66+
right: 0;
67+
bottom: 0;
68+
background-color: #ccc;
69+
-webkit-transition: .4s;
70+
transition: .4s;
71+
}
72+
73+
.slider:before {
74+
position: absolute;
75+
content: "";
76+
height: 13px;
77+
width: 13px;
78+
left: 4px;
79+
bottom: 2px;
80+
background-color: white;
81+
-webkit-transition: .4s;
82+
transition: .4s;
83+
}
84+
85+
input:checked+.slider {
86+
background-color: #2196F3;
87+
}
88+
89+
input:focus+.slider {
90+
box-shadow: 0 0 1px #2196F3;
91+
}
92+
93+
input:checked+.slider:before {
94+
-webkit-transform: translateX(13px);
95+
-ms-transform: translateX(13px);
96+
transform: translateX(13px);
97+
}
98+
99+
/* Rounded sliders */
100+
.slider.round {
101+
border-radius: 17px;
102+
}
103+
104+
.slider.round:before {
105+
border-radius: 50%;
106+
}
107+
.tooltip {
108+
position: relative;
109+
border-bottom: 1px dotted black;
110+
}
111+
112+
.tooltip:before {
113+
content: attr(tooltip-data);
114+
position: absolute;
115+
width: 250px;
116+
background-color: #006aff;
117+
color: #fff;
118+
text-align: center;
119+
padding: 15px;
120+
line-height: 1.1;
121+
border-radius: 5px;
122+
z-index: 1;
123+
opacity: 0;
124+
transition: opacity .5s;
125+
bottom: 125%;
126+
left: 50%;
127+
margin-left: -60px;
128+
font-size: 0.70em;
129+
visibility: hidden;
130+
}
131+
132+
.tooltip:after {
133+
content: "";
134+
position: absolute;
135+
bottom: 75%;
136+
left: 50%;
137+
margin-left: -5px;
138+
border-width: 5px;
139+
border-style: solid;
140+
opacity: 0;
141+
transition: opacity .5s;
142+
border-color: #000 transparent transparent transparent;
143+
visibility: hidden;
144+
}
145+
146+
.tooltip:hover:before,
147+
.tooltip:hover:after {
148+
opacity: 1;
149+
visibility: visible;
150+
}

‎_code-samples/mpt-generator/mpt-generator.htm

Lines changed: 232 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,232 @@
1+
<html>
2+
3+
<head>
4+
<title>MPT Generator</title>
5+
<link href='https://fonts.googleapis.com/css?family=Work Sans' rel='stylesheet'>
6+
<link href="modular-tutorials.css" rel="stylesheet">
7+
<script src='https://unpkg.com/xrpl@4.1.0/build/xrpl-latest.js'></script>
8+
9+
<script src='mpt-generator.js'></script>
10+
<script>
11+
if (typeof module !== "undefined") {
12+
const xrpl = require("xrpl")
13+
}
14+
</script>
15+
16+
</head>
17+
18+
<body>
19+
<h1>MPT Generator</h1>
20+
<form>
21+
<table width="100%">
22+
<tr>
23+
<td valign="top">
24+
<table>
25+
<tr>
26+
<td>
27+
<table>
28+
<tr valign="top">
29+
<td colspan="3">
30+
<span class="tooltip" tooltip-data="Choose the XRPL host server for your account.">
31+
Choose your ledger instance:
32+
</span>
33+
&nbsp;&nbsp;
34+
<input type="radio" id="dn" name="server"
35+
value="wss://s.devnet.rippletest.net:51233" checked>
36+
<label for="devnet">Devnet</label>
37+
&nbsp;&nbsp;
38+
<input type="radio" id="tn" name="server"
39+
value="wss://s.altnet.rippletest.net:51233" >
40+
<label for="testnet">Testnet</label>
41+
</td>
42+
</tr>
43+
<tr>
44+
<td align="right">
45+
<span class="tooltip" tooltip-data="Arbitrary human-readable name for the account.">
46+
<label for="accountNameField">Account Name</label>
47+
</span>
48+
</td>
49+
<td>
50+
<input type="text" id="accountNameField" size="40"></input>
51+
</td>
52+
</tr>
53+
<tr>
54+
<td align="right">
55+
<div class="container">
56+
<span class="tooltip" tooltip-data="The issuing account address.">Account
57+
</span>
58+
</div>
59+
</td>
60+
<td>
61+
62+
<input type="text" id="accountField" size="40"></input>
63+
</td>
64+
<td>
65+
<button type="button" onClick="getAccount()">Get New
66+
Account</button>
67+
</td>
68+
69+
</tr>
70+
<tr>
71+
<td align="right">
72+
<span class="tooltip" tooltip-data="The issuing account seed.">Seed
73+
</span>
74+
</td>
75+
<td>
76+
77+
<input type="text" id="seedField" size="40"></input>
78+
</td>
79+
<td>
80+
<button type="button" onClick="getAccountFromSeed()">Get Account
81+
From Seed</button>
82+
</td>
83+
</tr>
84+
<table>
85+
</td>
86+
</tr>
87+
<tr>
88+
<td>
89+
<span class="tooltip" tooltip-data="An asset scale is the difference, in orders of magnitude, between a standard unit and a corresponding fractional unit.">
90+
Asset Scale
91+
</span>
92+
</td>
93+
<td>
94+
<input type="text" size="10" id="assetScaleField" />
95+
</td>
96+
</tr>
97+
<tr>
98+
<td>
99+
<span class="tooltip" tooltip-data="The maximum number of tokens to be issued.">
100+
Maximum Tokens
101+
</span>
102+
</td>
103+
<td>
104+
<input type="text" size="10" id="maximumAmountField" />
105+
</td>
106+
</tr>
107+
<tr>
108+
<td>
109+
<span class="tooltip" tooltip-data="Fee collected when MPT is transferred.">
110+
Transfer Fee
111+
</span>
112+
</td>
113+
<td>
114+
<input type="text" size="5" id="transferFeeField" />
115+
</td>
116+
</tr>
117+
<tr>
118+
<td></td>
119+
</tr>
120+
<tr>
121+
<td>
122+
<span class="tooltip" tooltip-data="Issuer can claw back value from holders.">
123+
Clawback
124+
</span>
125+
</td>
126+
<td align="middle">
127+
<label class="switch">
128+
<input type="checkbox" id="clawbackSlider">
129+
<span class="slider round"></span>
130+
</label>
131+
</td>
132+
</tr>
133+
<tr>
134+
<td>
135+
<span class="tooltip" tooltip-data="MPT can be locked individually and globally.">
136+
Lock
137+
</span>
138+
</td>
139+
<td align="middle">
140+
<label class="switch">
141+
<input type="checkbox" id="lockSlider" name="lockSlider">
142+
143+
<span class="slider round"></span>
144+
</label>
145+
</td>
146+
</tr>
147+
<tr>
148+
<td>
149+
<span class="tooltip" tooltip-data="Individual holders must be authorized.">
150+
Require Authorization
151+
</span>
152+
</td>
153+
<td align="middle">
154+
<label class="switch">
155+
<input type="checkbox" id="authTokensSlider">
156+
<span class="slider round"></span>
157+
</label>
158+
</td>
159+
</tr>
160+
<tr>
161+
<td>
162+
<span class="tooltip" tooltip-data="MPTs can be transferred to other accounts.">
163+
Can Transfer
164+
</span>
165+
</td>
166+
<td align="middle">
167+
<label class="switch">
168+
<input type="checkbox" id="txrSlider">
169+
<span class="slider round"></span>
170+
</label>
171+
</td>
172+
</tr>
173+
<tr>
174+
<td>
175+
<span class="tooltip" tooltip-data="MPT can be traded.">
176+
Can Trade
177+
</span>
178+
</td>
179+
<td align="middle">
180+
<label class="switch">
181+
<input type="checkbox" id="tradeSlider">
182+
<span class="slider round"></span>
183+
</label>
184+
</td>
185+
</tr>
186+
<tr>
187+
<td>
188+
<span class="tooltip" tooltip-data="MPT can be used in an escrow.">
189+
Can Escrow
190+
</span>
191+
</td>
192+
<td align="middle">
193+
<label class="switch">
194+
<input type="checkbox" id="escrowSlider">
195+
<span class="slider round"></span>
196+
</label>
197+
</td>
198+
</tr>
199+
<tr>
200+
</tr>
201+
<tr>
202+
<td>
203+
<b>Token Metadata</b>
204+
</td>
205+
</tr>
206+
<tr>
207+
<td colspan="3">
208+
<textarea id="metadataTextArea" rows="25" cols="75"></textarea>
209+
</td>
210+
</tr>
211+
</table>
212+
</td>
213+
<td>
214+
<h2>MPToken Create Transaction</h2>
215+
<p><button type="button" onclick="generateCode()">Generate Transaction</button>
216+
&nbsp;&nbsp;
217+
<button type = "button" onclick="sendTransaction()">Send Transaction</button>
218+
&nbsp;&nbsp;
219+
<button type = "button" onclick="gatherMptInfo()">Gather MPT Information</button>
220+
</p>
221+
<span class="tooltip" tooltip-data="The MPT Issuance ID of your generated MPT.">
222+
MPT Issuance ID
223+
</span>
224+
<p><input type="text" id="mptIssuanceIdField" size="50"></p>
225+
<textarea id="resultField" rows="25" cols="75"></textarea>
226+
</td>
227+
</tr>
228+
</table>
229+
</form>
230+
</body>
231+
232+
</html>

0 commit comments

Comments
 (0)