kumi/moner.ooo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: redo frontend js

Browse source
This commit is contained in:
recanman 2024-09-13 15:09:58 -07:00
parent 3ade0bffce
commit e4831ee3d9
1 changed files with 49 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

116
src/js/main.js
View file

@ -1,22 +1,22 @@
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.bundle.min'; import 'bootstrap/dist/js/bootstrap.bundle.min';
import '../css/custom.css'; import '../css/custom.css';
import Tooltip from "bootstrap/js/dist/tooltip"; import Tooltip from 'bootstrap/js/dist/tooltip';
var tooltipTriggerList = [].slice.call(
document.querySelectorAll('[data-toggle="tooltip"]') const tooltipTriggerList = Array.from(document.querySelectorAll('[data-toggle="tooltip"]'));
); const tooltipList = tooltipTriggerList.map(tooltipTriggerEl => new Tooltip(tooltipTriggerEl, { placement: 'top' }));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new Tooltip(tooltipTriggerEl, { placement: "top" });
});
console.log(tooltipList); console.log(tooltipList);
let lastModifiedField = 'xmr'; let lastModifiedField = 'xmr';
const exchangeRates = {};
var exchangeRates = {}; const runConvert = () =>
lastModifiedField === 'xmr' ? xmrConvert() : fiatConvert();
document.addEventListener('DOMContentLoaded', function () {
document.addEventListener('DOMContentLoaded', () => {
const copyXMRBtn = document.getElementById('copyXMRBtn'); const copyXMRBtn = document.getElementById('copyXMRBtn');
const copyFiatBtn = document.getElementById('copyFiatBtn'); const copyFiatBtn = document.getElementById('copyFiatBtn');
const xmrInput = document.getElementById('xmrInput'); const xmrInput = document.getElementById('xmrInput');
@ -31,66 +31,50 @@ document.addEventListener('DOMContentLoaded', function () {
button.addEventListener('click', (e) => { button.addEventListener('click', (e) => {
e.preventDefault(); e.preventDefault();
selectBox.value = button.textContent; selectBox.value = button.textContent;
if (lastModifiedField === 'xmr') { runConvert();
xmrConvert();
} else {
fiatConvert();
}
history.pushState(null, '', `?in=${button.textContent}`); history.pushState(null, '', `?in=${button.textContent}`);
}); });
}); });
// Add event listeners for the copy buttons // Add event listeners for the copy buttons
copyXMRBtn.addEventListener('click', copyToClipBoardXMR); copyXMRBtn.addEventListener('click', copyToClipboardXMR);
copyFiatBtn.addEventListener('click', copyToClipBoardFiat); copyFiatBtn.addEventListener('click', copyToClipboardFiat);
// Add event listeners for the XMR input field // Add event listeners for the XMR input field
xmrInput.addEventListener('change', () => xmrConvert(xmrInput.value)); xmrInput.addEventListener('change', xmrConvert);
xmrInput.addEventListener('keyup', () => { xmrInput.addEventListener('keyup', () => {
xmrInput.value = xmrInput.value.replace(/[^\.^,\d]/g, ''); xmrInput.value = xmrInput.value.replace(/[^\.^,\d]/g, '').replace(/\,/, '.');
xmrInput.value = xmrInput.value.replace(/\,/, '.');
if (xmrInput.value.split('.').length > 2) { if (xmrInput.value.split('.').length > 2) {
xmrInput.value = xmrInput.value.slice(0, -1); xmrInput.value = xmrInput.value.slice(0, -1);
} }
xmrConvert(xmrInput.value); xmrConvert();
});
xmrInput.addEventListener('input', () => {
lastModifiedField = 'xmr';
}); });
xmrInput.addEventListener('input', () => lastModifiedField = 'xmr');
// Add event listeners for the fiat input field // Add event listeners for the fiat input field
fiatInput.addEventListener('change', () => fiatConvert(fiatInput.value)); fiatInput.addEventListener('change', fiatConvert);
fiatInput.addEventListener('keyup', () => { fiatInput.addEventListener('keyup', () => {
fiatInput.value = fiatInput.value.replace(/[^\.^,\d]/g, ''); fiatInput.value = fiatInput.value.replace(/[^\.^,\d]/g, '').replace(/\,/, '.');
fiatInput.value = fiatInput.value.replace(/\,/, '.');
if (fiatInput.value.split('.').length > 2) { if (fiatInput.value.split('.').length > 2) {
fiatInput.value = fiatInput.value.slice(0, -1); fiatInput.value = fiatInput.value.slice(0, -1);
} }
fiatConvert(fiatInput.value); fiatConvert();
});
fiatInput.addEventListener('input', () => {
lastModifiedField = 'fiat';
}); });
fiatInput.addEventListener('input', () => lastModifiedField = 'fiat');
// Add event listener for the select box to change the conversion // Add event listener for the select box to change the conversion
selectBox.addEventListener('change', () => { selectBox.addEventListener('change', runConvert);
if (lastModifiedField === 'xmr') {
xmrConvert(selectBox.value)
} else {
fiatConvert(selectBox.value)
}
});
// Hide the conversion buttons if JavaScript is enabled // Hide the conversion buttons if JavaScript is enabled
convertXMRToFiatBtn.style.display = 'none'; convertXMRToFiatBtn.style.display = 'none';
convertFiatToXMRBtn.style.display = 'none'; convertFiatToXMRBtn.style.display = 'none';
// Fetch updated exchange rates immediately, then every 5 seconds // Fetch updated exchange rates immediately, then every 5 seconds
fetchUpdatedExchangeRates(); fetchUpdatedExchangeRates(true)
setInterval(fetchUpdatedExchangeRates, 5000); setInterval(fetchUpdatedExchangeRates, 5000);
}); });
function fetchUpdatedExchangeRates() { function fetchUpdatedExchangeRates(showAlert = false) {
fetch('/coingecko.php') fetch('/coingecko.php')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
@ -102,13 +86,12 @@ function fetchUpdatedExchangeRates() {
updateTimeElement(data.time); updateTimeElement(data.time);
// Re-execute the appropriate conversion function // Re-execute the appropriate conversion function
if (lastModifiedField === 'xmr') { runConvert();
xmrConvert();
} else {
fiatConvert();
}
}) })
.catch(error => console.error('Error fetching exchange rates:', error)); .catch(e => {
const msg = `Error fetching exchange rates: ${e}`;
showAlert ? alert(msg) : console.error(msg);
});
} }
function updateTimeElement(unixTimestamp) { function updateTimeElement(unixTimestamp) {
@ -123,41 +106,40 @@ function updateTimeElement(unixTimestamp) {
u.parentElement.innerHTML = u.parentElement.innerHTML.replace('Europe/Berlin', Intl.DateTimeFormat().resolvedOptions().timeZone); u.parentElement.innerHTML = u.parentElement.innerHTML.replace('Europe/Berlin', Intl.DateTimeFormat().resolvedOptions().timeZone);
} }
function copyToClipBoardXMR() { function copyToClipboardXMR() {
var content = document.getElementById('xmrInput'); const content = document.getElementById('xmrInput');
content.select(); content.select();
// Using deprecated execCommand for compatibility with older browsers
document.execCommand('copy'); document.execCommand('copy');
} }
function copyToClipBoardFiat() { function copyToClipboardFiat() {
var content = document.getElementById('fiatInput'); const content = document.getElementById('fiatInput');
content.select(); content.select();
// Using deprecated execCommand for compatibility with older browsers
document.execCommand('copy'); document.execCommand('copy');
} }
function fiatConvert(value) { function fiatConvert() {
let fiatAmount = document.getElementById("fiatInput").value; const fiatAmount = document.getElementById('fiatInput').value;
let xmrValue = document.getElementById("xmrInput"); const xmrValue = document.getElementById('xmrInput');
let selectBox = document.getElementById("selectBox").value; const selectBox = document.getElementById('selectBox').value;
if (exchangeRates[selectBox]) { if (exchangeRates[selectBox]) {
let value = fiatAmount / exchangeRates[selectBox]; const value = fiatAmount / exchangeRates[selectBox];
xmrValue.value = value.toFixed(12); xmrValue.value = value.toFixed(12);
} }
} }
function xmrConvert(value) { function xmrConvert() {
let xmrAmount = document.getElementById("xmrInput").value; const xmrAmount = document.getElementById('xmrInput').value;
let fiatValue = document.getElementById("fiatInput"); const fiatValue = document.getElementById('fiatInput');
let selectBox = document.getElementById("selectBox").value; const selectBox = document.getElementById('selectBox').value;
if (exchangeRates[selectBox]) { if (exchangeRates[selectBox]) {
let value = xmrAmount * exchangeRates[selectBox]; const value = xmrAmount * exchangeRates[selectBox];
fiatValue.value = value.toFixed(selectBox == 'BTC' || selectBox == 'LTC' || selectBox == 'ETH' || selectBox == 'XAG' || selectBox == 'XAU' ? 8 : 2); fiatValue.value = value.toFixed(['BTC', 'LTC', 'ETH', 'XAG', 'XAU'].includes(selectBox) ? 8 : 2);
} }
} }
window.copyToClipBoardXMR = copyToClipBoardXMR;
window.copyToClipBoardFiat = copyToClipBoardFiat;
window.fiatConvert = fiatConvert;
window.xmrConvert = xmrConvert;