From 546965a022616569ff0da46edbfa8d390080eb5c Mon Sep 17 00:00:00 2001 From: "P. Warren Groves Jr." Date: Sat, 23 Aug 2025 14:58:55 -0500 Subject: [PATCH 1/8] init commit --- index.html | 0 main.js | 0 style.css | 0 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 index.html create mode 100644 main.js create mode 100644 style.css diff --git a/index.html b/index.html new file mode 100644 index 00000000..e69de29b diff --git a/main.js b/main.js new file mode 100644 index 00000000..e69de29b diff --git a/style.css b/style.css new file mode 100644 index 00000000..e69de29b From 5fcb2b93595cc147c2aa0246188707e7674ac8cb Mon Sep 17 00:00:00 2001 From: "P. Warren Groves Jr." Date: Mon, 25 Aug 2025 23:37:24 -0500 Subject: [PATCH 2/8] header and search bar done, working on fetching city data --- index.html | 36 ++++++++++++++++++++++++++++++++++++ main.js | 3 +++ 2 files changed, 39 insertions(+) diff --git a/index.html b/index.html index e69de29b..1618295b 100644 --- a/index.html +++ b/index.html @@ -0,0 +1,36 @@ + + + + + + Bootstrap demo + + + +
+
Weather Project
+
+
+ +
+
+ +
+
+
+ + + diff --git a/main.js b/main.js index e69de29b..33a9a960 100644 --- a/main.js +++ b/main.js @@ -0,0 +1,3 @@ +const getCity = function(city) { + const url = `http://api.openweathermap.org/geo/1.0/direct?q=${city}&limit=5&appid=ad7a6c47620e290c667cee3d6af14631` +}; \ No newline at end of file From 76adb58e7501c8aaf05a1825eca1d48b9f812410 Mon Sep 17 00:00:00 2001 From: "P. Warren Groves Jr." Date: Tue, 26 Aug 2025 23:20:35 -0500 Subject: [PATCH 3/8] configuring city search bar --- index.html | 13 +++++++---- main.js | 66 +++++++++++++++++++++++++++++++++++++++++++++++++++--- 2 files changed, 72 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 1618295b..a717908a 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - Bootstrap demo + Weather Project
Weather Project
-
+
- +
@@ -32,5 +36,6 @@ integrity="sha384-ndDqU0Gzau9qJ1lfW4pNLlhNTkCfHzAVBReH9diLvGRem5+R9g2FzA8ZGN954O5Q" crossorigin="anonymous" > + diff --git a/main.js b/main.js index 33a9a960..ac8229e9 100644 --- a/main.js +++ b/main.js @@ -1,3 +1,63 @@ -const getCity = function(city) { - const url = `http://api.openweathermap.org/geo/1.0/direct?q=${city}&limit=5&appid=ad7a6c47620e290c667cee3d6af14631` -}; \ No newline at end of file +var cities = []; + +const renderCities = () => { +document.querySelector('.cities').replaceChildren(); + + for (let i = 0; i < cities.length; i++) { + const book = cities[i]; + + const template = ` +
+

${ city.title }

+
Author: ${ book.author }
+
Pages: ${ book.pageCount }
+
ISBN: ${ book.isbn }
+ +
`; + + document.querySelector('.cities').insertAdjacentHTML('beforeend', template); + + } + +}; + +const fetchCities = function(city) { + const url = 'http://api.openweathermap.org/geo/1.0/direct?q=' + city + '&limit=5&appid=ad7a6c47620e290c667cee3d6af14631' + + fetch(url, { + method: 'GET', + datatype: 'json', + }) + .then(data => data.json()) + .then(data => console.log(data)) +}; + +const addCities = (data) => { + cities = []; + + for (let i = 0; i < data.items.length; i++) { + const cityData = data.items[i]; + + const city = { + title: cityData.volumeInfo.title || null, + author: cityData.volumeInfo.authors ? cityData.volumeInfo.authors[0] : null, + imageURL: cityData.volumeInfo.imageLinks ? cityData.volumeInfo.imageLinks.thumbnail : null, + pageCount: cityData.volumeInfo.pageCount || null, + isbn: cityData.volumeInfo.industryIdentifiers ? + cityData.volumeInfo.industryIdentifiers[0].identifier : null + }; + + cities.push(city); + } + + rendercities(); + +}; + +document.querySelector('.search').addEventListener('click', function () { + const search = document.querySelector('#search-query').value; + + fetchCities(search); + + document.querySelector('#search-query').value = ''; +}); \ No newline at end of file From e06344be6c1a7a7a6815b9b983ca494e04180734 Mon Sep 17 00:00:00 2001 From: "P. Warren Groves Jr." Date: Thu, 28 Aug 2025 22:53:02 -0500 Subject: [PATCH 4/8] figured out the city-searching mechanism --- index.html | 14 +++++++++----- main.js | 57 +++++++++++++++++++++--------------------------------- 2 files changed, 31 insertions(+), 40 deletions(-) diff --git a/index.html b/index.html index a717908a..ec21ff16 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,7 @@
Weather Project
-
+
- +
+
+
    + +
+
+ diff --git a/main.js b/main.js index 7e91b28d..18f4c2b3 100644 --- a/main.js +++ b/main.js @@ -20,7 +20,9 @@ const addCities = (data) => { const city = { name: cityData.name || null, state: cityData.state || null, - country: cityData.country || null + country: cityData.country || null, + longitude: cityData.lon || null, + latitude: cityData.lat || null }; cities.push(city); @@ -30,20 +32,24 @@ const addCities = (data) => { }; const renderCities = () => { -document.querySelector('.city-options').replaceChildren(); +document.querySelector('#city-options').replaceChildren(); for (let i = 0; i < cities.length; i++) { const city = cities[i]; - const template = `
  • ${city.name}, ${city.state}, ${city.country}
  • `; + let template = ``; - document.querySelector('.city-options').insertAdjacentHTML('beforeend', template); + if (city.state === null) { + template = ``; + } + + document.querySelector('#city-options').insertAdjacentHTML('beforeend', template); } }; -document.querySelector('.search-btn').addEventListener('click', function () { +document.querySelector('.form-control').addEventListener('input', function () { const search = document.querySelector('.search-query').value; fetchCities(search); From b57c47360390bbfc413067d21eae005bf2f8e028 Mon Sep 17 00:00:00 2001 From: "P. Warren Groves Jr." Date: Fri, 5 Sep 2025 01:16:57 -0500 Subject: [PATCH 6/8] city search functionality complete; retrieval of current weather data via city selection working --- index.html | 16 ++++------------ main.js | 55 +++++++++++++++++++++++++++++++++++++++++++++--------- 2 files changed, 50 insertions(+), 21 deletions(-) diff --git a/index.html b/index.html index 429c8ae6..40ee0ea1 100644 --- a/index.html +++ b/index.html @@ -21,25 +21,17 @@ class="form-control search-query" placeholder="Enter City Name" id="search-query" - list="city-options" /> - - -
    -
    +
    +
    +