const inputs = {
  elemento_numeroCarreiras: document.querySelector('#numeroCarreiras'),
  elemento_numeroArvores: document.querySelector('#numeroArvores'),
  elemento_diametroBase: document.querySelector('#diametroBase'),
  elemento_diametroCopa: document.querySelector('#diametroCopa'),
  elemento_compMadeira: document.querySelector('#compMadeira'),
};

/** Input Validation */

const memory = {};

for (const key of Object.keys(inputs)) {
  const input = inputs[key];

  memory[input.id] = Number(input.value);
}

for (const key of Object.keys(inputs)) {
  const input = inputs[key];

  let isShiftBeingPressed = false;

  input.onkeydown = event => {
    const keyCode = event.keyCode;

    let allow = false;

    // Allow numbers
    if (keyCode >= 48 && keyCode <= 57) allow = true;
    // Allow backspace
    if (keyCode === 8) allow = true;
    // Allow ,
    if (keyCode === 188) allow = true;
    // Allow .
    if (keyCode === 190) allow = true;
    // Allow -
    // if (keyCode === 189) allow = true;

    // Allow keyboard arrows (navigation)
    if (keyCode >= 37 && keyCode <= 40) allow = true;

    // Allow tab
    if (keyCode === 9) allow = true;

    if (keyCode === 16) isShiftBeingPressed = true;

    if (!allow) event.preventDefault();
  };

  input.onkeyup = event => {
    const keyCode = event.keyCode;

    if (keyCode === 16) isShiftBeingPressed = false;
  };

  const regexMoreThanOneDot = /[.].*[.]/; // Regex que verifica se existem mais que um .
  const regexMoreThanOneMinus = /[-].*[-]/; // Regex que verifica se existem mais que um -
  // const regexContainMinus = /[-]{1,}/; // Regex que verifica se existem -
  // const regexBeginsWithMinus = /^-/; // Regex que verifica se começa com -

  input.oninput = event => {
    event.target.value = event.target.value.replace(/,/g, '.'); // Troca , por .

    let allow = true;

    if (regexMoreThanOneDot.test(event.target.value)) allow = false;
    if (regexMoreThanOneMinus.test(event.target.value)) allow = false;
    // if (
    //   regexContainMinus.test(event.target.value) &&
    //   !regexBeginsWithMinus.test(event.target.value)
    // )
    //   allow = false;

    if (isShiftBeingPressed) allow = false;

    if (allow) memory[input.id] = event.target.value;
    else event.target.value = memory[input.id];
  };
}

/** Input methods */

function limpar() {
  for (const key of Object.keys(inputs)) {
    const input = inputs[key];

    input.value = 0;
    memory[input.id] = 0;
  }

  // Reset result
  document.querySelector('#result').innerHTML = '----';
}

function calcular() {
  const numeroCarreiras = Number(inputs.elemento_numeroCarreiras.value);
  const numeroArvores = Number(inputs.elemento_numeroArvores.value);
  const diametroBase = Number(inputs.elemento_diametroBase.value);
  const diametroCopa = Number(inputs.elemento_diametroCopa.value);
  const compMadeira = Number(inputs.elemento_compMadeira.value);

  const mediaDiametro = (diametroBase + diametroCopa) / 2;
  const raio = mediaDiametro / 2;
  const cxA = numeroCarreiras * numeroArvores;

  const calculoInicial = Math.PI * Math.pow(raio / 100, 2) * compMadeira;
  const calculoFinal = calculoInicial * cxA;

  // Shows result on page
  document.querySelector('#result').innerHTML = `${calculoFinal.toFixed(1)} m²`;
}