GarGerry commited on
Commit
830d5f1
·
verified ·
1 Parent(s): 65c4c23

Update script.js

Browse files
Files changed (1) hide show
  1. script.js +64 -52
script.js CHANGED
@@ -1,74 +1,86 @@
 
1
  const amountInput = document.getElementById('amount');
2
  const fromCurrency = document.getElementById('fromCurrency');
3
  const toCurrency = document.getElementById('toCurrency');
4
- const swapButton = document.getElementById('swapButton');
5
- const convertButton = document.getElementById('convertButton');
6
  const resultDiv = document.getElementById('result');
 
 
 
 
 
7
 
8
- // Status konversi otomatis
9
- let autoConvert = false;
10
 
11
- // Tombol convert pertama kali
12
- convertButton.addEventListener('click', () => {
13
- autoConvert = true; // Aktifkan konversi otomatis
14
- convertCurrency();
15
- convertButton.style.display = 'none'; // Sembunyikan tombol
16
- });
17
-
18
- // Swap mata uang
19
- swapButton.addEventListener('click', () => {
20
- const temp = fromCurrency.value;
21
- fromCurrency.value = toCurrency.value;
22
- toCurrency.value = temp;
23
-
24
- // Reset tombol dan hasil
25
- autoConvert = false;
26
- convertButton.style.display = 'block';
27
- resultDiv.innerHTML = '';
28
- });
29
-
30
- // Input perubahan
31
- [amountInput, fromCurrency, toCurrency].forEach(element => {
32
- element.addEventListener('input', () => {
33
- if (autoConvert) {
34
- convertCurrency(); // Konversi otomatis
35
- }
36
- });
37
-
38
- element.addEventListener('change', () => {
39
- // Tampilkan tombol jika mata uang diubah
40
- autoConvert = false;
41
- convertButton.style.display = 'block';
42
- resultDiv.innerHTML = '';
43
- });
44
- });
45
-
46
- // Fungsi konversi
47
  async function convertCurrency() {
48
  const amount = amountInput.value;
49
- const from = fromCurrency.value;
50
- const to = toCurrency.value;
51
 
 
52
  if (!amount || amount <= 0) {
53
- resultDiv.innerHTML = 'Please enter a valid amount.';
54
  return;
55
  }
56
 
57
  try {
58
- const apiKey = '3ebe2ccf9eeea2aaef280201';
59
- const url = `https://v6.exchangerate-api.com/v6/${apiKey}/latest/${from}`;
 
 
60
  const response = await fetch(url);
61
  const data = await response.json();
62
 
63
- if (data.result === 'success') {
64
- const rate = data.conversion_rates[to];
65
- const convertedAmount = (amount * rate).toFixed(2);
66
- resultDiv.innerHTML = `${amount} ${from} = ${convertedAmount} ${to}`;
67
- } else {
68
  resultDiv.innerHTML = `Error: ${data['error-type']}`;
 
 
 
 
 
 
 
 
 
 
69
  }
70
  } catch (error) {
71
- resultDiv.innerHTML = 'Error fetching conversion rate.';
72
- console.error(error);
73
  }
74
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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;
22
  }
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
+ });