Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

LP Wilson Pull Request #89

Open
wants to merge 36 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
36 commits
Select commit Hold shift + click to select a range
699f023
starting our peer agreement
theLP100 Dec 5, 2022
a4ce73e
finished our team checkin
theLP100 Dec 5, 2022
3305a2f
Wave 1 skeleton
Jessicaenvisions Dec 7, 2022
8d6cf80
Modifed index.html connector
Jessicaenvisions Dec 7, 2022
d926711
added script tag
theLP100 Dec 7, 2022
fe687b1
trying stuff
theLP100 Dec 7, 2022
f290d63
fixed index
theLP100 Dec 7, 2022
fad83af
Modifed the HTML, CSS, and other connections working
Jessicaenvisions Dec 7, 2022
d86fb64
Modifed small errors in the HTML.
Jessicaenvisions Dec 7, 2022
f14298e
attaching axios , more debugging
theLP100 Dec 7, 2022
a738085
Fixed errors
Jessicaenvisions Dec 7, 2022
2e179be
added a .env file with my api key in it.tried to connect to that api …
theLP100 Dec 7, 2022
9680f9d
Merge branch 'main' of https://github.com/Jessicaenvisions/weather-re…
theLP100 Dec 7, 2022
9ea7643
Modifed packages
Jessicaenvisions Dec 7, 2022
e18e933
Merge branch 'main' of https://github.com/Jessicaenvisions/weather-re…
Jessicaenvisions Dec 7, 2022
263aca1
Modifed some of the HTML
Jessicaenvisions Dec 7, 2022
6527700
Modifed some HTML
Jessicaenvisions Dec 8, 2022
f98f8c6
sketching out the layout
theLP100 Dec 8, 2022
dd1b5b9
FInshed HTML presentation
Jessicaenvisions Dec 8, 2022
f893db6
adding some useful links
theLP100 Dec 8, 2022
dc93e48
got axios call to weather report working woooooo
theLP100 Dec 12, 2022
10ff7f0
got the temp returned woo
theLP100 Dec 12, 2022
bfaddcd
Got the tempature to show up
Jessicaenvisions Dec 12, 2022
d36da95
made the conversion to farenheit in the code. rounded the number down.
theLP100 Dec 12, 2022
d2e3a41
Worked on wave 2, stuck on making tempature increase
Jessicaenvisions Dec 12, 2022
44aadf2
trying to make await work, putting in our tries
theLP100 Dec 12, 2022
f8f5262
Modifed most of the waves
Jessicaenvisions Dec 12, 2022
453fda0
with jasmine's help, I did a lot of debugging. i got the button clic…
theLP100 Dec 13, 2022
e3928a6
added a to-do-list at top of page
theLP100 Dec 13, 2022
012f1cd
got temp count to show up as the temp number. got the up button working.
theLP100 Dec 14, 2022
c22657e
got the down button working.
theLP100 Dec 14, 2022
54ab58a
got axios recognized with no errors.
theLP100 Dec 14, 2022
91af768
got the temperature to display on the webpage. but when i press the …
theLP100 Dec 14, 2022
2fb179b
got temperature working 100%. it renders the current temp for seattl…
theLP100 Dec 14, 2022
5c7ba07
got the color of the temperature backround to change based on the tem…
theLP100 Dec 14, 2022
39e6300
got the garden displayed. waves 1, 2, and 4 are now all passed.
theLP100 Dec 14, 2022
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
.vscode
.DS_Store
node_modules
.cache
.cache
.env
21 changes: 21 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,26 @@
# Weather Report

## Team Plan

