main.js

const api = {
  key: "5468dff0a0fcc9319929222c75d39d6a",
  base: "https://api.openweathermap.org/data/2.5/"
}

const searchbox = document.querySelector('.seach-box');
searchbox.addEventListener('keypress', setQuery);

function setQuery(evt) {
  if (evt.keyCode == 13){
    getResults(searchbox.value);
    console.log(searchbox.value);
  }
}

function getResults(query){
  fetch(`${api.base}weather?q=${query}&units=metric&APPID=${api.key}`)
    .then (weather => {
      return weather.json();
  }).then(displayResults);
}

function displayResults(weather){
  console.log(weather);
  let city = document.querySelector('.location .city');
  city.innerText = `${weather.name}, ${weather.sys.country}`;

  let now = new Date();
  let date = document.querySelector('.location .date');
  date.innerText = dateBuilder(now);

  let temp = document.querySelector('.current .temp');
  temp.innerHTML = `${Math.round(weather.main.temp)}<span>ºC</span>`;

  // let weather_el = document.querySelector('.current .weather');
  // weather_el.innerText = weather.weather[0].main;
  
  let hilow = document.querySelector('.hi-low');
  hilow.innerText = `${Math.round(weather.main.temp_min)}ºC / ${Math.round(weather.main.temp_max)}ºC`;
  
  let viento = document.querySelector('.current .wind');
  viento.innerText = `${weather.wind.speed} m/s`;

  let nubes = document.querySelector('.current .clouds');
  nubes.innerText = `${weather.clouds.all} %`;
}

function dateBuilder (d){
  let months = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Semptiembre", "Octubre", "Noviembre", "Diciembre"];
  let days = ["Domingo", "Lunes", "Martes", "Miercoles", "Jueves", "Viernes", "Sábado"];

  let day = days[d.getDay()];
  let date = d.getDate();
  let month = months[d.getMonth()];
  let year = d.getFullYear()

  return `${day} ${date} ${month} ${year}`;

}