async function fetchCurrency() {
  try {
    const response = await fetch(
      "https://api.coingecko.com/api/v3/exchange_rates"
    );
    const currency = await response.json();
    return currency.rates;
  } catch (error) {
    console.error(error);
  }
}

async function renderCurrency() {
  const currencies = await fetchCurrency();
  const curArray = [];
  for (let key in currencies) {
    curArray.push(key);
  }
  let firstSelect = document.querySelector("#firstSelect");
  for (let i = 0; i < curArray.length; i++) {
    let option = document.createElement("option");
    option.setAttribute("selected", curArray[0]);
    option.setAttribute("value", curArray[i]);
    option.innerHTML = currencies[curArray[i]]["name"];
    firstSelect.appendChild(option);
  }
  return currencies;
}

renderCurrency();

async function convert() {
  const objCur = await renderCurrency();
  const curArray = [];
  for (let key in objCur) {
    curArray.push(key);
  }
  let currency1 = document.querySelector("#firstCurrency");
  let currency2 = document.querySelector("#secondCurrency");
  let value1 = document.querySelector("#firstInput");
  let value2 = document.querySelector("#secondInput");
  if (!currency1.value) {
    currency1.value = "btc";
  }
  if (!currency2.value) {
    currency2.value = "usd";
  }
  if (value1.value === "" || +value1.value <= 0) {
    alert(
      "Не введено число / Введено неккоректное число\nПоставлено число по умолчанию - 1"
    );
    value1.value = 1;
  }
  if (currency1.value === currency2.value) {
    value2.value = value1.value;
  }
  if (currency2.value === "btc") {
    value2.value = objCur[currency1.value]["value"];
  }
  if (currency1.value !== currency2.value) {
    value2.value =
      (value1.value ** 2 * objCur[currency2.value]["value"]) /
      (value1.value / (1 / objCur[currency1.value]["value"]));
  }
  currency1.disabled = true;
  currency2.disabled = true;
  value1.disabled = true;
  let divButton = document.querySelector(".buttonBox");
  divButton.firstChild.remove();
  let reloadButton = document.createElement("button");
  reloadButton.className = "btn btn-outline-secondary btn-lg";
  reloadButton.innerText = "Try again";
  divButton.appendChild(reloadButton);
  reloadButton.onclick = function () {
    window.location.reload();
  };
}