const endPoint ="http://jailton.bootcamp.dev.netuno.org:20190/services";

getParques();
/*
document.querySelector('#selParques').addEventListener('click', e => {
  getParques();
})
*/
const  btnSub = document.querySelector('#btnSub');

btnSub.addEventListener("click", async e=> {

  const inputName = document.querySelector('#inputName');
  const inputQuant = document.querySelector('#inputQuant');
  const selectParques = document.querySelector('#selParques');

  e.preventDefault();

  const animal ={nome:inputName.value,quantidade:Number(inputQuant.value),parque:{id:Number(selectParques.value)}};
  console.log(animal)

  const config = {
    method:'POST',
    body:JSON.stringify(animal),
    headers: {
      "Content-type":"application/json",
    }
  }

  try {

    const data = await fetch(`${endPoint}/animal`,config)
      .then((res) => res.json())
      .catch((err)=>err);
    alert('Animal cadastrado com sucesso!');                
  } catch (error) {
    console.log(error);
  }
});


//get all parques and build select options
async function getParques () {
  const parques = await fetch(`${endPoint}/parque`).then((res)=>res.json()).catch((err)=>err);

  const selectParques = document.querySelector('#selParques');
  
  selectParques.innerHTML="";
  parques.forEach((parque)=>{
    const selectOption = document.createElement('option');
    selectOption.value = parque.id;
    selectOption.textContent = parque.nome;

    selectParques.appendChild(selectOption);
  })
}