ui: Cleanup

This commit is contained in:
gerlofvanek 2023-06-26 20:06:32 +02:00
parent 416b003da9
commit 1859eccf0e

View File

@ -57,6 +57,7 @@
</div> </div>
</section> </section>
{% include 'inc_messages.html' %} {% include 'inc_messages.html' %}
{% if show_chart %} {% if show_chart %}
<section> <section>
<div class="pl-6 pr-6 pt-0 pb-0 mt-5 h-full overflow-hidden"> <div class="pl-6 pr-6 pt-0 pb-0 mt-5 h-full overflow-hidden">
@ -81,26 +82,6 @@
<section class="py-4 overflow-hidden"> <section class="py-4 overflow-hidden">
<div class="container px-4 mx-auto"> <div class="container px-4 mx-auto">
<div class="flex flex-wrap -m-3"> <div class="flex flex-wrap -m-3">
<style>
.active-container {
position: relative;
border-radius: 5px;
}
.active-container::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 1px solid rgb(77, 132, 240);
border-radius: inherit;
pointer-events: none;
}
</style>
<div class="w-full sm:w-1/2 lg:w-1/5 p-3" id="btc-container"> <div class="w-full sm:w-1/2 lg:w-1/5 p-3" id="btc-container">
<div class="px-5 py-3 h-full bg-coolGray-100 dark:bg-gray-500 rounded-lg dark:text-white" id="btc-active"> <div class="px-5 py-3 h-full bg-coolGray-100 dark:bg-gray-500 rounded-lg dark:text-white" id="btc-active">
<div class="flex items-center mb-2.5"> <div class="flex items-center mb-2.5">
@ -806,55 +787,6 @@ const chart = new Chart(ctx, {
<input type="hidden" name="pageno" value="{{ filters.page_no }}"> <input type="hidden" name="pageno" value="{{ filters.page_no }}">
</div> </div>
</div> </div>
<script>
const coinNameToSymbol = {
'Bitcoin': 'BTC',
'Particl': 'PART',
'Particl Blind': 'PART',
'Particl Anon': 'PART',
'Monero': 'XMR',
'Litecoin': 'LTC',
'Firo': 'FIRO',
'Dash': 'DASH',
'PIVX': 'PIVX'
};
function updateUsdValue(cryptoCell, coinFullName) {
const coinSymbol = coinNameToSymbol[coinFullName];
if (!coinSymbol) {
console.error(`Coin symbol not found for full name: ${coinFullName}`);
return;
}
const cryptoValue = parseFloat(cryptoCell.textContent);
const usdCell = cryptoCell.nextElementSibling;
const apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${coinSymbol}&tsyms=USD`;
fetch(apiUrl)
.then(response => response.json())
.then(data => {
const exchangeRate = data.USD;
if (!isNaN(exchangeRate)) {
const usdValue = cryptoValue * exchangeRate;
usdCell.textContent = `${usdValue.toFixed(2)} USD`;
} else {
usdCell.textContent = 'Invalid exchange rate';
}
})
.catch(error => {
usdCell.textContent = 'Error retrieving exchange rate';
});
}
document.addEventListener('DOMContentLoaded', () => {
const coinNameValues = document.querySelectorAll('.coinname-value');
for (let i = 0; i < coinNameValues.length; i++) {
const coinFullName = coinNameValues[i].getAttribute('data-coinname');
updateUsdValue(coinNameValues[i], coinFullName);
coinNameValues[i].addEventListener('input', () => updateUsdValue(coinNameValues[i], coinFullName));
}
});
</script>
<div class="rounded-b-md"> <div class="rounded-b-md">
<div class="w-full md:w-0/12"> <div class="w-full md:w-0/12">
<div class="flex flex-wrap justify-end pt-6 pr-6 border-t border-gray-100 dark:border-gray-400"> <div class="flex flex-wrap justify-end pt-6 pr-6 border-t border-gray-100 dark:border-gray-400">
@ -913,5 +845,54 @@ const coinNameToSymbol = {
updateChart('LTC'); updateChart('LTC');
}); });
</script> </script>
<script>
const coinNameToSymbol = {
'Bitcoin': 'BTC',
'Particl': 'PART',
'Particl Blind': 'PART',
'Particl Anon': 'PART',
'Monero': 'XMR',
'Litecoin': 'LTC',
'Firo': 'FIRO',
'Dash': 'DASH',
'PIVX': 'PIVX'
};
function updateUsdValue(cryptoCell, coinFullName) {
const coinSymbol = coinNameToSymbol[coinFullName];
if (!coinSymbol) {
console.error(`Coin symbol not found for full name: ${coinFullName}`);
return;
}
const cryptoValue = parseFloat(cryptoCell.textContent);
const usdCell = cryptoCell.nextElementSibling;
const apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${coinSymbol}&tsyms=USD`;
fetch(apiUrl)
.then(response => response.json())
.then(data => {
const exchangeRate = data.USD;
if (!isNaN(exchangeRate)) {
const usdValue = cryptoValue * exchangeRate;
usdCell.textContent = `${usdValue.toFixed(2)} USD`;
} else {
usdCell.textContent = 'Invalid exchange rate';
}
})
.catch(error => {
usdCell.textContent = 'Error retrieving exchange rate';
});
}
document.addEventListener('DOMContentLoaded', () => {
const coinNameValues = document.querySelectorAll('.coinname-value');
for (let i = 0; i < coinNameValues.length; i++) {
const coinFullName = coinNameValues[i].getAttribute('data-coinname');
updateUsdValue(coinNameValues[i], coinFullName);
coinNameValues[i].addEventListener('input', () => updateUsdValue(coinNameValues[i], coinFullName));
}
});
</script>
</body> </body>
</html> </html>