From 5fd4f62722a30bb71b1fb2d36f8a8c89b545b984 Mon Sep 17 00:00:00 2001 From: Sujin Shin Date: Mon, 13 Jun 2022 13:26:50 -0400 Subject: [PATCH 1/3] need to make it pretty... --- index.html | 59 ++++++++++++++++++ package-lock.json | 153 ++++++++++++++++++++++++++++++++++++++++++++++ src/index.js | 150 +++++++++++++++++++++++++++++++++++++++++++++ styles/index.css | 23 +++++++ yarn.lock | 90 +++++++++++++-------------- 5 files changed, 430 insertions(+), 45 deletions(-) create mode 100644 package-lock.json diff --git a/index.html b/index.html index 68b320b9a..b32585d26 100644 --- a/index.html +++ b/index.html @@ -1,12 +1,71 @@ + + Weather Report + + +
+

Weather Report

+
+ +
+
+

Temperature

+ +

20

+ + +
+ +
+ +
+ +
+
🌸
+
+ +
+

Location

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

Sky

+ + + +
+
+ +
+ + + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 000000000..4fc627b22 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,153 @@ +{ + "name": "weather-report", + "lockfileVersion": 2, + "requires": true, + "packages": { + "": { + "dependencies": { + "axios": "^0.27.2" + } + }, + "node_modules/asynckit": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", + "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" + }, + "node_modules/axios": { + "version": "0.27.2", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", + "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "dependencies": { + "follow-redirects": "^1.14.9", + "form-data": "^4.0.0" + } + }, + "node_modules/combined-stream": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", + "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==", + "dependencies": { + "delayed-stream": "~1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, + "node_modules/delayed-stream": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", + "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk= sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==", + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/follow-redirects": { + "version": "1.15.0", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.0.tgz", + "integrity": "sha512-aExlJShTV4qOUOL7yF1U5tvLCB0xQuudbf6toyYA0E/acBNw71mvjFTnLaRp50aQaYocMR0a/RMMBIHeZnGyjQ==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, + "node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==", + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "dependencies": { + "mime-db": "1.52.0" + }, + "engines": { + "node": ">= 0.6" + } + } + }, + "dependencies": { + "asynckit": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", + "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" + }, + "axios": { + "version": "0.27.2", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", + "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "requires": { + "follow-redirects": "^1.14.9", + "form-data": "^4.0.0" + } + }, + "combined-stream": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", + "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==", + "requires": { + "delayed-stream": "~1.0.0" + } + }, + "delayed-stream": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", + "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk= sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==" + }, + "follow-redirects": { + "version": "1.15.0", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.0.tgz", + "integrity": "sha512-aExlJShTV4qOUOL7yF1U5tvLCB0xQuudbf6toyYA0E/acBNw71mvjFTnLaRp50aQaYocMR0a/RMMBIHeZnGyjQ==" + }, + "form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "requires": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + } + }, + "mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==" + }, + "mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "requires": { + "mime-db": "1.52.0" + } + } + } +} diff --git a/src/index.js b/src/index.js index e69de29bb..8b3ebc849 100644 --- a/src/index.js +++ b/src/index.js @@ -0,0 +1,150 @@ +"use strict"; + +const state = { + temp: 80 +} + +const currentTemp = document.getElementById('currentTemp'); + +// buttons +const incrementButton = document.getElementById('increaseTempButton'); +const decrementButton = document.getElementById('decreaseTempButton'); + +//emoji +const seasonalEmoji = document.getElementById('seasonalEmoji'); +// const realtimeTempButton = document.getElementById('realtimeTempButton'); + +const updateTemp = () => { + currentTemp.textContent = state.temp +} + +const incrementTemp = () => { + state.temp += 1 + updateTemp() + alterTextColor() +} + +const decrementTemp = () => { + state.temp -= 1 + updateTemp() + alterTextColor() +} + +let skyColor = document.getElementById('skyColor') +let select = document.getElementById('sky') + +const alterSky = () => { + let text = select.options[select.selectedIndex].text; + if (text === "Sunny"){ + return skyColor.style.backgroundColor = "yellow" + } else if (text === "Cloudy"){ + return skyColor.style.backgroundColor = "lightgray" + } else if (text === "Rainy"){ + return skyColor.style.backgroundColor = "lightblue" + } else if (text === "Snowy"){ + return skyColor.style.backgroundColor = "coral" + } + console.log("background color did not change") +} + +const registerEventHandlers = () => { + incrementButton.addEventListener('click', incrementTemp); + decrementButton.addEventListener('click', decrementTemp); + // realtimeTempButton.addEventListener('click',) + select.addEventListener('change', alterSky); + input.addEventListener('change', getLatLon); +} + +document.addEventListener("DOMContentLoaded", registerEventHandlers); + +const alterTextColor = () => { + if (state.temp > 80){ + console.log('changing to red') + seasonalEmoji.textContent = '🔥' + return currentTemp.style.color = 'red' + } else if (state.temp >= 70){ + console.log('changing to orange') + seasonalEmoji.textContent = '🌻' + return currentTemp.style.color = 'orange' + } else if (state.temp >= 60){ + console.log('changing to yellow') + seasonalEmoji.textContent = '🍄' + return currentTemp.style.color = 'yellow' + } else if (state.temp >= 50){ + seasonalEmoji.textContent = '🍁' + console.log('changing to green') + return currentTemp.style.color = 'green' + } else if (state.temp <= 49){ + seasonalEmoji.textContent = '❄️' + console.log('changing to teal') + return currentTemp.style.color = 'teal' + } + console.log('text color did not change') +} + +//axios request to the api JSON object, + +//could create a script file that contains all the api calls, then import the js files into + + +//convert kevlin to farenheit helper function +const kelvinToFaren = (k) => { + let faren = Math.floor(1.8 * (k - 273) + 32) + return faren + +} + + +const getTemp = (locationData) => { + + axios + .get('http://localhost:5000/weather', { + params: { + lat: locationData.lat, + lon: locationData.lon, + }, + }) + .then((response) => { + let tempInKelvin = response.data.current.temp; + console.log(tempInKelvin) + console.log (typeof tempInKelvin) + let realTimeTemp = kelvinToFaren(tempInKelvin); + console.log(realTimeTemp) + state.temp = realTimeTemp; + currentTemp.textContent = `${state.temp}°F` + }) + .catch((error) => { + console.log( + 'not workingggg error- weather' + ) + }) +} + + +//get input by query selector +const input = document.querySelector('input'); + +const getLatLon = () => { + let locationName = input.value + console.log(locationName); + let lat, lon, locationData; + console.log(lat, lon, locationData); + axios + .get('http://localhost:5000/location', { + params: { + q: locationName, + }, + }) + .then((response) => { + lat = response.data[0].lat; + lon = response.data[0].lon; + locationData = { lat,lon } + console.log(locationData) + getTemp(locationData) + }) + .catch((error) => { + console.log( + 'not workingggg error' + ) + }) +} \ No newline at end of file diff --git a/styles/index.css b/styles/index.css index e69de29bb..da039a58a 100644 --- a/styles/index.css +++ b/styles/index.css @@ -0,0 +1,23 @@ +#realtimeTempButton { + background-color: #4CAF50; /* Green */ + border: none; + color: white; + padding: 15px 32px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + border-radius: 15px; + cursor: point; + } + + #realtimeTempButton:hover { + color: #000; + cursor: pointer; + } + + #skyColor { + width: 250px; + height: 100px; + background-color: yellow + } \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 37fbaed29..6640267bb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,53 +2,53 @@ # yarn lockfile v1 -asynckit@^0.4.0: - version "0.4.0" - resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" - integrity sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q== - -axios@^0.27.2: - version "0.27.2" - resolved "https://registry.yarnpkg.com/axios/-/axios-0.27.2.tgz#207658cc8621606e586c85db4b41a750e756d972" - integrity sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ== +"asynckit@^0.4.0": + "integrity" "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" + "resolved" "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz" + "version" "0.4.0" + +"axios@^0.27.2": + "integrity" "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==" + "resolved" "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz" + "version" "0.27.2" dependencies: - follow-redirects "^1.14.9" - form-data "^4.0.0" + "follow-redirects" "^1.14.9" + "form-data" "^4.0.0" -combined-stream@^1.0.8: - version "1.0.8" - resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f" - integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg== +"combined-stream@^1.0.8": + "integrity" "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==" + "resolved" "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz" + "version" "1.0.8" dependencies: - delayed-stream "~1.0.0" - -delayed-stream@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" - integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk= - -follow-redirects@^1.14.9: - version "1.15.0" - resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.0.tgz#06441868281c86d0dda4ad8bdaead2d02dca89d4" - integrity sha512-aExlJShTV4qOUOL7yF1U5tvLCB0xQuudbf6toyYA0E/acBNw71mvjFTnLaRp50aQaYocMR0a/RMMBIHeZnGyjQ== - -form-data@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452" - integrity sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww== + "delayed-stream" "~1.0.0" + +"delayed-stream@~1.0.0": + "integrity" "sha1-3zrhmayt+31ECqrgsp4icrJOxhk= sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==" + "resolved" "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz" + "version" "1.0.0" + +"follow-redirects@^1.14.9": + "integrity" "sha512-aExlJShTV4qOUOL7yF1U5tvLCB0xQuudbf6toyYA0E/acBNw71mvjFTnLaRp50aQaYocMR0a/RMMBIHeZnGyjQ==" + "resolved" "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.0.tgz" + "version" "1.15.0" + +"form-data@^4.0.0": + "integrity" "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==" + "resolved" "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz" + "version" "4.0.0" dependencies: - asynckit "^0.4.0" - combined-stream "^1.0.8" - mime-types "^2.1.12" - -mime-db@1.52.0: - version "1.52.0" - resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.52.0.tgz#bbabcdc02859f4987301c856e3387ce5ec43bf70" - integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg== - -mime-types@^2.1.12: - version "2.1.35" - resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.35.tgz#381a871b62a734450660ae3deee44813f70d959a" - integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw== + "asynckit" "^0.4.0" + "combined-stream" "^1.0.8" + "mime-types" "^2.1.12" + +"mime-db@1.52.0": + "integrity" "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==" + "resolved" "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz" + "version" "1.52.0" + +"mime-types@^2.1.12": + "integrity" "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==" + "resolved" "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz" + "version" "2.1.35" dependencies: - mime-db "1.52.0" + "mime-db" "1.52.0" From 3cd3f630f00122b8d423272b79d232b88bd91769 Mon Sep 17 00:00:00 2001 From: Sujin Shin Date: Mon, 13 Jun 2022 14:31:23 -0400 Subject: [PATCH 2/3] completed waves but still needs work... --- index.html | 2 +- src/index.js | 19 ++++++++++++++++++- 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index b32585d26..ea2507c2c 100644 --- a/index.html +++ b/index.html @@ -34,7 +34,7 @@

