From 027395a7895b788d6eef83ba5e661c2fea0d4a45 Mon Sep 17 00:00:00 2001 From: larryursini <39272661+larryursini@users.noreply.github.com> Date: Sat, 8 Apr 2023 17:24:30 -0400 Subject: [PATCH 1/3] working no stlye --- index.html | 57 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ script.js | 56 +++++++++++++++++++++++++++++++++++++++++++++++++++++ style.css | 0 3 files changed, 113 insertions(+) create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/index.html b/index.html new file mode 100644 index 0000000..c1d6093 --- /dev/null +++ b/index.html @@ -0,0 +1,57 @@ + + Ballin'Oates Weather + + + + + +

Ballin' Oates Knowz Weather...API

+
+

I can't go for that... Umbrella

+
+

+
+
+

Will I need an umbrella in

+ + +
+
+

+

+
+ +
+

+

+
+
+

+
+ +

The 7 day Forecast:

+
+
+
+
+
+
+
+
+
+ +
+

+
+
+
+
+
+
+
+

+
+ + +
+ \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..063cfc5 --- /dev/null +++ b/script.js @@ -0,0 +1,56 @@ +const apiKey = 'cf208495165446d390c161013230804' + +let button = document.querySelector("#searchButton") +let forImgArray = document.querySelectorAll('.foreimg') +let forDayArray = document.querySelectorAll('.foreday') +const d = new Date(); +let day = d.getDay() + +console.log(forImgArray) + +button.addEventListener('click', async () => { + + let textInput = document.querySelector("#inputBar").value + let cityName = document.querySelector("#cityName") + let todImage = document.querySelector("#todImage") + const imageDiv = document.querySelector("#currentImg") + const umbrellaAnswer = document.querySelector("#umbrellaAnswer") + const currentFore = document.querySelector("#currentFore") + const looksLike = document.querySelector("#looksLike") + + let response = await axios.get(`http://api.weatherapi.com/v1/forecast.json?key=cf208495165446d390c161013230804&q=${textInput}&days=7&aqi=no&alerts=no`) + let citName = response.data.location.name + let todImg = response.data.current.condition.icon + + // let umbAnswer + let grabUmbrellaCode = response.data.current.condition.code + let curFore = response.data.current.condition.text + + console.log(response) + + if (grabUmbrellaCode > 1029){ + umbrellaAnswer.innerText = "You should probably grab an umbrella if you are currently in" + } else { + umbrellaAnswer.innerText = "Ballin Oates says that you shouldn't need an umbrella if you in" + } + + + + looksLike.innerText = "The forecast looks like:" + //console.log(forecastArray) + cityName.innerText = citName + imageDiv.innerHTML = `` + currentFore.innerText = curFore + + for (let i = 0; i < 7; i++){ + let forecastArray = response.data.forecast.forecastday[i].day.condition.icon + forImgArray[i].innerHTML = `` + } + + for (let i = 0; i < 7; i++){ + const dayArray = ['sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat', 'sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat'] + forDayArray[i].innerText = dayArray[day] + day ++ + } + +}) \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..e69de29 From c668f0a91c279fbddafbb8c6d88ed386fea23465 Mon Sep 17 00:00:00 2001 From: larryursini <39272661+larryursini@users.noreply.github.com> Date: Mon, 10 Apr 2023 16:37:36 -0400 Subject: [PATCH 2/3] updated 7day forcast text --- index.html | 2 +- script.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index c1d6093..00407e5 100644 --- a/index.html +++ b/index.html @@ -29,7 +29,7 @@

-

The 7 day Forecast:

+

diff --git a/script.js b/script.js index 063cfc5..ee92357 100644 --- a/script.js +++ b/script.js @@ -17,6 +17,7 @@ button.addEventListener('click', async () => { const umbrellaAnswer = document.querySelector("#umbrellaAnswer") const currentFore = document.querySelector("#currentFore") const looksLike = document.querySelector("#looksLike") + const sevenDay = document.querySelector("#sevenDay") let response = await axios.get(`http://api.weatherapi.com/v1/forecast.json?key=cf208495165446d390c161013230804&q=${textInput}&days=7&aqi=no&alerts=no`) let citName = response.data.location.name @@ -41,6 +42,7 @@ button.addEventListener('click', async () => { cityName.innerText = citName imageDiv.innerHTML = `` currentFore.innerText = curFore + sevenDay.innerText = 'The 7 day Forecast:' for (let i = 0; i < 7; i++){ let forecastArray = response.data.forecast.forecastday[i].day.condition.icon From 8af5c88e7fa596d5576cd0f13a183fae0a568a48 Mon Sep 17 00:00:00 2001 From: larryursini <39272661+larryursini@users.noreply.github.com> Date: Mon, 10 Apr 2023 17:56:13 -0400 Subject: [PATCH 3/3] day array bug fix --- script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/script.js b/script.js index ee92357..1d6687c 100644 --- a/script.js +++ b/script.js @@ -50,7 +50,7 @@ button.addEventListener('click', async () => { } for (let i = 0; i < 7; i++){ - const dayArray = ['sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat', 'sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat'] + const dayArray = ['sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat', 'sun', 'mon', 'tues', 'wed', 'thurs', 'fri', 'sat', 'sun'] forDayArray[i].innerText = dayArray[day] day ++ }