mirror of
https://github.com/aljazceru/ark.git
synced 2025-12-18 12:44:19 +01:00
135 lines
4.2 KiB
HTML
135 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<title>Ark liquidity simulator</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<link rel="stylesheet" href="style.css" />
|
|
<body>
|
|
<div style="display: flex">
|
|
<div style="width: 15%; border-right: 1px solid grey">
|
|
<p><strong>ASP</strong></p>
|
|
<p>
|
|
<label>
|
|
Initial budget (BTC)
|
|
<input type="number" id="initialBudget" value="1" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#initialBudget').value=1">1</a>
|
|
·
|
|
<a onclick="dqs('#initialBudget').value=10">10</a>
|
|
·
|
|
<a onclick="dqs('#initialBudget').value=100">100</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
Timelock (days)
|
|
<input type="number" id="timelock" value="28" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#timelock').value=14">2 weeks</a>
|
|
·
|
|
<a onclick="dqs('#timelock').value=28">1 month</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
VTXO ratio (1/n)
|
|
<input type="number" id="vtxoRatio" value="1" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#vtxoRatio').value=1">1</a>
|
|
·
|
|
<a onclick="dqs('#vtxoRatio').value=10">10</a>
|
|
·
|
|
<a onclick="dqs('#vtxoRatio').value=100">100</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
Dust limit (sats)
|
|
<input type="number" id="dustLimit" value="450" />
|
|
</label>
|
|
</p>
|
|
<p style="margin-top: 3rem"><strong>Users</strong></p>
|
|
<p>
|
|
<label>
|
|
Number of users
|
|
<input type="number" id="numberUsers" value="4" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#numberUsers').value=4">4</a>
|
|
·
|
|
<a onclick="dqs('#numberUsers').value=40">40</a>
|
|
·
|
|
<a onclick="dqs('#numberUsers').value=400">400</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
Onboard amount (BTC)
|
|
<input type="number" id="onboardAmount" value="0.01" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#onboardAmount').value=0.01">0.01</a>
|
|
·
|
|
<a onclick="dqs('#onboardAmount').value=0.1">0.1</a>
|
|
·
|
|
<a onclick="dqs('#onboardAmount').value=1">1</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
Monthly Money Velocity
|
|
<input type="number" id="moneyVelocity" value="0.33" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#moneyVelocity').value=0.33">0.33</a>
|
|
·
|
|
<a onclick="dqs('#moneyVelocity').value=0.50">0.50</a>
|
|
·
|
|
<a onclick="dqs('#moneyVelocity').value=1">1</a>
|
|
</p>
|
|
<p>
|
|
<label>
|
|
Monthly Payments
|
|
<input type="number" id="numberPayments" value="10" />
|
|
</label>
|
|
<br />
|
|
<a onclick="dqs('#numberPayments').value=1">1</a>
|
|
·
|
|
<a onclick="dqs('#numberPayments').value=10">10</a>
|
|
·
|
|
<a onclick="dqs('#numberPayments').value=100">100</a>
|
|
</p>
|
|
</div>
|
|
<div style="width: 85%; padding: 0 3rem">
|
|
<p><strong>Stats</strong></p>
|
|
<div class="graphContainer">
|
|
<div>
|
|
<p><strong>Payments</strong></p>
|
|
<div id="graph1"></div>
|
|
</div>
|
|
<div>
|
|
<p><strong>VTXOs</strong></p>
|
|
<div id="graph2"></div>
|
|
</div>
|
|
<div>
|
|
<p><strong>Budget</strong></p>
|
|
<div id="graph3"></div>
|
|
</div>
|
|
</div>
|
|
<div class="flexed">
|
|
<p><strong>Timeline</strong></p>
|
|
<p>
|
|
<button id="playButton">Play</button>
|
|
<button id="pauseButton">Pause</button>
|
|
<button id="resetButton">Reset</button>
|
|
</p>
|
|
</div>
|
|
<p style="margin-top: 0">
|
|
Each color tone represents a specific user<br />
|
|
Mouse over a circle to see a JSON representation of the payment
|
|
</p>
|
|
<div class="timelineContainer"></div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script src="decimal.js"></script>
|
|
<script src="script.js"></script>
|
|
</html>
|