* Access needs
* No working on the weekend!
* defined end times <3
* Let's aim for submission deadline of next Wednesday
* don't work on it on your own. let's work on it together.
* Your learning style
* if one person doesn't get it, the other person shouldn't move on without their partner.
* instead, we should work together until everyone understands before moving on.
* J: hands-on learning, speaking out loud the problem, diagrams are useful, knowing the why of why we're doing something
* L: hands-on learning, knowing the why, speaking out loud the problem, sometimes I need to be slow about understanding it and need to get it before moving on.
* How you prefer to receive feedback
* J: always constructive, don't take it personal, let me know if there's something I'm doing that's not working for you
* L: direct, timely, let me know if there's something I'm doing that's not working for you
* One team communication skill you want to improve with this experience
* making a plan up front for what works (which we're doing)
* put your seatbelt on
* time management!


## Skills Assessed

- Following directions and reading comprehension
Expand Down
3 changes: 3 additions & 0 deletions ada-project-docs/useful links we found
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
https://api.openweathermap.org/data/2.5/weather this is where to call the api

here is the documentation website for open weather: https://openweathermap.org/current
36 changes: 35 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,43 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="styles/index.css" rel="stylesheet">
<!-- <link href="./node_modules/axios/dist/axios.min.js" rel="axios"> -->
<title>Weather Report</title>
</head>
<body>
<main class="grid-container" >
<section class="grid-item" id = "blue-section">
<h1> Weather App </h1>
<h2> Weather Garden</h2>
<p id="garden">Garden</p>
<!-- Photos for the weather change -->

</section>
<section class="grid-item" id = "pink-section">
<p> Weather for the city of Seattle</p>
<!-- City text (part to change name)-->
<!--the temperature number-->
<button id="upButton">⇧</button>

<p id="tempCount">tempcount</p>
<button id="downButton">⇩</button>

</section>

</main>
<!-- Weather -->
<!-- Weather app /header -->


<!-- Add the grid -->
<!-- Add the buttons -->

<!-- -->


<script src="./node_modules/axios/dist/axios.min.js"></script>
<script src="src/index.js"></script>
</body>
</html>
</html>

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
{
"dependencies": {
"axios": "^0.27.2"
"axios": "^1.2.1",
"dotenv": "^16.0.3",
"node": "^19.2.0"
}
}
110 changes: 110 additions & 0 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
//GET THE AXIOS CALL WORKING
//LOOK AT THE 7-WONDERS CODE TO TRY TO GET THE PROMISE AND THE ASYNC AND AWAIT FUNCTION WORKING.

//CODE FOR BUTTON:

const state = {
tempCount: 60, //was temp
};
var tempCountContainer = document.querySelector('#tempCount');
var gardenContainer = document.querySelector('#garden');

//changing the background color temp function
const setTempColor = () => {
if (state.tempCount <= 49) {
tempCountContainer.style.backgroundColor = 'teal';
gardenContainer.textContent = '🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲';
} else if (state.tempCount >= 50 && state.tempCount <= 59) {
tempCountContainer.style.backgroundColor = 'green';
gardenContainer.textContent = '🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲';
} else if (state.tempCount >= 60 && state.tempCount <= 69) {
tempCountContainer.style.backgroundColor = 'yellow';
gardenContainer.textContent = '🌾🌾_🍃_🪨__🛤_🌾🌾🌾_🍃';
} else if (state.tempCount >= 70 && state.tempCount <= 79) {
tempCountContainer.style.backgroundColor = 'orange';
gardenContainer.textContent = '🌸🌿🌼__🌷🌻🌿_☘️🌱_🌻🌷';
} else if (state.tempCount >= 80) {
tempCountContainer.style.backgroundColor = 'red';
gardenContainer.textContent = '🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂';
}
};

const renderTemp = () => {
tempCountContainer.textContent = state.tempCount + ' °F';
setTempColor();
};

renderTemp();

const addTemp = (event) => {
state.tempCount += 1;
renderTemp();
};

const subtractTemp = (event) => {
state.tempCount -= 1;
renderTemp();
};

const registerEventHandlers = (event) => {
// console.log('in registerEventHandelers:', event);
const upButton = document.querySelector('#upButton');
const downButton = document.querySelector('#downButton');
console.log(upButton);
upButton.addEventListener('click', addTemp);
downButton.addEventListener('click', subtractTemp);
console.log(downButton);
};

registerEventHandlers(undefined);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Rather than sending undefined into the function, you could leave it blank and also have the registerEventHandlers function not take in any parameters.


//AXIOS CODE

//call to the flask app to get weather
const lat = 47.6038321;
const lon = -122.330062;
Comment on lines +64 to +65

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One of the requirements for Wave 4 was to make two Axios calls and chain them. Rather than hard-coding the lat and lon for Seattle, we wanted you to be able to get this information from the proxy server and then send the information back to the proxy server to get the temperature. This makes the project a yellow.

axios
.get('http://127.0.0.1:5000/weather' + '?lat=' + lat + '&lon=' + lon)
.then((response) => {
var temp = response.data.main.temp;
temp = Math.round(((temp - 273.15) * 9) / 5 + 32); //convert to Farenheit
console.log(temp);

//need to update the state.
state.tempCount = temp;
renderTemp();
})
.catch((error) => {
console.log(`there has been an error in the axios call. Cause: ${error}`);
});

//what we tried to get async functions working.

// async function get_temp(query) {
// let response = await axios.get;
// }

// adding temperature number
// async function f() {
// let promise = new

// async function addTemp(event) {
// state.tempCount += 1;
// }

// const getPromise = (time) => {
// const timeoutTime = time * 1000;
// const myPromise = new Promise((resolve, reject) => {
// setTimeout(() => resolve("It's go time!"), timeoutTime);
// });
// return myPromise;
// };

// state.tempCount += 1;
// const bookCountContainer = document.querySelector("#bookCount");
// bookCountContainer.textContent = `Book Count: ${state.bookCount}`;
// };

//registering event handler

//if loading,
34 changes: 34 additions & 0 deletions styles/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
background-color: #2196F3;
padding: 10px;
}
.grid-item {
background-color: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(0, 0, 0, 0.8);
padding: 20px;
font-size: 30px;
text-align: center;
}

