From 8231849826cc692a50d481e580c48d02c834f224 Mon Sep 17 00:00:00 2001 From: nomi7677 Date: Sun, 31 Jan 2021 22:23:38 -0500 Subject: [PATCH 1/4] weather app html --- weat.html | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 weat.html diff --git a/weat.html b/weat.html new file mode 100644 index 0000000..fd0274f --- /dev/null +++ b/weat.html @@ -0,0 +1,17 @@ + + + + + + Weather update + + + +

+

+

+ + + + + \ No newline at end of file From e770a3268d73635e0ef35fdf23aec068af21e8b1 Mon Sep 17 00:00:00 2001 From: nomi7677 Date: Sun, 31 Jan 2021 22:24:44 -0500 Subject: [PATCH 2/4] Weather app js code --- weather.js | 44 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) create mode 100644 weather.js diff --git a/weather.js b/weather.js new file mode 100644 index 0000000..991a934 --- /dev/null +++ b/weather.js @@ -0,0 +1,44 @@ +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 3b0c7114e1ed03f1ad2355026baa29acf8fed1e4 Mon Sep 17 00:00:00 2001 From: nomi7677 Date: Fri, 5 Feb 2021 21:58:07 -0500 Subject: [PATCH 3/4] Zippo and 7timer API weather update --- weat.html | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/weat.html b/weat.html index fd0274f..696e5b6 100644 --- a/weat.html +++ b/weat.html @@ -4,14 +4,18 @@ Weather update - + -

-

-

+

Welcome to the Weather App!

+ +
+

+

+ +
- + \ No newline at end of file From 3cbdb57eae6d55468d8eb3f4f601aef4bc9b5375 Mon Sep 17 00:00:00 2001 From: nomi7677 Date: Fri, 5 Feb 2021 21:59:18 -0500 Subject: [PATCH 4/4] 7timer and Zippo weather updates --- weath.js | 49 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 weath.js diff --git a/weath.js b/weath.js new file mode 100644 index 0000000..0f38203 --- /dev/null +++ b/weath.js @@ -0,0 +1,49 @@ +// crrating button on html and linking to a function getZipCode +//using AJAX 4 steps for lab +// conerted temperature to F + +let lon = 0.0; +let lat = 0.0; +let temp = document.getElementById('weather'); +let loc = document.getElementById('zipCode'); + +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; + + } + } + 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(); + }