From eac3244f9602a633a9d55dbaa7489a9bbad781c4 Mon Sep 17 00:00:00 2001
From: Jeremy Taubman <56704648+taubman33@users.noreply.github.com>
Date: Tue, 2 May 2023 11:02:14 -0400
Subject: [PATCH 1/6] Update README.md
---
README.md | 2 ++
1 file changed, 2 insertions(+)
diff --git a/README.md b/README.md
index b8dcbcc..3267849 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,5 @@
+## SEIR 0508
+
### PokeAPI lab
From 7905d2c8573b724edb84d399bb21a7657b37dbe4 Mon Sep 17 00:00:00 2001
From: Jeremy Taubman <56704648+taubman33@users.noreply.github.com>
Date: Tue, 16 May 2023 11:16:41 -0400
Subject: [PATCH 2/6] Update README.md
---
README.md | 9 +++++----
1 file changed, 5 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
index 3267849..f9a26cc 100644
--- a/README.md
+++ b/README.md
@@ -12,7 +12,7 @@ You may need to Map through and run some conditionals for some peices of informa
```html
@@ -31,13 +31,14 @@ let button = document.querySelector("#searchButton")
button.addEventListener('click', async () => {
- let textInput = document.querySelector("#inputBar").value
let pokemonName = document.querySelector("#pokemonName")
let pokemonImage = document.querySelector("#pokemonImage")
-
+ //where does this need to be scoped?
+ let textInput = document.querySelector("#inputBar").value
+
//Axios call goes here
- //remember to use Await!
+ //remember to use Async and Await!
//DOM Setters go here
}
From 12e4c550b3db813fb276f6740b0030bcc6e3db36 Mon Sep 17 00:00:00 2001
From: Jeremy Taubman <56704648+taubman33@users.noreply.github.com>
Date: Tue, 16 May 2023 11:27:17 -0400
Subject: [PATCH 3/6] Update README.md
---
README.md | 7 +++++++
1 file changed, 7 insertions(+)
diff --git a/README.md b/README.md
index f9a26cc..2ce75d2 100644
--- a/README.md
+++ b/README.md
@@ -8,6 +8,8 @@ Lets first create an html file, attach in our JS Script file and the Axios libra
We can put in some empty HTML elements as well to populate with our response data, in this case just an H2 and an Image, but we can put in as much as we want once we get our calls made. Scaffold in a CSS file to add some style once the data is rendered on screen too!
+Explore the https://pokeapi.co/ API with ThunderClient to see what types of endpoints are available, and what your data will look like
+
You may need to Map through and run some conditionals for some peices of information (abilities, types...) if you want to put in additional peices of API data
```html
@@ -45,3 +47,8 @@ button.addEventListener('click', async () => {
```
+
+Once you have the initial data rendered, try to add as much as possible. We can search Pokemon by names and numbers, can we also search for Moves, Berries, and other information?
+
+
+Finally, this is a chance to really explore your styling skills. Be sure to create some wireframes to work with before creating something you can really show off, and have fun with!
From 3bc70cd5fc6d4acb1ed82c5701ceb72b20abc375 Mon Sep 17 00:00:00 2001
From: Jeremy Taubman <56704648+taubman33@users.noreply.github.com>
Date: Tue, 16 May 2023 11:37:53 -0400
Subject: [PATCH 4/6] Update README.md
---
README.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/README.md b/README.md
index 2ce75d2..e6a8189 100644
--- a/README.md
+++ b/README.md
@@ -44,7 +44,7 @@ button.addEventListener('click', async () => {
//DOM Setters go here
}
-
+)
```
From 51091eaaf48d6df6ffe2a40fd0e8a84092dbc6a8 Mon Sep 17 00:00:00 2001
From: chrischen
Date: Wed, 17 May 2023 06:01:08 -0700
Subject: [PATCH 5/6] unfinished
---
index.html | 35 +++++++++++++++++++++++++++++++
script.js | 60 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
style.css | 47 ++++++++++++++++++++++++++++++++++++++++++
3 files changed, 142 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..efb6d22
--- /dev/null
+++ b/index.html
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..7a820bf
--- /dev/null
+++ b/script.js
@@ -0,0 +1,60 @@
+console.log('working')
+let button = document.querySelector("#searchButton")
+
+button.addEventListener('click', async () => {
+
+ let pokemonName = document.querySelector("#pokemonName")
+ let pokemonImage = document.querySelector("#pokemonImage")
+ //where does this need to be scoped?
+ let textInput = document.querySelector("#inputBar").value
+ let name = document.getElementById('name')
+ let id = document.getElementById('id')
+ let height = document.getElementById('height')
+ let weight = document.getElementById('weight')
+ let base_experience = document.getElementById('base_experience')
+ let pokemonAbility = document.querySelector(".ability")
+ let pokemonMove = document.querySelector('.move')
+
+
+ //Axios call goes here
+ //remember to use Async and Await!
+ //DOM Setters go here
+ const pokemon = await axios.get(`https://pokeapi.co/api/v2/pokemon/${textInput}`)
+
+ //Name
+ pokemonName.innerText = pokemon.data.name
+
+ //Picture
+ let pic1 = ``
+ let pic2 = ``
+ let pic3 = ``
+ let pic4 = ``
+ pokemonImage.innerHTML = pic1 + pic2 + pic3 + pic4
+
+ //Basic info
+ id.innerText = `ID: ${pokemon.data.id}`
+ name.innerText = `Name: ${pokemon.data.name}`
+ height.innerText = `Height: ${pokemon.data.height}`
+ weight.innerText = `Weight: ${pokemon.data.weight}`
+
+ base_experience = `Base Experience: ${pokemon.data.base_experience}`
+
+ //Abilities
+ let abilitiesData= pokemon.data.abilities
+ let aTitle= `