20

-

Location

+

Location

diff --git a/src/index.js b/src/index.js index 8b3ebc849..6b5a533e4 100644 --- a/src/index.js +++ b/src/index.js @@ -9,6 +9,7 @@ const currentTemp = document.getElementById('currentTemp'); // buttons const incrementButton = document.getElementById('increaseTempButton'); const decrementButton = document.getElementById('decreaseTempButton'); +const resetButton = document.getElementById('resetButton'); //emoji const seasonalEmoji = document.getElementById('seasonalEmoji'); @@ -30,6 +31,7 @@ const decrementTemp = () => { alterTextColor() } +// Wave 5 let skyColor = document.getElementById('skyColor') let select = document.getElementById('sky') @@ -47,12 +49,14 @@ const alterSky = () => { console.log("background color did not change") } + const registerEventHandlers = () => { incrementButton.addEventListener('click', incrementTemp); decrementButton.addEventListener('click', decrementTemp); // realtimeTempButton.addEventListener('click',) select.addEventListener('change', alterSky); input.addEventListener('change', getLatLon); + resetButton.addEventListener('click', defaultDisplayName) } document.addEventListener("DOMContentLoaded", registerEventHandlers); @@ -124,9 +128,21 @@ const getTemp = (locationData) => { //get input by query selector const input = document.querySelector('input'); +let locationDisplay = document.getElementById('location') + +// WAVE 6 +// need to work on this..... buggy +const defaultDisplayName = () => { + locationDisplay.textContent = "New York City" +} + const getLatLon = () => { let locationName = input.value console.log(locationName); + + // changing display text to the input text + locationDisplay.textContent = locationName + let lat, lon, locationData; console.log(lat, lon, locationData); axios @@ -147,4 +163,5 @@ const getLatLon = () => { 'not workingggg error' ) }) -} \ No newline at end of file +} + From cc18f71f517b95587f2e6a14bd475000f5d38fcf Mon Sep 17 00:00:00 2001 From: Sujin Shin Date: Fri, 17 Jun 2022 13:13:16 -0400 Subject: [PATCH 3/3] fixed the bug in wave 6 --- index.html | 5 +++-- src/index.js | 14 +++++++++----- styles/index.css | 21 ++++++++++++++++++++- 3 files changed, 32 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index ea2507c2c..826c16b66 100644 --- a/index.html +++ b/index.html @@ -25,9 +25,9 @@

