// Variables
const timeEl = document.getElementById('time');
const dateEl = document.getElementById('date');
const currentWeatherItemsEl = document.getElementById('Current-Weather-Items');
const timezone = document.getElementById('time-zone');
const countryEl = document.getElementById('country');
const weatherForecastEl = document.getElementById('weather-forecast');
const currentTempEl = document.getElementById('current-temp');

// Days and Months
const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];

// Set time and date
setInterval(() => {
    const time = new Date();
    const month = time.getMonth();
    const date = time.getDate();
    const day = time.getDay();
    const hour = time.getHours();
    const hoursIn12HrFormat = hour >= 13 ? hour %12: hour;
    const minutes = time.getMinutes();
    const ampm = hour >=12 ? 'PM' : 'AM';

    // format time to 12hour clock
    timeEl.innerHTML = (hoursIn12HrFormat < 10? '0' + hoursIn12HrFormat : hoursIn12HrFormat) + ':' + (minutes < 10? '0'+minutes: minutes)+ ' ' + `${ampm}`

    dateEl.innerHTML = days[day] + ', ' + date + ' ' + months[month]
}, 1000);

// Access Open Weather API and show data
getWeatherData()
function getWeatherData () {
 navigator.geolocation.getCurrentPosition((success) => {
  console.log(success);

  let {latitude, longitude} = success.coords;

  fetch(`https://api.openweathermap.org/data/2.5/onecall?lat=${latitude}&lon=${longitude}&exclude=minutely,hourly&units=metric&appid=${owKey}`).then(res => res.json()).then(data => {

  console.log(data)
  showWeatherData(data);
  })
 })
}


function showWeatherData (data) {
 let {temp, humidity, pressure, wind_speed} = data.current;

 timezone.innerHTML = data.timezone;
    countryEl.innerHTML = data.lat + 'N ' + data.lon+'E'

 currentWeatherItemsEl.innerHTML =
`
     Temperature
     ${temp}°C


     Humidity
     ${humidity}%


     Pressure
     ${pressure}


     Wind
     ${wind_speed} km/h
   `;

// get cdn js moment package

// Current and Daily forecast
let nextDaysForecast = ''
    data.daily.forEach((day, idx) => {
        if(idx == 0){
            currentTempEl.innerHTML = `



                ${window.moment(day.dt*1000).format('dddd')}
                Day: ${Math.round(day.temp.day)}°C
                Night: ${Math.round(day.temp.night)}°C

            `
        }else{
            nextDaysForecast += `

                ${window.moment(day.dt*1000).format('ddd')}

                Day: ${Math.round(day.temp.day)}°C
                Night: ${Math.round(day.temp.night)}°C

            `
        }
    })
    weatherForecastEl.innerHTML = nextDaysForecast;
}