Update script.js

script.js

@@ -1,61 +1,77 @@
-// Fungsi untuk menangani submit form
-document.getElementById('currencyForm').addEventListener('submit', async function (event) {
-  event.preventDefault();
+const amountInput = document.getElementById('amount');
+const fromCurrency = document.getElementById('fromCurrency');
+const toCurrency = document.getElementById('toCurrency');
+const swapButton = document.getElementById('swapButton');
+const convertButton = document.getElementById('convertButton');
+const resultDiv = document.getElementById('result');
 
-  const amount = document.getElementById('amount').value;
-  const fromCurrency = document.getElementById('fromCurrency').value;
-  const toCurrency = document.getElementById('toCurrency').value;
-  const resultDiv = document.getElementById('result');
+// Status konversi otomatis
+let autoConvert = false;
 
-  // Validasi input amount
-  if (!amount || amount <= 0) {
-    resultDiv.innerHTML = "Please enter a valid amount!";
-    return;
-  }
-
-  await convertCurrency(amount, fromCurrency, toCurrency, resultDiv);
+// Tombol convert pertama kali
+convertButton.addEventListener('click', () => {
+  autoConvert = true; // Aktifkan konversi otomatis
+  convertCurrency(); // Lakukan konversi pertama kali
+  convertButton.style.display = 'none'; // Sembunyikan tombol
 });
 
-// Fungsi untuk menangani tombol swap
-document.getElementById('swapButton').addEventListener('click', async function () {
-  const fromCurrency = document.getElementById('fromCurrency');
-  const toCurrency = document.getElementById('toCurrency');
-  const resultDiv = document.getElementById('result');
-
-  // Tukar mata uang
-  const tempCurrency = fromCurrency.value;
+// Swap mata uang
+swapButton.addEventListener('click', async () => {
+  const temp = fromCurrency.value;
   fromCurrency.value = toCurrency.value;
-  toCurrency.value = tempCurrency;
-
-  // Ambil nilai amount
-  const amount = document.getElementById('amount').value;
+  toCurrency.value = temp;
 
-  if (amount && amount > 0) {
-    await convertCurrency(amount, fromCurrency.value, toCurrency.value, resultDiv);
+  // Jika autoConvert aktif, langsung lakukan konversi
+  if (autoConvert) {
+    convertCurrency();
   } else {
-    resultDiv.innerHTML = "";
+    // Jika belum autoConvert, kosongkan hasil
+    resultDiv.innerHTML = '';
   }
 });
 
-// Fungsi konversi mata uang
-async function convertCurrency(amount, fromCurrency, toCurrency, resultDiv) {
+// Pantau perubahan input atau dropdown
+[amountInput, fromCurrency, toCurrency].forEach((element) => {
+  element.addEventListener('input', () => {
+    if (autoConvert) {
+      convertCurrency(); // Konversi otomatis saat autoConvert aktif
+    }
+  });
+
+  element.addEventListener('change', () => {
+    // Reset autoConvert, tampilkan tombol Convert kembali
+    autoConvert = false;
+    convertButton.style.display = 'block';
+    resultDiv.innerHTML = '';
+  });
+});
+
+// Fungsi konversi
+async function convertCurrency() {
+  const amount = amountInput.value;
+  const from = fromCurrency.value;
+  const to = toCurrency.value;
+
+  if (!amount || amount <= 0) {
+    resultDiv.innerHTML = 'Please enter a valid amount.';
+    return;
+  }
+
   try {
     const apiKey = '3ebe2ccf9eeea2aaef280201';
-    const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${fromCurrency}`;
-
-    // Fetch data dari API
+    const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${from}`;
     const response = await fetch(url);
     const data = await response.json();
 
     if (data.result === 'success') {
-      const rate = data.conversion_rates[toCurrency];
+      const rate = data.conversion_rates[to];
       const convertedAmount = (amount * rate).toFixed(2);
-      resultDiv.innerHTML = `${amount} ${fromCurrency} = ${convertedAmount} ${toCurrency}`;
+      resultDiv.innerHTML = `${amount} ${from} = ${convertedAmount} ${to}`;
     } else {
       resultDiv.innerHTML = `Error: ${data['error-type']}`;
     }
   } catch (error) {
-    resultDiv.innerHTML = "Error fetching conversion rate.";
-    console.error("Error:", error);
+    resultDiv.innerHTML = 'Error fetching conversion rate.';
+    console.error(error);
   }
 }