GarGerry commited on
Commit
2ef97cf
·
verified ·
1 Parent(s): ace5181

Update script.js

Browse files
Files changed (1) hide show
  1. script.js +48 -56
script.js CHANGED
@@ -1,21 +1,13 @@
1
- // Ambil elemen
2
- const amountInput = document.getElementById('amount');
3
- const fromCurrency = document.getElementById('fromCurrency');
4
- const toCurrency = document.getElementById('toCurrency');
5
- const resultDiv = document.getElementById('result');
6
- const convertButton = document.createElement('button');
7
- convertButton.textContent = 'Convert';
8
- convertButton.type = 'button';
9
- convertButton.id = 'convertButton';
10
- document.getElementById('currencyForm').appendChild(convertButton);
11
 
12
- // Tombol tampil secara default
13
- let isInitialConversion = true;
 
 
 
14
 
15
- async function convertCurrency() {
16
- const amount = amountInput.value;
17
-
18
- // Validasi input jumlah
19
  if (!amount || amount <= 0) {
20
  resultDiv.innerHTML = "Please enter a valid amount!";
21
  return;
@@ -23,64 +15,64 @@ async function convertCurrency() {
23
 
24
  try {
25
  const apiKey = '3ebe2ccf9eeea2aaef280201'; // API Key
26
- const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${fromCurrency.value}`;
27
 
28
- // Ambil data dari API
29
  const response = await fetch(url);
30
  const data = await response.json();
31
 
32
- // Tangani error API
33
  if (data.result === 'error') {
34
  resultDiv.innerHTML = `Error: ${data['error-type']}`;
35
  } else {
36
- const rate = data.conversion_rates[toCurrency.value];
 
37
  const convertedAmount = (amount * rate).toFixed(2);
38
- resultDiv.innerHTML = `${amount} ${fromCurrency.value} = ${convertedAmount} ${toCurrency.value}`;
39
-
40
- // Sembunyikan tombol setelah konversi pertama
41
- if (isInitialConversion) {
42
- convertButton.style.display = 'none';
43
- isInitialConversion = false;
44
- }
45
  }
46
  } catch (error) {
47
  resultDiv.innerHTML = "Error fetching conversion rate.";
48
- console.error("Error:", error);
49
  }
50
- }
51
 
52
- // Fungsi Swap
53
- document.getElementById('swapButton').addEventListener('click', function () {
 
 
 
 
 
54
  const tempCurrency = fromCurrency.value;
55
  fromCurrency.value = toCurrency.value;
56
  toCurrency.value = tempCurrency;
57
 
58
- if (amountInput.value && amountInput.value > 0) {
59
- convertCurrency(); // Konversi ulang setelah swap
60
- }
61
- });
62
 
63
- // Event untuk tombol Convert (klik tombol manual)
64
- convertButton.addEventListener('click', function () {
65
- convertCurrency();
66
- });
 
67
 
68
- // Event otomatis konversi setelah jumlah diisi
69
- amountInput.addEventListener('input', function () {
70
- if (!isInitialConversion) {
71
- convertCurrency(); // Konversi otomatis
72
- }
73
- });
74
-
75
- // Event tampilkan tombol jika mata uang diubah
76
- fromCurrency.addEventListener('change', function () {
77
- convertButton.style.display = 'block'; // Tampilkan tombol
78
- isInitialConversion = true; // Reset status awal
79
- resultDiv.innerHTML = ""; // Reset hasil
80
- });
81
 
82
- toCurrency.addEventListener('change', function () {
83
- convertButton.style.display = 'block'; // Tampilkan tombol
84
- isInitialConversion = true; // Reset status awal
85
- resultDiv.innerHTML = ""; // Reset hasil
 
 
 
 
 
 
 
 
 
 
 
86
  });
 
1
+ document.getElementById('currencyForm').addEventListener('submit', async function (event) {
2
+ event.preventDefault();
 
 
 
 
 
 
 
 
3
 
4
+ // Ambil nilai input dari user
5
+ const amount = document.getElementById('amount').value;
6
+ const fromCurrency = document.getElementById('fromCurrency').value;
7
+ const toCurrency = document.getElementById('toCurrency').value;
8
+ const resultDiv = document.getElementById('result');
9
 
10
+ // Validasi jumlah yang dimasukkan
 
 
 
11
  if (!amount || amount <= 0) {
12
  resultDiv.innerHTML = "Please enter a valid amount!";
13
  return;
 
15
 
16
  try {
17
  const apiKey = '3ebe2ccf9eeea2aaef280201'; // API Key
18
+ const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${fromCurrency}`;
19
 
20
+ // Mengambil data dari API
21
  const response = await fetch(url);
22
  const data = await response.json();
23
 
24
+ // Menangani respon API yang error
25
  if (data.result === 'error') {
26
  resultDiv.innerHTML = `Error: ${data['error-type']}`;
27
  } else {
28
+ // Menyusun nilai konversi dan menampilkannya
29
+ const rate = data.conversion_rates[toCurrency];
30
  const convertedAmount = (amount * rate).toFixed(2);
31
+ resultDiv.innerHTML = `${amount} ${fromCurrency} = ${convertedAmount} ${toCurrency}`;
 
 
 
 
 
 
32
  }
33
  } catch (error) {
34
  resultDiv.innerHTML = "Error fetching conversion rate.";
35
+ console.error("Error:", error); // Menampilkan error di konsol
36
  }
37
+ });
38
 
39
+ // Logika untuk tombol Swap
40
+ document.getElementById('swapButton').addEventListener('click', async function () {
41
+ const fromCurrency = document.getElementById('fromCurrency');
42
+ const toCurrency = document.getElementById('toCurrency');
43
+ const resultDiv = document.getElementById('result');
44
+
45
+ // Tukar nilai antara "From" dan "To"
46
  const tempCurrency = fromCurrency.value;
47
  fromCurrency.value = toCurrency.value;
48
  toCurrency.value = tempCurrency;
49
 
50
+ // Ambil nilai input amount
51
+ const amount = document.getElementById('amount').value;
 
 
52
 
53
+ // Jika ada jumlah yang dimasukkan, langsung lakukan konversi ulang
54
+ if (amount && amount > 0) {
55
+ try {
56
+ const apiKey = '3ebe2ccf9eeea2aaef280201'; // API Key
57
+ const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${fromCurrency.value}`;
58
 
59
+ // Mengambil data dari API
60
+ const response = await fetch(url);
61
+ const data = await response.json();
 
 
 
 
 
 
 
 
 
 
62
 
63
+ if (data.result === 'error') {
64
+ resultDiv.innerHTML = `Error: ${data['error-type']}`;
65
+ } else {
66
+ const rate = data.conversion_rates[toCurrency.value];
67
+ const convertedAmount = (amount * rate).toFixed(2);
68
+ resultDiv.innerHTML = `${amount} ${fromCurrency.value} = ${convertedAmount} ${toCurrency.value}`;
69
+ }
70
+ } catch (error) {
71
+ resultDiv.innerHTML = "Error fetching conversion rate.";
72
+ console.error("Error:", error);
73
+ }
74
+ } else {
75
+ // Jika tidak ada amount, hapus hasil konversi
76
+ resultDiv.innerHTML = "";
77
+ }
78
  });