seasharp/basicswap_miserver
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #65 from gerlofvanek/dev

Browse Source 
ui: JS fix
This commit is contained in:
Gerlof van Ek 2024-03-09 19:50:39 +01:00 committed by GitHub
commit 31a1224311
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 103 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

197
basicswap/templates/offers.html
View File

@ -1069,7 +1069,7 @@ const chart = new Chart(ctx, {
</div> </div>
<script> <script>
const coinNameToSymbol = { const coinNameToSymbol = {
'Bitcoin': 'BTC', 'Bitcoin': 'BTC',
'Particl': 'PART', 'Particl': 'PART',
'Particl Blind': 'PART', 'Particl Blind': 'PART',
@ -1079,125 +1079,134 @@ const chart = new Chart(ctx, {
'Firo': 'FIRO', 'Firo': 'FIRO',
'Dash': 'DASH', 'Dash': 'DASH',
'PIVX': 'PIVX' 'PIVX': 'PIVX'
}; };
const exchangeRateCache = {}; const exchangeRateCache = {};
function updateUsdValue(cryptoCell, coinFullName, isRate = false) { function updateUsdValue(cryptoCell, coinFullName, isRate = false) {
const coinSymbol = coinNameToSymbol[coinFullName]; const coinSymbol = coinNameToSymbol[coinFullName];
if (!coinSymbol) { if (!coinSymbol) {
console.error(`Coin symbol not found for full name: ${coinFullName}`); console.error(`Coin symbol not found for full name: ${coinFullName}`);
return; return;
} }
const cryptoValue = parseFloat(cryptoCell.textContent); const cryptoValue = parseFloat(cryptoCell.textContent);
const usdCell = cryptoCell.nextElementSibling; const usdCell = cryptoCell.nextElementSibling;
if (usdCell) {
// Check if the exchange rate is in the cache and is not expired
if (exchangeRateCache[coinSymbol] && !isCacheExpired(coinSymbol)) {
console.log(`Using cached exchange rate for ${coinSymbol}`);
const exchangeRate = exchangeRateCache[coinSymbol].rate;
const cryptoValue = parseFloat(cryptoCell.textContent);
const usdValue = cryptoValue * exchangeRate;
usdCell.textContent = `${usdValue.toFixed(2)} USD`;
updateProfitLoss(cryptoCell.closest('tr'));
updateProfitValue(cryptoCell.closest('tr'));
}
} else {
}
if (isRate) { if (isRate) {
const rateCell = usdCell.nextElementSibling; const rateCell = usdCell.nextElementSibling;
const usdValue = rateCell.previousElementSibling.textContent * cryptoValue; if (rateCell) {
usdCell.textContent = `${usdValue.toFixed(2)} USD`; const usdValue = rateCell.previousElementSibling.textContent * cryptoValue;
usdCell.textContent = `${usdValue.toFixed(2)} USD`;
} else {
console.error("Rate cell does not exist.");
}
} else { } else {
const apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${coinSymbol}&tsyms=USD`; const apiUrl = `https://min-api.cryptocompare.com/data/price?fsym=${coinSymbol}&tsyms=USD`;
// Check if the exchange rate is in the cache and is not expired // Check if the exchange rate is in the cache and is not expired
if (exchangeRateCache[coinSymbol] && !isCacheExpired(coinSymbol)) { if (exchangeRateCache[coinSymbol] && !isCacheExpired(coinSymbol)) {
console.log(`Using cached exchange rate for ${coinSymbol}`); console.log(`Using cached exchange rate for ${coinSymbol}`);
const exchangeRate = exchangeRateCache[coinSymbol].rate; const exchangeRate = exchangeRateCache[coinSymbol].rate;
const usdValue = cryptoValue * exchangeRate; const usdValue = cryptoValue * exchangeRate;
usdCell.textContent = `${usdValue.toFixed(2)} USD`; usdCell.textContent = `${usdValue.toFixed(2)} USD`;
updateProfitLoss(cryptoCell.closest('tr')); updateProfitLoss(cryptoCell.closest('tr'));
updateProfitValue(cryptoCell.closest('tr')); updateProfitValue(cryptoCell.closest('tr'));
} else { } else {
console.log(`Fetching exchange rate from API for ${coinSymbol}`); console.log(`Fetching exchange rate from API for ${coinSymbol}`);
fetch(apiUrl) fetch(apiUrl)
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
const exchangeRate = data.USD; const exchangeRate = data.USD;
if (!isNaN(exchangeRate)) { if (!isNaN(exchangeRate)) {
console.log(`Received exchange rate from API for ${coinSymbol}`); console.log(`Received exchange rate from API for ${coinSymbol}`);
const usdValue = cryptoValue * exchangeRate; const usdValue = cryptoValue * exchangeRate;
usdCell.textContent = `${usdValue.toFixed(2)} USD`; usdCell.textContent = `${usdValue.toFixed(2)} USD`;
exchangeRateCache[coinSymbol] = { exchangeRateCache[coinSymbol] = {
rate: exchangeRate, rate: exchangeRate,
timestamp: Date.now(), timestamp: Date.now(),
ttl: 300000 // 5 minutes ttl: 300000 // 5 minutes
}; };
updateProfitLoss(cryptoCell.closest('tr')); updateProfitLoss(cryptoCell.closest('tr'));
updateProfitValue(cryptoCell.closest('tr')); updateProfitValue(cryptoCell.closest('tr'));
} else { } else {
console.error('Invalid exchange rate. Response:', data); console.error('Invalid exchange rate. Response:', data);
usdCell.textContent = 'Invalid exchange rate'; usdCell.textContent = 'Invalid exchange rate';
} }
}) })
.catch(error => { .catch(error => {
console.error('Error retrieving exchange rate:', error); });
usdCell.textContent = 'Error retrieving exchange rate'; }
});
}
} }
}
function isCacheExpired(coinSymbol) {
const cacheEntry = exchangeRateCache[coinSymbol];
return cacheEntry && (Date.now() - cacheEntry.timestamp > cacheEntry.ttl);
}
function updateProfitLoss(row) {
const buyingUSD = parseFloat(row.querySelector('.usd-value').textContent);
const sellingUSD = parseFloat(row.querySelectorAll('.usd-value')[1].textContent);
const profitLossCell = row.querySelector('.profit-loss');
if (!isNaN(sellingUSD) && !isNaN(buyingUSD)) {
const profitLossPercentage = ((sellingUSD - buyingUSD) / buyingUSD) * 100;
profitLossCell.textContent = `${profitLossPercentage.toFixed(2)}%`;
if (profitLossPercentage > 0) {
profitLossCell.classList.add('text-green-500'); // Profit (positive)
profitLossCell.classList.remove('text-red-500');
} else if (profitLossPercentage < 0) {
profitLossCell.classList.add('text-red-500'); // Loss (negative)
profitLossCell.classList.remove('text-green-500');
} else {
profitLossCell.classList.add('text-yellow-500'); // No profit or loss (zero)
profitLossCell.classList.remove('text-green-500', 'text-red-500');
}
} else {
profitLossCell.textContent = 'Invalid USD values';
profitLossCell.classList.remove('text-green-500', 'text-red-500');
}
} }
function updateProfitValue(row) { function isCacheExpired(coinSymbol) {
const cacheEntry = exchangeRateCache[coinSymbol];
return cacheEntry && (Date.now() - cacheEntry.timestamp > cacheEntry.ttl);
}
function updateProfitLoss(row) {
const buyingUSD = parseFloat(row.querySelector('.usd-value').textContent);
const sellingUSD = parseFloat(row.querySelectorAll('.usd-value')[1].textContent);
const profitLossCell = row.querySelector('.profit-loss');
if (!isNaN(sellingUSD) && !isNaN(buyingUSD)) {
const profitLossPercentage = ((sellingUSD - buyingUSD) / buyingUSD) * 100;
profitLossCell.textContent = `${profitLossPercentage.toFixed(2)}%`;
if (profitLossPercentage > 0) {
profitLossCell.classList.add('text-green-500'); // Profit (positive)
profitLossCell.classList.remove('text-red-500');
} else if (profitLossPercentage < 0) {
profitLossCell.classList.add('text-red-500'); // Loss (negative)
profitLossCell.classList.remove('text-green-500');
} else {
profitLossCell.classList.add('text-yellow-500'); // No profit or loss (zero)
profitLossCell.classList.remove('text-green-500', 'text-red-500');
}
} else {
profitLossCell.textContent = 'Invalid USD values';
profitLossCell.classList.remove('text-green-500', 'text-red-500');
}
}
function updateProfitValue(row) {
const sellingUSD = parseFloat(row.querySelector('.usd-value').textContent); const sellingUSD = parseFloat(row.querySelector('.usd-value').textContent);
const profitValueCell = row.querySelector('.profit-value'); const profitValueCell = row.querySelector('.profit-value');
if (!isNaN(sellingUSD)) { if (!isNaN(sellingUSD)) {
profitValueCell.textContent = `${sellingUSD.toFixed(2)} USD`; profitValueCell.textContent = `${sellingUSD.toFixed(2)} USD`;
} else { } else {
profitValueCell.textContent = 'Invalid USD value'; profitValueCell.textContent = 'Invalid USD value';
} }
} }
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const coinNameValues = document.querySelectorAll('.coinname-value'); const coinNameValues = document.querySelectorAll('.coinname-value');
for (let i = 0; i < coinNameValues.length; i++) { coinNameValues.forEach(coinNameValue => {
const coinFullName = coinNameValues[i].getAttribute('data-coinname'); const coinFullName = coinNameValue.getAttribute('data-coinname');
const isRate = coinNameValues[i].textContent.includes('rate'); const isRateElement = coinNameValue.parentElement.querySelector('.ratetype');
updateUsdValue(coinNameValues[i], coinFullName, isRate); const isRate = isRateElement ? isRateElement.textContent.includes('rate') : false;
updateUsdValue(coinNameValue, coinFullName, isRate);
if (!isRate) { });
coinNameValues[i].addEventListener('input', () => { });
console.log(`Clearing cache for ${coinNameToSymbol[coinFullName]}`);
exchangeRateCache[coinNameToSymbol[coinFullName]] = undefined;
updateUsdValue(coinNameValues[i], coinFullName);
});
}
}
});
</script> </script>
{% include 'footer.html' %} {% include 'footer.html' %}
</body> </body>