CurrencyConverter5 / script.js
GarGerry's picture
Update script.js
37ca035 verified
raw
history blame
4.17 kB
// Fungsi untuk melakukan konversi mata uang
async function convertCurrency() {
const amount = document.getElementById('amount').value;
const fromCurrency = document.getElementById('from-currency').value;
const toCurrency = document.getElementById('to-currency').value;
const result = document.getElementById('result');
const convertBtn = document.getElementById('convert-btn');
// Validasi input
if (amount && fromCurrency && toCurrency) {
try {
// Mendapatkan data kurs mata uang
const response = await fetch(`https://api.exchangerate-api.com/v4/latest/${fromCurrency}`);
const data = await response.json();
const rate = data.rates[toCurrency];
const convertedAmount = (amount * rate).toFixed(2);
// Menampilkan hasil konversi
result.innerHTML = `${amount} ${fromCurrency} = ${convertedAmount} ${toCurrency}`;
// Sembunyikan tombol Convert setelah konversi otomatis
convertBtn.style.display = 'none';
} catch (error) {
result.innerText = "Error fetching exchange rates!";
}
}
}
// Fungsi untuk menukar mata uang From dan To
function swapCurrencies() {
const fromCurrency = document.getElementById('from-currency');
const toCurrency = document.getElementById('to-currency');
// Tukar nilai mata uang
const temp = fromCurrency.value;
fromCurrency.value = toCurrency.value;
toCurrency.value = temp;
// Lakukan konversi otomatis setelah swap
convertCurrency();
}
// Event listener untuk input amount agar otomatis konversi
document.getElementById('amount').addEventListener('input', convertCurrency);
// Event listener untuk perubahan mata uang (From dan To) agar tombol Convert muncul kembali
document.getElementById('from-currency').addEventListener('change', () => {
document.getElementById('convert-btn').style.display = 'block';
document.getElementById('result').innerHTML = '';
});
document.getElementById('to-currency').addEventListener('change', () => {
document.getElementById('convert-btn').style.display = 'block';
document.getElementById('result').innerHTML = '';
});
// Fungsi untuk menangani scroll dan mengganti warna latar belakang
window.onscroll = function() {
const navbar = document.querySelector('.navbar');
const howToUse = document.querySelector('.how-to-use');
const steps = document.querySelector('.steps');
const footer = document.querySelector('footer');
if (window.scrollY > 200) {
navbar.style.backgroundColor = '#004d00'; // Darker Green
howToUse.style.backgroundColor = '#004d00'; // Darker Green
steps.forEach(step => {
step.style.backgroundColor = '#004d00'; // Darker Green for steps
});
footer.style.backgroundColor = '#666666'; // Darker Gray
} else {
navbar.style.backgroundColor = '#006400'; // Original Green
howToUse.style.backgroundColor = '#006400'; // Original Green
steps.forEach(step => {
step.style.backgroundColor = '#006400'; // Original Green for steps
});
footer.style.backgroundColor = '#808080'; // Original Gray
}
};
// Fungsi untuk memuat pilihan mata uang
function loadCurrencies() {
const currencies = [
'BND', 'KHR', 'IDR', 'LAK', 'MYR', 'MMK', 'PHP', 'SGD', 'THB', 'VND',
'EUR', 'GBP', 'CHF', 'RUB', 'TRY', 'USD', 'CAD', 'BRL', 'ARS', 'ZAR',
'JPY', 'CNY', 'KRW', 'KPW', 'HKD'
];
const fromCurrency = document.getElementById('from-currency');
const toCurrency = document.getElementById('to-currency');
currencies.forEach(currency => {
const optionFrom = document.createElement('option');
optionFrom.value = currency;
optionFrom.textContent = `${currency}`;
fromCurrency.appendChild(optionFrom);
const optionTo = document.createElement('option');
optionTo.value = currency;
optionTo.textContent = `${currency}`;
toCurrency.appendChild(optionTo);
});
}
// Memuat mata uang ketika halaman dimuat
window.onload = loadCurrencies;