20

-
+
🌸
@@ -35,6 +35,7 @@

20

Location

+
diff --git a/src/index.js b/src/index.js index 6b5a533e4..1fd7ec43f 100644 --- a/src/index.js +++ b/src/index.js @@ -64,18 +64,18 @@ document.addEventListener("DOMContentLoaded", registerEventHandlers); const alterTextColor = () => { if (state.temp > 80){ console.log('changing to red') - seasonalEmoji.textContent = '🔥' + seasonalEmoji.textContent = '🔥🔥🔥🔥🔥🔥🔥' return currentTemp.style.color = 'red' } else if (state.temp >= 70){ console.log('changing to orange') - seasonalEmoji.textContent = '🌻' + seasonalEmoji.textContent = '🌻🌻🌻🌻🌻🌻🌻' return currentTemp.style.color = 'orange' } else if (state.temp >= 60){ console.log('changing to yellow') - seasonalEmoji.textContent = '🍄' + seasonalEmoji.textContent = '🍄🍄🍄🍄🍄🍄🍄' return currentTemp.style.color = 'yellow' } else if (state.temp >= 50){ - seasonalEmoji.textContent = '🍁' + seasonalEmoji.textContent = '🍁🍁🍁🍁🍁🍁🍁' console.log('changing to green') return currentTemp.style.color = 'green' } else if (state.temp <= 49){ @@ -132,8 +132,12 @@ let locationDisplay = document.getElementById('location') // WAVE 6 // need to work on this..... buggy -const defaultDisplayName = () => { +const defaultDisplayName = (event) => { + // nathaniel's magic + event.preventDefault() locationDisplay.textContent = "New York City" + currentTemp.textContent = '80' + console.log('strugglez') } const getLatLon = () => { diff --git a/styles/index.css b/styles/index.css index da039a58a..46f8efa7d 100644 --- a/styles/index.css +++ b/styles/index.css @@ -19,5 +19,24 @@ #skyColor { width: 250px; height: 100px; - background-color: yellow + background-color: lightgoldenrodyellow + } + + h1 { + font-family: sans-serif; + color: white + } + + h2 { + font-family: sans-serif; + color: white + } + + h3 { + font-family: sans-serif; + color: coral; + } + + body { + background-color: lightblue; } \ No newline at end of file