Updated homework

Adding functionality to handle cases in user inputs. Added responsiveness to css.
foocoding · Catsudemo · Jun 16, 2019 · Jun 19, 2019 · Jun 22, 2019 · Jun 22, 2019
commit cca1a162a524d818bf96e834ee4ef3a1e40eb8e4
diff --git a/Week2/homework/pokemon/poke-sprites.js b/Week2/homework/pokemon/poke-sprites.js
@@ -5,21 +5,22 @@
   (simulates calling a server to retrieve data)
 */
 var name = window.prompt('Enter your name:');
-var color = window.prompt('Choose fire, water or grass.');
+var color = window.prompt('Choose fire, water or grass or take a risk');
 
 function fetchPokemonData(type) {
-  if (type == 'fire') {
+  if (type == 'Fire' || type == 'fire') {
     return `{"abilities": [{"ability": {"name": "solar-power","url": "https://pokeapi.co/api/v2/ability/94/"},"is_hidden": true,"slot": 3},{"ability": {"name": "blaze","url": "https://pokeapi.co/api/v2/ability/66/" },"is_hidden": false,"slot": 1}],"base_experience": 62,"forms": [{"name": "charmander","url": "https://pokeapi.co/api/v2/pokemon-form/4/"}], "height": 6,"held_items": [],"id": 4,"is_default": true,"location_area_encounters": "https://pokeapi.co/api/v2/pokemon/4/encounters","order": 5,"species": {"name": "charmander", "url": "https://pokeapi.co/api/v2/pokemon-species/4/"},"sprites": {"back_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/4.png","back_female": null,"back_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/shiny/4.png","back_shiny_female": null,"front_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/4.png","front_female": null,"front_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/4.png","front_shiny_female": null}}`;
-  }
-  if (type == 'water') {
+  } else if (type == 'water' || type == 'Water') {
     return `{"abilities":[{"ability":{"name":"rain-dish","url":"https://pokeapi.co/api/v2/ability/44/"},"is_hidden":true,"slot":3},{"ability":{"name":"torrent","url":"https://pokeapi.co/api/v2/ability/67/"},"is_hidden":false,"slot":1}],"base_experience":63,"forms":[{"name":"squirtle","url":"https://pokeapi.co/api/v2/pokemon-form/7/"}],"height":5,"held_items":[],"id":7,"is_default":true,"location_area_encounters":"https://pokeapi.co/api/v2/pokemon/7/encounters","name":"squirtle","order":10,"species":{"name":"squirtle","url":"https://pokeapi.co/api/v2/pokemon-species/7/"},"sprites":{"back_default":"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/7.png","back_female":null,"back_shiny":"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/shiny/7.png","back_shiny_female":null,"front_default":"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/7.png","front_female":null,"front_shiny":"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/7.png","front_shiny_female":null},"stats":[{"base_stat":43,"effort":0,"stat":{"name":"speed","url":"https://pokeapi.co/api/v2/stat/6/"}},{"base_stat":64,"effort":0,"stat":{"name":"special-defense","url":"https://pokeapi.co/api/v2/stat/5/"}},{"base_stat":50,"effort":0,"stat":{"name":"special-attack","url":"https://pokeapi.co/api/v2/stat/4/"}},{"base_stat":65,"effort":1,"stat":{"name":"defense","url":"https://pokeapi.co/api/v2/stat/3/"}},{"base_stat":48,"effort":0,"stat":{"name":"attack","url":"https://pokeapi.co/api/v2/stat/2/"}},{"base_stat":44,"effort":0,"stat":{"name":"hp","url":"https://pokeapi.co/api/v2/stat/1/"}}],"types":[{"slot":1,"type":{"name":"water","url":"https://pokeapi.co/api/v2/type/11/"}}],"weight":90}`;
-  }
-  if (type == 'grass') {
+  } else if (type == 'grass' || type == 'Grass') {
     return `{"abilities": [{"ability": {"name": "chlorophyll","url": "https://pokeapi.co/api/v2/ability/34/"},"is_hidden": true,"slot": 3},{"ability": {"name": "overgrow","url": "https://pokeapi.co/api/v2/ability/65/"},"is_hidden": false,"slot": 1}],"base_experience": 64,"forms": [ {"name": "bulbasaur","url": "https://pokeapi.co/api/v2/pokemon-form/1/"}],"name": "bulbasaur","order": 1,"species": {"name": "bulbasaur","url": "https://pokeapi.co/api/v2/pokemon-species/1/"},"sprites": {"back_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/1.png","back_female": null,"back_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/shiny/1.png","back_shiny_female": null,"front_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/1.png","front_female": null,"front_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png","front_shiny_female": null},"weight": 69}`;
+  } else {
+    return `{"abilities": [{"ability": {"name": "shapeshift","url": "https://pokeapi.co/api/v2/ability/34/"},"is_hidden": true,"slot": 3},{"ability": {"name": "overgrow","url": "https://pokeapi.co/api/v2/ability/65/"},"is_hidden": false,"slot": 1}],"base_experience": 64,"forms": [ {"name": "ditto","url": "https://pokeapi.co/api/v2/pokemon-form/1/"}],"name": "ditto","order": 1,"species": {"name": "ditto","url": "https://pokeapi.co/api/v2/pokemon-species/1/"},"sprites": {"back_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/132.png","back_female": null,"back_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/back/shiny/132.png","back_shiny_female": null,"front_default": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/132.png","front_female": null, "front_shiny": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/132.png", "front_shiny_female": null},"weight": 69}`;
   }
 }
 
 function pokemonName(type) {
+  type = type.toLowerCase();
   if (type == 'fire') {
     return 'Charmander';
   }
@@ -28,11 +29,12 @@ function pokemonName(type) {
   }
   if (type == 'grass') {
     return 'Bulbasaur';
+  } else {
+    return "...Oh! It seems that was actually a Ditto! Well I'm sure it";
   }
 }
 
 let pokeName = pokemonName(color);
-/*Code goes below */
 
 function parsemon() {
   let pokeProperties = JSON.parse(fetchPokemonData(color));

diff --git a/Week2/homework/pokemon/pokemon.css b/Week2/homework/pokemon/pokemon.css
@@ -64,13 +64,14 @@ section {
   color: #c6c5b9;
   border-radius: 5px;
   font-size: 100%;
+  width: 25%;
   max-width: 400px;
   min-height: 200px;
 }
 
 img {
-  width: auto;
-  height: 150px;
+  width: 300%;
+  height: auto;
   padding: 10px;
   margin: 10px;
 }
@@ -81,17 +82,38 @@ img {
 }
 
 @media screen and (max-width: 600px) {
+  .wrapper {
+    display: grid;
+    align-items: center;
+    grid-template-columns: 1fr;
+  }
   img {
-    display: none;
+    width: auto;
+    height: 80px;
+    padding: 5px;
+    margin: 5px;
+    ;
   }
-  @media only screen and (max-width: 800px) {
-    .wrapper {
-      display: grid;
-      align-items: center;
-      grid-template-columns: 1fr 1fr;
-    }
-    .box {
-      height: 400px;
-    }
+  #oakImage {
+    float: left;
+    min-height: 200px;
+    width: auto;
   }
 }
+
+@media only screen and (max-width: 800px) {
+  .wrapper {
+    display: grid;
+    align-items: center;
+    grid-template-columns: 1fr 1fr;
+  }
+  .box {
+    height: 400px;
+  }
+  #oakSide {
+    float: left;
+  }
+  #oakImage {
+    display: none;
+  }
+}