ui: Cleanup
This commit is contained in:
parent
416b003da9
commit
1859eccf0e
@ -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>
|
||||||
|
Loading…
Reference in New Issue
Block a user