From 3c6313cfab56b2aa0946da3bec53e9a357244929 Mon Sep 17 00:00:00 2001 From: hina latif Date: Sun, 31 Jan 2021 22:20:24 -0500 Subject: [PATCH 1/4] index.html --- index.html | 23 +++++++++++++++-------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 3233671..e24997c 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,18 @@ - - - - Document - - -

Hola Mundo

- + + + + + Weather App + + + +

+

+

+ + + + \ No newline at end of file From d5319569f5dbfaca8b3690a626bb89c8e064f7a7 Mon Sep 17 00:00:00 2001 From: hina latif Date: Sun, 31 Jan 2021 22:22:26 -0500 Subject: [PATCH 2/4] part 1 and 2 --- weather.js | 47 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 47 insertions(+) create mode 100644 weather.js diff --git a/weather.js b/weather.js new file mode 100644 index 0000000..2a4d1ae --- /dev/null +++ b/weather.js @@ -0,0 +1,47 @@ +var person = prompt("Please enter your zip code"); + +function getWeather() { + let temperature = document.getElementById("temperature"); + let description = document.getElementById("description"); + let location = document.getElementById("location"); + + let api = "https://api.openweathermap.org/data/2.5/weather"; + let apiKey = "f146799a557e8ab658304c1b30cc3cfd"; + + location.innerHTML = "Locating..."; + + navigator.geolocation.getCurrentPosition(success, error); + + function success(position) { + latitude = position.coords.latitude; + longitude = position.coords.longitude; + + let url = + api + + "?lat=" + + latitude + + "&lon=" + + longitude + + "&appid=" + + apiKey + + "&units=imperial"; + + fetch(url) + .then(response => response.json()) + .then(data => { + console.log(data); + let temp = data.main.temp; + temperature.innerHTML = temp + "° F"; + location.innerHTML = + data.name; + description.innerHTML = data.weather[0].main; + }); + } + + function error() { + location.innerHTML = "Unable to retrieve your location"; + } + } + + getWeather(); + \ No newline at end of file From 0a37d928a5b80bae66170078a979d224ba9553d6 Mon Sep 17 00:00:00 2001 From: hina latif Date: Fri, 5 Feb 2021 21:48:13 -0500 Subject: [PATCH 3/4] completed part 1 and 2 --- index.html | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/index.html b/index.html index e24997c..c4c96fa 100644 --- a/index.html +++ b/index.html @@ -1,18 +1,18 @@ - - - - + + + + Weather App - - - -

-

-

- - - - + + +

Welcome to the Weather App!

+ +
+

+

+ +
+ \ No newline at end of file From badc0e1e2535e4790807f4aeab684e0e7fdef302 Mon Sep 17 00:00:00 2001 From: hina latif Date: Fri, 5 Feb 2021 21:49:59 -0500 Subject: [PATCH 4/4] part 1 and 2 completed --- weather.js | 92 ++++++++++++++++++++++++++++-------------------------- 1 file changed, 48 insertions(+), 44 deletions(-) diff --git a/weather.js b/weather.js index 2a4d1ae..6be0d89 100644 --- a/weather.js +++ b/weather.js @@ -1,47 +1,51 @@ -var person = prompt("Please enter your zip code"); +let lon = 0.0; +let lat = 0.0; +let temp = document.getElementById('weather'); +let loc = document.getElementById('zipCode'); -function getWeather() { - let temperature = document.getElementById("temperature"); - let description = document.getElementById("description"); - let location = document.getElementById("location"); - - let api = "https://api.openweathermap.org/data/2.5/weather"; - let apiKey = "f146799a557e8ab658304c1b30cc3cfd"; - - location.innerHTML = "Locating..."; - - navigator.geolocation.getCurrentPosition(success, error); - - function success(position) { - latitude = position.coords.latitude; - longitude = position.coords.longitude; - - let url = - api + - "?lat=" + - latitude + - "&lon=" + - longitude + - "&appid=" + - apiKey + - "&units=imperial"; - - fetch(url) - .then(response => response.json()) - .then(data => { - console.log(data); - let temp = data.main.temp; - temperature.innerHTML = temp + "° F"; - location.innerHTML = - data.name; - description.innerHTML = data.weather[0].main; - }); +function getZipCode() { + const zipCode = prompt("Enter zip code to get the weather updates of your location"); + let xhr = new XMLHttpRequest(); + xhr.onreadystatechange = function() { + if (xhr.readyState === 4 && xhr.status === 200) { + let locationResponse = JSON.parse(xhr.responseText); + lon = locationResponse.places[0].longitude; + lat = locationResponse.places[0].latitude; + const city = locationResponse.places[0]["place name"]; + const state = locationResponse.places[0]["state abbreviation"]; + // console.log(locationResponse); + // console.log(lon); + // console.log(lat); + getWeather(lon, lat); + + loc.innerHTML = city + ", " + state; + + } } - - function error() { - location.innerHTML = "Unable to retrieve your location"; + xhr.open('GET', `http://api.zippopotam.us/US/${zipCode}`); + xhr.send(); +} + +let xhr2 = new XMLHttpRequest(); + xhr2.onreadystatechange = function() { + if (xhr2.readyState === 4 && xhr2.status === 200) { + let weatherResponse = JSON.parse(xhr2.responseText); + + min = weatherResponse['dataseries'][0]['temp2m'].min * 9 / 5 + 32; + max = weatherResponse['dataseries'][0]['temp2m'].max * 9 / 5 + 32; + + console.log(weatherResponse); + + temp.innerHTML = Math.floor(max) + `°F`.sup(); + + + } + } + + function getWeather(lon, lat) { + xhr2.open('GET', `http://www.7timer.info/bin/api.pl?product=civillight&lon=${lon}&lat=${lat}&output=json`); + xhr2.send(); } - } - - getWeather(); - \ No newline at end of file + + +