nathanwoodburn/stWDBRN
1
0
Fork 0
generated from nathanwoodburn/python-webserver-template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add converter to the main page
All checks were successful
Build Docker / BuildImage (push) Successful in 38s
Details

Browse Source
This commit is contained in:
Nathan Woodburn
2024-12-21 17:29:09 +11:00
parent f066306679
commit ba32272a53
31 changed files with 2781 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
templates/index.html
View File

@@ -7,20 +7,20 @@
<title>Vault | Woodburn</title>
<meta name="theme-color" content="#ffffff">
<meta name="twitter:description" content="Woodburn Vault">
<meta name="twitter:image" content="https://vault.woodburn.au/assets/img/favicon.png">
<meta name="twitter:image" content="https://sol.woodburn.au/assets/img/favicon.png">
<meta property="og:description" content="Woodburn Vault">
<meta property="og:type" content="website">
<meta property="og:title" content="Vault | Woodburn">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Vault | Woodburn">
<meta name="description" content="Woodburn Vault">
<meta property="og:image" content="https://vault.woodburn.au/assets/img/favicon.png">
<meta property="og:image" content="https://sol.woodburn.au/assets/img/favicon.png">
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "WebSite",
"name": "Vault | Woodburn",
"url": "https://vault.woodburn.au"
"url": "https://sol.woodburn.au"
}
</script>
<link rel="icon" type="image/png" sizes="192x192" href="assets/img/favicon-192.png">
@@ -29,6 +29,7 @@
<link rel="manifest" href="manifest.json" crossorigin="use-credentials">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900&amp;display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i&amp;display=swap">
<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
</head>
<body>
@@ -41,6 +42,64 @@
<h1 class="masthead-heading mb-0">Woodburn Vault</h1>
<h2 class="masthead-subheading mb-0">An easy way to buy into a diverse crypto portfolio.</h2>
<p>Woodburn Vault Balance: {{vault}} USD ({{vault_aud}} AUD)<br>stWDBRN Token Supply: {{supply}}<br>Current Token Value: {{value}} USD ({{value_aud}} AUD)</p>
<div style="display: inline-flex;">
<div class="input-group" style="width: fit-content;margin: 10px;"><span class="input-group-text">USD</span><input class="form-control" type="text" id="fiat-input" name="fiat" oninput="convert(&#39;fiat&#39;)" value="1"><button class="btn btn-primary" id="toggle-currency" type="button" onclick="toggleCurrency()">AUD</button></div><span class="fs-1 text-center d-xl-flex align-items-xl-center"><i class="fa fa-arrows-h"></i></span>
<div class="input-group" style="width: fit-content;margin: 10px;"><span class="input-group-text">stWDBRN</span><input class="form-control" type="text" id="stwdbrn-input" name="stwdbrn" oninput="convert(&#39;stwdbrn&#39;)"></div><script>
let currentFiat = 'USD';
function toggleCurrency() {
document.getElementById('toggle-currency').textContent = currentFiat;
currentFiat = currentFiat === 'USD' ? 'AUD' : 'USD';
document.querySelector('.input-group span').textContent = currentFiat;
convert('fiat');
}
async function convert(source) {
const fiatInput = document.getElementById('fiat-input');
const stwdbrnInput = document.getElementById('stwdbrn-input');
let endpoint = '';
if (source === 'fiat') {
const fiatAmount = parseFloat(fiatInput.value);
if (isNaN(fiatAmount) || fiatAmount <= 0) {
stwdbrnInput.value = '';
return;
}
endpoint = `/api/v1/${currentFiat.toLowerCase()}/${fiatAmount}`;
} else if (source === 'stwdbrn') {
const stwdbrnAmount = parseFloat(stwdbrnInput.value);
if (isNaN(stwdbrnAmount) || stwdbrnAmount <= 0) {
fiatInput.value = '';
return;
}
endpoint = `/api/v1/token/${stwdbrnAmount}`;
} else {
return;
}
try {
const response = await fetch(endpoint);
if (!response.ok) {
throw new Error('Error fetching data');
}
const data = await response.json();
if (source === 'fiat') {
stwdbrnInput.value = parseFloat(data.stWDBRN).toFixed(2);
} else if (source === 'stwdbrn') {
fiatInput.value = parseFloat(data[currentFiat.toLowerCase()]).toFixed(2);
}
} catch (error) {
console.error('Failed to fetch conversion data:', error);
}
}
// on window load set the initial value of the input fields
convert('fiat');
</script>
</div>
</div>
</div>
<div class="bg-circle-1 bg-circle"></div>