button {
font-size: x-large;
}

#tempCount {
background-color: pink;
}

#pink-section {
background-color: lightpink;
}

#garden {
background-color: white;
border: 1px solid black;
}

h2 {
font-size : 20px;
}
1 change: 1 addition & 0 deletions weather-report-proxy-server
Submodule weather-report-proxy-server added at ea5dd1
41 changes: 32 additions & 9 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,14 @@ asynckit@^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==
axios@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/axios/-/axios-1.2.1.tgz#44cf04a3c9f0c2252ebd85975361c026cb9f864a"
integrity sha512-I88cFiGu9ryt/tfVEi4kX2SITsvDddTajXTOFmt2uK1ZVA8LytjtdeyefdQWEf5PU8w+4SSJDoYnggflB5tW4A==
dependencies:
follow-redirects "^1.14.9"
follow-redirects "^1.15.0"
form-data "^4.0.0"
proxy-from-env "^1.1.0"

combined-stream@^1.0.8:
version "1.0.8"
Expand All @@ -27,10 +28,15 @@ delayed-stream@~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==
dotenv@^16.0.3:
version "16.0.3"
resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.0.3.tgz#115aec42bac5053db3c456db30cc243a5a836a07"
integrity sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==

follow-redirects@^1.15.0:
version "1.15.2"
resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13"
integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==

form-data@^4.0.0:
version "4.0.0"
Expand All @@ -52,3 +58,20 @@ mime-types@^2.1.12:
integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==
dependencies:
mime-db "1.52.0"

node-bin-setup@^1.0.0:
version "1.1.3"
resolved "https://registry.yarnpkg.com/node-bin-setup/-/node-bin-setup-1.1.3.tgz#d45d5220e3b2ecc3a94263a56116f727f6c1bb14"
integrity sha512-opgw9iSCAzT2+6wJOETCpeRYAQxSopqQ2z+N6BXwIMsQQ7Zj5M8MaafQY8JMlolRR6R1UXg2WmhKp0p9lSOivg==

node@^19.2.0:
version "19.2.0"
resolved "https://registry.yarnpkg.com/node/-/node-19.2.0.tgz#f377e046002065fd1a9a23dd7bffc8026be77847"
integrity sha512-ETicZqrcApHCufk8L7HCO6eUe6HmZFN3YmAklYdETyp8Gi10UZGFvVJ/AvihE9i5CueXsebEP/7DgFKjohHXHw==
dependencies:
node-bin-setup "^1.0.0"

proxy-from-env@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz#e102f16ca355424865755d2c9e8ea4f24d58c3e2"
integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==