From 37a75c5dc53cab8e50e0e79ca34f17135f681934 Mon Sep 17 00:00:00 2001 From: Lindsey Date: Wed, 7 Dec 2022 18:02:54 -0500 Subject: [PATCH 01/13] Creating HTML and boxes --- index.html | 25 +++++++++++++++++++++++++ src/index.js | 1 + styles/index.css | 48 ++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 74 insertions(+) diff --git a/index.html b/index.html index 68b320b9a..261f83079 100644 --- a/index.html +++ b/index.html @@ -2,11 +2,36 @@ + Weather Report +
+
Weather Report For the lovely city of Seattle
+ +
+
Weather Garden
+
+
This is our web page
+ + + + + + + + + + + \ No newline at end of file diff --git a/src/index.js b/src/index.js index e69de29bb..ad9a93a7c 100644 --- a/src/index.js +++ b/src/index.js @@ -0,0 +1 @@ +'use strict'; diff --git a/styles/index.css b/styles/index.css index e69de29bb..be72f3519 100644 --- a/styles/index.css +++ b/styles/index.css @@ -0,0 +1,48 @@ + +body { + background-color: rgb(0, 106, 255); + /* color: #434344; */ + font-family: "Montserrat", sans-serif; + font-weight: 400; +} + + +.container { + width: 60vw; + height: 100vh; + /* background-color: lightblue; */ + + display: grid; + grid-template: 15% + auto 20% /1fr 3fr; +} + /* grid-template-columns: 100px 100px; */ + +.header { + background-color: #d55e00; + grid-column: auto / span 2; + color: white; + font-size: 50px; +} + +nav { + background-color: yellow; + grid-row: auto / span 2; +} + +.content { + background-color: #009e73; + grid-row: auto; + +} + +footer { + background-color: red; + grid-column: auto / span 2; +} + +/* .white { + background-color: white; + color: black +} */ + From 05d901098344c542e37ca5897147f0d18c8865a2 Mon Sep 17 00:00:00 2001 From: Masha Date: Wed, 7 Dec 2022 23:47:42 -0800 Subject: [PATCH 02/13] Updated Wave1, added flex containers and some styling --- index.html | 42 +++++++++++++++++++++++++++++++++++------- package.json | 2 +- styles/index.css | 38 +++++++++++++++++++++++++++++++------- 3 files changed, 67 insertions(+), 15 deletions(-) diff --git a/index.html b/index.html index 261f83079..935f93f80 100644 --- a/index.html +++ b/index.html @@ -10,16 +10,44 @@
-
Weather Report For the lovely city of Seattle
- +
+ Weather Report For the lovely city of + + Seattle + + +
+
+
+

Temperature

+
+
+ ⬆️ + NUMBER + ⬇️ +
+ +
+
+
+

Sky

+ +
+
+

City name

+ + +
+
Weather Garden
-
This is our web page
+
This is our Footer
diff --git a/src/index.js b/src/index.js index ad9a93a7c..047ae3e54 100644 --- a/src/index.js +++ b/src/index.js @@ -1 +1,31 @@ 'use strict'; + +// Build an event handler +// Register the event handler on some HTML element(s) + +// An element that increases the temperature by one degree on click +const increaseTemperature = () => { + const temperature = document.getElementbyId('increaseTemp'); + temperature.textContent = parseInt(temperature.textContent) + 1; + // add in something later about when we change temp we change text color & layout- may add in elsewhere +}; + +// An element that decreases the temperature by one degree on click +const decreaseTemperature = () => { + const temperature = document.getElementbyId('decreaseTemp'); + temperature.textContent = parseInt(temperature.textContent) - 1; + // add in something later about when we change temp we change text color & layout +}; + +// register event handlers +const registerEventHandlers = () => { + const increaseTemperature = document.querySelector('increaseTemp'); + Temp.addEventListener('click', increaseTemperature); + // separate these two out? + const decreaseTemperature = document.querySelector('decreaseTemp'); + Temp.addEventListener('click', decreaseTemperature); +}; + +document.addEventListener('DOMContentLoaded', registerEventHandlers); + +// missing state and maybe that's why it's not working? From 82024be257009dbff90102d075b7cfccbfc81d3e Mon Sep 17 00:00:00 2001 From: Lindsey Date: Thu, 8 Dec 2022 14:43:10 -0500 Subject: [PATCH 05/13] Changed text color of temp & ability to change temp by 1 --- index.html | 4 ++-- src/index.js | 56 ++++++++++++++++++++++++++++++++---------------- styles/index.css | 24 +++++++++++++++++++++ 3 files changed, 64 insertions(+), 20 deletions(-) diff --git a/index.html b/index.html index 9b79f6c47..198d7d822 100644 --- a/index.html +++ b/index.html @@ -23,7 +23,7 @@

Temperature

⬆️ - NUMBER + 80 ⬇️
@@ -62,6 +62,6 @@

City name

- + \ No newline at end of file diff --git a/src/index.js b/src/index.js index 047ae3e54..0b23430c2 100644 --- a/src/index.js +++ b/src/index.js @@ -1,31 +1,51 @@ 'use strict'; +console.log('testing'); -// Build an event handler -// Register the event handler on some HTML element(s) +const state = { + city: 'Seattle', + temp: 80, +}; -// An element that increases the temperature by one degree on click const increaseTemperature = () => { - const temperature = document.getElementbyId('increaseTemp'); - temperature.textContent = parseInt(temperature.textContent) + 1; - // add in something later about when we change temp we change text color & layout- may add in elsewhere + state.temp += 1; + changeColor(); + // const temperature = document.getElementById('temp'); + // temperature.textContent = state.temp; }; -// An element that decreases the temperature by one degree on click const decreaseTemperature = () => { - const temperature = document.getElementbyId('decreaseTemp'); - temperature.textContent = parseInt(temperature.textContent) - 1; - // add in something later about when we change temp we change text color & layout + state.temp -= 1; + changeColor(); + // const temperature = document.getElementById('temp'); + // temperature.textContent = state.temp; +}; + +const changeColor = () => { + let temp = state.temp; + let color = 'red'; + if (temp >= 80) { + color = 'red'; + } else if (temp >= 70) { + color = 'orange'; + } else if (temp >= 60) { + color = 'yellow'; + } else if (temp >= 50) { + color = 'green'; + } else { + color = 'teal'; + } + + const temperature = document.getElementById('temp'); + temperature.className = color; + temperature.textContent = String(state.temp); }; -// register event handlers const registerEventHandlers = () => { - const increaseTemperature = document.querySelector('increaseTemp'); - Temp.addEventListener('click', increaseTemperature); - // separate these two out? - const decreaseTemperature = document.querySelector('decreaseTemp'); - Temp.addEventListener('click', decreaseTemperature); + const increaseTemp = document.getElementById('increaseTemp'); + increaseTemp.addEventListener('click', increaseTemperature); + + const decreaseTemp = document.getElementById('decreaseTemp'); + decreaseTemp.addEventListener('click', decreaseTemperature); }; document.addEventListener('DOMContentLoaded', registerEventHandlers); - -// missing state and maybe that's why it's not working? diff --git a/styles/index.css b/styles/index.css index 731afcde2..d83c3592b 100644 --- a/styles/index.css +++ b/styles/index.css @@ -65,6 +65,30 @@ footer { grid-column: auto / span 2; } +.red { + color: red; + } + +.orange { + color: orange; + } + +.yellow { + color: gold; + } + +.yellow-green { + color: yellowgreen; + } + +.green { + color: green; + } + +.teal { + color: teal; + } + /* .white { background-color: white; color: black From 4b4086ffad1bdb3c2ae1fccf8907ad1c724e36e0 Mon Sep 17 00:00:00 2001 From: Lindsey Date: Thu, 8 Dec 2022 23:15:07 -0500 Subject: [PATCH 06/13] Working on adding weather garden/landscape code --- index.html | 3 +++ src/index.js | 17 ++++++++++++++--- styles/index.css | 11 +++++++++++ 3 files changed, 28 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 198d7d822..7b3b37d43 100644 --- a/index.html +++ b/index.html @@ -48,6 +48,9 @@

City name

Weather Garden
+ + +
This is our Footer
diff --git a/src/index.js b/src/index.js index 0b23430c2..e0bf04b67 100644 --- a/src/index.js +++ b/src/index.js @@ -8,39 +8,50 @@ const state = { const increaseTemperature = () => { state.temp += 1; - changeColor(); + changeColorAndGarden(); // const temperature = document.getElementById('temp'); // temperature.textContent = state.temp; }; const decreaseTemperature = () => { state.temp -= 1; - changeColor(); + changeColorAndGarden(); // const temperature = document.getElementById('temp'); // temperature.textContent = state.temp; }; -const changeColor = () => { +const changeColorAndGarden = () => { let temp = state.temp; let color = 'red'; + // let garden = '🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂'; + if (temp >= 80) { color = 'red'; + garden = '🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂'; } else if (temp >= 70) { color = 'orange'; + garden = '🦜🦜__😎_ 🌞__⛱⛱_ '; } else if (temp >= 60) { color = 'yellow'; + garden = '🌸🌿🌼__🌷🌻🌿_☘️🌱_🌻🌷'; } else if (temp >= 50) { color = 'green'; + garden = '🌱🌱__ 🌻 🌿__ 🌷🌷'; } else { color = 'teal'; + garden = '❄️🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲️'; } + const newgarden = document.getElementById('garden'); + newgarden.textContent = garden; const temperature = document.getElementById('temp'); temperature.className = color; temperature.textContent = String(state.temp); }; const registerEventHandlers = () => { + changeColorAndGarden(); + const increaseTemp = document.getElementById('increaseTemp'); increaseTemp.addEventListener('click', increaseTemperature); diff --git a/styles/index.css b/styles/index.css index d83c3592b..469b00b1d 100644 --- a/styles/index.css +++ b/styles/index.css @@ -89,6 +89,17 @@ footer { color: teal; } + +/* weather-Garden-Container { + width: 600px; + height: 50px; + position:absolute; + text-align: center; + +} */ + + + /* .white { background-color: white; color: black From d9a5e8c1eb342812bedf7affae4b2a268453bd04 Mon Sep 17 00:00:00 2001 From: Masha Date: Thu, 8 Dec 2022 21:06:22 -0800 Subject: [PATCH 07/13] Minor changes in html structure and updated changeColor function in js --- favicon.ico | Bin 0 -> 1150 bytes index.html | 7 +++-- src/index.js | 8 +++-- styles/index.css | 75 ++++++++++++++++++++--------------------------- 4 files changed, 41 insertions(+), 49 deletions(-) create mode 100644 favicon.ico diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..62661dbde9acfa41be45d5d0d446d87fead5c70f GIT binary patch literal 1150 zcmd6nJqp4=6okK^V3}0bmi9S-*Ri*>v9?jXfLF2e8kS;VE20?RMn|4Y44Y2E?7W|u z*+3wW*;5qQIbzy}Auu-B$R@A35!h~BWHsvEj;gBu24z`RiCD((o#^|@SBAXmQ`mca zo#K@y_E58zTp41Y5zo|%y;hmpiDQlWuvZ<}`uxqG z@9y`imD|SBwz2Myxy|Euu}{6%q}1Jf;U55p9_%vM-VG1f8(*%lxxsM;`2fxTemperature
⬆️ - 80 + 70 ⬇️
@@ -46,8 +46,9 @@

City name

-
-
Weather Garden
+
+
Weather Garden
+
information
This is our Footer
diff --git a/src/index.js b/src/index.js index 0b23430c2..518fb1c6b 100644 --- a/src/index.js +++ b/src/index.js @@ -3,7 +3,7 @@ console.log('testing'); const state = { city: 'Seattle', - temp: 80, + temp: 70, }; const increaseTemperature = () => { @@ -36,8 +36,10 @@ const changeColor = () => { } const temperature = document.getElementById('temp'); - temperature.className = color; - temperature.textContent = String(state.temp); + // temperature.className = color; + temperature.style.color = color; + // temperature.textContent = String(state.temp); + temperature.textContent = state.temp; }; const registerEventHandlers = () => { diff --git a/styles/index.css b/styles/index.css index d83c3592b..a3cfb12d7 100644 --- a/styles/index.css +++ b/styles/index.css @@ -1,61 +1,78 @@ body { - background-color: rgb(0, 106, 255); - /* color: #434344; */ + background-color: rgb(17, 129, 241); font-family: "Montserrat", sans-serif; font-weight: 400; } .container { - width: 90vw; - height: 90vh; + width: 80%; + height: 60%; + margin: auto; /* background-color: lightblue; */ display: grid; - grid-template: 15% auto 20% /1fr 3fr; + grid-template: 10% auto 5% /30% 70%; } /* grid-template-columns: 100px 100px; */ .header { - background-color: #d55e00; + grid-column: auto / span 2; color: white; font-size: 50px; } .white-boxes { - background-color: yellow; + display: flex; flex-direction: column; justify-content: space-around; + /* grid-row: auto; */ } .white { background-color: white; - border-radius: 25px; - margin: 25px; - padding: 55px 52px; + border-radius: 10px; + margin: 15px; + padding: 5% 5%; } .content { - background-color: #009e73; + /* grid-row: auto; */ display: flex; flex-direction: column; - justify-content: space-around; + justify-content: center; + align-items: center; } +#temp { + color: orange +} + +.garden_name { + background-color: yellow; + + width: 50%; + border-radius: 10px; + margin: 10px; + padding: 5px 22px; +} + .garden { background-color: white; - border-radius: 25px; - margin: 25px; - padding: 255px 52px; + + width: 50%; + border-radius: 10px; + margin: 10px; + padding: 55px 22px; } @@ -65,32 +82,4 @@ footer { grid-column: auto / span 2; } -.red { - color: red; - } - -.orange { - color: orange; - } - -.yellow { - color: gold; - } - -.yellow-green { - color: yellowgreen; - } - -.green { - color: green; - } - -.teal { - color: teal; - } - -/* .white { - background-color: white; - color: black -} */ From daa60237c2c679964048ef12df9d4a05f27fd104 Mon Sep 17 00:00:00 2001 From: Masha Date: Fri, 9 Dec 2022 00:04:17 -0800 Subject: [PATCH 08/13] Wave 3 and 5 added --- index.html | 9 ++++-- src/index.js | 79 ++++++++++++++++++++++++++++++++++++++++-------- styles/index.css | 7 ++--- 3 files changed, 76 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index 662ae12b0..71aa6f993 100644 --- a/index.html +++ b/index.html @@ -33,7 +33,7 @@

Temperature

Sky

- @@ -48,10 +48,13 @@

City name

Weather Garden
-
information
+
+
+
-
+ +
diff --git a/src/index.js b/src/index.js index f04ffa023..2ec867ae7 100644 --- a/src/index.js +++ b/src/index.js @@ -1,45 +1,46 @@ 'use strict'; console.log('testing'); +// const BASE_URL = 'http://localhost:5000'; + const state = { city: 'Seattle', temp: 70, }; -const increaseTemperature = () => { +const increaseTemperature = (event) => { + console.log('in increaseTemp:', event); state.temp += 1; changeColorAndGarden(); - // const temperature = document.getElementById('temp'); - // temperature.textContent = state.temp; }; -const decreaseTemperature = () => { +const decreaseTemperature = (event) => { + console.log('in decreaseTemp:', event); state.temp -= 1; changeColorAndGarden(); - // const temperature = document.getElementById('temp'); - // temperature.textContent = state.temp; }; const changeColorAndGarden = () => { let temp = state.temp; let color = 'red'; - // let garden = '🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂'; + let garden = '🦜🦜__😎_ 🌞__⛱⛱_ '; if (temp >= 80) { color = 'red'; garden = '🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂'; } else if (temp >= 70) { color = 'orange'; - garden = '🦜🦜__😎_ 🌞__⛱⛱_ '; + garden = '🌸🌿🌼__🌷🌻🌿_☘️🌱_🌻🌷'; + // garden = '🦜🦜__😎_ 🌞__⛱⛱_ '; } else if (temp >= 60) { color = 'yellow'; - garden = '🌸🌿🌼__🌷🌻🌿_☘️🌱_🌻🌷'; + garden = '🌾🌾_🍃_🪨__🛤_🌾🌾🌾_🍃'; } else if (temp >= 50) { color = 'green'; - garden = '🌱🌱__ 🌻 🌿__ 🌷🌷'; + garden = '❄️🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲️'; } else { color = 'teal'; - garden = '❄️🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲️'; + garden = '❄️❄️❄️❄️❄️⛄️⛄️⛄️⛄️⛄️⛄️❄️❄️❄️❄️❄️'; } const newgarden = document.getElementById('garden'); @@ -51,7 +52,50 @@ const changeColorAndGarden = () => { temperature.textContent = state.temp; }; -const registerEventHandlers = () => { +const modifySky = (event) => { + console.log('in Modify Sky name:', event); + let sky = document.getElementById('selectSky'); + let color = 'lightblue'; + + let sky_visual = '😎😎😎😎😎🌞🌞🌞🌞🌞'; + if (sky.value === 'Sunny') { + sky_visual = '😎😎😎😎😎🌞🌞🌞🌞🌞'; + color = 'lightyellow'; + } else if (sky.value === 'Cloudy') { + sky_visual = '☁️☁️ ☁️ ☁️☁️ ☁️ 🌤 ☁️ ☁️☁️'; + color = 'lightgray'; + } else if (sky.value === 'Rainy') { + sky_visual = '🌧🌈⛈🌧🌧💧⛈🌧🌦🌧💧🌧🌧'; + color = 'darkblue'; + } else if (sky.value === 'Snowy') { + sky_visual = '❄️❄️❄️❄️🌨🌨🌨🌨❄️❄️❄️❄️'; + color = 'white'; + } + + const skyInWeatherBox = document.getElementById('sky'); + skyInWeatherBox.textContent = sky_visual; + const weatherBox = document.getElementById('weatherBox'); + weatherBox.style.backgroundColor = color; +}; + +const modifyCityName = (event) => { + console.log('in Modify City name:', event); + const cityInput = document.getElementById('cityNameInput').value; + const headerCityName = document.getElementById('headerCityName'); + state.city = cityInput; + headerCityName.textContent = state.city; +}; + +const resetCityName = (event) => { + console.log('in Reset City name:', event); + const cityInput = document.getElementById('cityNameInput'); + cityNameInput.value = 'Seattle'; + modifyCityName(); +}; + +const registerEventHandlers = (event) => { + console.log('in registerEventHandlers:', event); + changeColorAndGarden(); const increaseTemp = document.getElementById('increaseTemp'); @@ -59,6 +103,17 @@ const registerEventHandlers = () => { const decreaseTemp = document.getElementById('decreaseTemp'); decreaseTemp.addEventListener('click', decreaseTemperature); + + // modifyCityName(); + const cityNameInput = document.getElementById('cityNameInput'); + cityNameInput.addEventListener('input', modifyCityName); + + const cityResetButton = document.getElementById('resetCity'); + cityResetButton.addEventListener('click', resetCityName); + + modifySky(); + const selectNewSky = document.getElementById('selectSky'); + selectNewSky.addEventListener('change', modifySky); }; document.addEventListener('DOMContentLoaded', registerEventHandlers); diff --git a/styles/index.css b/styles/index.css index 88fdd1524..49c4dac5f 100644 --- a/styles/index.css +++ b/styles/index.css @@ -13,12 +13,11 @@ body { /* background-color: lightblue; */ display: grid; - grid-template: 10% auto 5% /30% 70%; + grid-template: 15% auto 5% /30% 70%; } /* grid-template-columns: 100px 100px; */ .header { - grid-column: auto / span 2; color: white; font-size: 50px; @@ -82,7 +81,7 @@ footer { grid-column: auto / span 2; } -.red { +/* .red { color: red; } @@ -104,7 +103,7 @@ footer { .teal { color: teal; - } + } */ /* weather-Garden-Container { From 198753c93d40c4ff36624cb0571c09387986e9ba Mon Sep 17 00:00:00 2001 From: Lindsey Date: Fri, 9 Dec 2022 11:23:21 -0500 Subject: [PATCH 09/13] Wave 4, Location API Key --- src/index.js | 24 +++++++++++++++++++++++- styles/index.css | 2 +- 2 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 2ec867ae7..f876408bc 100644 --- a/src/index.js +++ b/src/index.js @@ -1,11 +1,13 @@ 'use strict'; console.log('testing'); -// const BASE_URL = 'http://localhost:5000'; +const BASE_URL = 'http://localhost:5000'; const state = { city: 'Seattle', temp: 70, + lat: 47.6062, + lon: -122.3321, }; const increaseTemperature = (event) => { @@ -93,6 +95,26 @@ const resetCityName = (event) => { modifyCityName(); }; +const getLatAndLon = () => { + // const lat = + // const lon = + + const axios = require('axios'); + + axios + .get('http://localhost:5000/location', { + params: { q: state.city }, + }) + + .then((response) => { + // state.lat = response + console.log(response); + }) + .catch((error) => { + console.log('Error in get Lat & Lon'); + }); +}; + const registerEventHandlers = (event) => { console.log('in registerEventHandlers:', event); diff --git a/styles/index.css b/styles/index.css index 49c4dac5f..0378fb282 100644 --- a/styles/index.css +++ b/styles/index.css @@ -24,7 +24,7 @@ body { } .white-boxes { - + display: flex; flex-direction: column; justify-content: space-around; From 8c3c4f47d4259163c504c6ed33dd90be32c35707 Mon Sep 17 00:00:00 2001 From: Lindsey Date: Sat, 10 Dec 2022 12:20:07 -0500 Subject: [PATCH 10/13] Working on adding current weather for each city --- src/index.js | 41 ++++++++++++++++++++++++++++++++++++----- 1 file changed, 36 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index f876408bc..37f8596c2 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,7 @@ 'use strict'; + +const { default: axios } = require('axios'); + console.log('testing'); const BASE_URL = 'http://localhost:5000'; @@ -96,10 +99,7 @@ const resetCityName = (event) => { }; const getLatAndLon = () => { - // const lat = - // const lon = - - const axios = require('axios'); + // const axios = require('axios'); axios .get('http://localhost:5000/location', { @@ -108,17 +108,44 @@ const getLatAndLon = () => { .then((response) => { // state.lat = response - console.log(response); + // console.log(response); + state.lat = response.data[0].lat; + state.lon = response.data[0].lon; + console.log(state); }) + .catch((error) => { console.log('Error in get Lat & Lon'); }); }; +// add in lat and lon in the parameters below? + +const getWeather = () => { + + axios + .get('http://localhost:5000/weather', { + params: { + lat: state.lat, + lon: state.lon, + }, + }) + + .then((response) => { + const temperature = Math.round((9 / 5)) + 32); + // currentLocation.temp = temp.textContent; + }) + + .catch((error) => { + console.log('Error in Weather'); + }); +}; const registerEventHandlers = (event) => { console.log('in registerEventHandlers:', event); changeColorAndGarden(); + getLatAndLon(); + getWeather(); const increaseTemp = document.getElementById('increaseTemp'); increaseTemp.addEventListener('click', increaseTemperature); @@ -136,6 +163,10 @@ const registerEventHandlers = (event) => { modifySky(); const selectNewSky = document.getElementById('selectSky'); selectNewSky.addEventListener('change', modifySky); + + getWeather(); + const getTemp = document.getElementById('getTemp'); + getTemp.addEventListener('click', getWeather); }; document.addEventListener('DOMContentLoaded', registerEventHandlers); From 54aa63f1bee52413946d5701b20b8c5291123c02 Mon Sep 17 00:00:00 2001 From: Lindsey Date: Sat, 10 Dec 2022 18:01:40 -0500 Subject: [PATCH 11/13] Editing code for getting weather --- src/index.js | 24 +++++++++++++++--------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/src/index.js b/src/index.js index 37f8596c2..9f23c0ea1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,6 @@ 'use strict'; -const { default: axios } = require('axios'); +// const { default: axios } = require('axios'); console.log('testing'); @@ -120,23 +120,29 @@ const getLatAndLon = () => { }; // add in lat and lon in the parameters below? -const getWeather = () => { - +const getWeather = (latitude, longitude) => { axios - .get('http://localhost:5000/weather', { + .get('http://127.0.0.1:5000/weather', { + // .get('http://localhost:5000/weather', { params: { - lat: state.lat, - lon: state.lon, + lat: latitude, + lon: longitude, + units: 'imperial', }, }) .then((response) => { - const temperature = Math.round((9 / 5)) + 32); - // currentLocation.temp = temp.textContent; + const temp = response.data.main.temp; + console.log(response.data.main.temp); + document.getElementById('getTemp').innerhtml = temp; + // state.temp = Math.round(weather.current.temp - 273.15); + // temp is in kelvin- convert to celsius + // Math.round((9 / 5)) + 32); convert celsius to farenheit + // changeColorAndGarden(); }) .catch((error) => { - console.log('Error in Weather'); + console.log('Error calling OpenWeather'); }); }; From 1ba919c7cb841a9780027470f0349f2baae62942 Mon Sep 17 00:00:00 2001 From: Lindsey Date: Sat, 10 Dec 2022 19:58:07 -0500 Subject: [PATCH 12/13] Completed Wave 4, get weather and edited CSS --- index.html | 7 ++----- src/index.js | 25 ++++++++--------------- styles/index.css | 53 +++++++----------------------------------------- 3 files changed, 18 insertions(+), 67 deletions(-) diff --git a/index.html b/index.html index 71aa6f993..ec263c763 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@
- Weather Report For the lovely city of + Weather Report for the lovely city of Seattle @@ -51,12 +51,9 @@

City name

- - -
-
This is our Footer
+
Lindsey & Masha's Weather Report © 2022