Laboratoria · AivyAguiPo · Jun 22, 2023 · Jun 22, 2023 · Jun 23, 2023 · Jun 23, 2023
diff --git a/Prototipo.drawio.png b/Prototipo.drawio.png
diff --git a/README.md b/README.md
diff --git a/image-1.png b/image-1.png
diff --git a/image-2.png b/image-2.png
diff --git a/image-3.png b/image-3.png
diff --git a/image-4.png b/image-4.png
diff --git a/image-5.png b/image-5.png
diff --git a/image-6.png b/image-6.png
diff --git a/image-7.png b/image-7.png
diff --git a/image-8.png b/image-8.png
diff --git a/image.png b/image.png
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "htmlhint": "htmlhint src/*.html test/*.html",
     "eslint": "eslint --ext .js src/ test/",
-    "pretest": "npm run eslint && npm run htmlhint",
+    "pretest": "npm run eslint && npm run htmlhint" ,
     "test": "jest --verbose --coverage",
     "open-coverage-report": "opener ./coverage/lcov-report/index.html",
     "start": "serve src/",

diff --git a/prototipo_alta.png b/prototipo_alta.png
diff --git a/src/data.js b/src/data.js
@@ -1,9 +1,81 @@
-// estas funciones son de ejemplo
-
-export const example = () => {
-  return 'example';
+export const sortName = (arr, option) => {
+  arr.sort((a, b) => {
+    if (option === "az") {
+      return a.name.localeCompare(b.name);
+    }
+    if (option === "za") {
+      return b.name.localeCompare(a.name); 
+    }
+  });
+  return arr;
 };
+// local comapare hace la misma funcion que <>, solo que local comapre corre mejor con el testt.
+export const sortNum = (arr, option) => {
+  arr.sort((a, b) => {
+    if (option === "numberMenor") {
+      return a.num - b.num;
+    }
+    else if (option === "numberMayor") {
+      return b.num - a.num;
+    }
+  });
+  return arr;
+}
+
+
+
+//filtro por nombre
+export function resultName(arr, filterName) {
+  const results = arr.filter(element => {
+    return (element.name).indexOf(filterName) !== -1
+  });
+  return results
+}
+
+/* -----> calculo agregado de tipos, average= promedio <------- */
+
+// 1 ) Primero saber los diferentes tipos de pokemon 
+// cada pokemon puede contener varios tipos ejemplo :  [aqua, fire, grass]
+
+//1.1 ) unir todos los tipos de todos los pokemones 
+
+export function concatType(data) {
+  const result = []
+  data.forEach(element => {
+    element.type.forEach(type => {
+      result.push(type)
+    })
+  });
+  return result
+}
+
+// 1.2 ) quitar los tipos repetidos , con eso tendriamos solo los tipos unicos que existen en todos los pokemones 
+
+export function deleteDuplicate(arrDuplicates) {
+  return arrDuplicates.filter((valor, indice) => {
+    return arrDuplicates.indexOf(valor) === indice;
+  })
+
+}
+
+// 2)contar cuantos pokemones hay por cada tipo de pokemon y calcular su promedio 
+export function promPokemonEveryType(data) {
+  const pokemonTypesDuplicates = concatType(data)
+  const onlyUniqueTypes = deleteDuplicate(pokemonTypesDuplicates)
+  const result = {}
+  onlyUniqueTypes.forEach(typePokemon => {
+    let count = 0;
+
+    data.forEach(pokemon => {
+      if ((pokemon.type).includes(typePokemon)) {
+        count = count + 1;
+      }
+    })
+    result[typePokemon] = ((count * 100) / pokemonTypesDuplicates.length).toFixed(2)
+    count = 0
+  })
+
+  return result
+}
+
 
-export const anotherExample = () => {
-  return 'OMG';
-};
diff --git a/src/data/pokemon/README.md b/src/data/pokemon/README.md
@@ -1,37 +1,110 @@
-# Pokémon
-
-Pokémon GO es una experiencia de juego internacional que cuenta con más de mil
-millones de descargas y ha sido nombrada "el mejor juego para móviles" por
-Game Developers Choice Awards y "la mejor aplicación del año" por TechCrunch
-(tomado de Google Play). Los usuarios del juego se convierten en "Maestros/
-entrenadores de Pokémon" y pueden:
-
-- **Descubrir el mundo Pokémon:** explorar y descubrir nuevos Pokémon allá
-  donde vayan.
-- **Atrapar** distintos Pokémon para completar su Pokédex.
-- **Pelear** contra Pokémon de otros entrenadores y conquistar un gimnasio.
-- **Competir** en épicos combates contra otros entrenadores.
-- **Hacer equipo** con otros entrenadores para atrapar poderosos Pokémon
-  durante las incursiones.
-
-## Hallazgos
-
-Para entender mejor qué necesidades complementarias a la app tienen los
-usuarios, hicimos una rápida investigación (research) y estos son algunos
-de los hallazgos.
-
-- Los Pokémon tienen características únicas que determinan las decisiones que
-  toma el usuario (tipo, debilidad, peso, multiplicador, etc.)
-- Un maestro Pokémon antes de salir a casar los Pokémon tienen que:
-  saber el top 10 de frecuencia de aparición de los Pokémon.
-- Los Pokémon tienen distintos tipos y debilidades de combate. Estas
-  características son importantes cuando un maestro Pokémon elige al Pokémon
-  más adecuado para su batalla. Hay veces que tiene que elegir a los que
-  tienen menos cantidad de debilidades y saber de que tipo son. Por ello, es
-  importante para un maestro Pokémon poder ordenarlos por estas 2
-  características.
-- Los Pokémon evolucionan y es importante para un
-  maestro Pokémon saber cuántas y cuáles son las evoluciones que tienen antes y
-  después.
-- Los Pokémon se alimentan de caramelos y un maestro Pokémon necesita saber
-  cuántos caramelos necesita un Pokémon para evolucionar.
+
+# Pokemón go! 
+
+
+¡Bienvenido a nuestro sitio web dedicado a Pokémon GO!
+
+*Descripción general*
+
+En nuestro sitio web, te sumergirás en el emocionante mundo de Pokémon GO, el juego de realidad aumentada que te permite capturar, entrenar y batallar con tus Pokémon favoritos en el mundo real.
+
+Explora nuestra extensa base de datos de Pokémon, donde podrás encontrar información detallada sobre cada especie, incluyendo su número, evoluciones, generación y descripción.
+
+
+*Funcionalidades:*
+
+- Permite ordenar la data de manera ascendente y decentente por letras y números, es decir, de la A-Z, de la Z-A, del número mayor al número menor y del número mayor al número menor. 
+
+- Permite buscar los nombres por su nombre. 
+
+- calcula el valor agregado de los pokemones mediande un porcentaje (promedio).
+
+- Muestra la data completa de los pokemones, con su nombre, número, tipo, generación, tamaño, peso y descripción. 
+
+
+*Guia de uso:*
+
+La página de Pokemón go, es de fácil uso, solo deberas hacer "click" en la barra de navegacion para encontrar a los pokemones ordenados y escribir en la barra del buscarcor para encontrar a tu Pokemón.
+
+Podrás encontral la página web de  "Pokemón go" con este link: http://localhost:3000/ 
+
+*Preguntas generales*
+
+- ¿Quiénes son los principales usuarios de producto?
+
+Los principales usuarios de esta aplicacion, son personas de un rango de edad de  12-26 años, que crean una comunidad entre si, para atrapar y buscar pokemones.
+
+Pokémon Go también ha atraído a muchos jugadores adultos, incluidos los fanáticos de Pokémon de larga data. Muchos adultos disfrutan de revivir la nostalgia de su infancia yendo tras los Pokémon y compitiendo en gimnasios.
+
+Es importante tener en cuenta que esta lista no es exhaustiva y que Pokémon Go ha atraído a una amplia gama de usuarios con diferentes intereses y motivaciones. El juego ha logrado una amplia popularidad y ha mantenido una base de jugadores activos desde su lanzamiento
+
+
+
+- ¿Cuáles son los objetivos de estos usuarios en relación con el producto?
+
+Uno de los principales objetivos para muchos usuarios de Pokémon Go es completar su Pokédex, que es una colección de todos los Pokémon disponibles en el juego. Los jugadores se esfuerzan por atrapar la mayor cantidad posible de Pokémon para completar su colección.
+
+Uno de los aspectos distintivos es su enfoque en la realidad aumentada y la exploración del mundo real. Los jugadores se motivan a salir y explorar su entorno en busca de Pokémon, Poképaradas y gimnasios. El juego fomenta el ejercicio físico y la interacción con lugares de interés en el mundo real.
+
+
+
+- ¿Cuáles son los datos más relevantes que quieren ver en la interfaz y por qué?
+
+Los datos mas relevantes que desean ver los usuarios son las evoluciones por tipo.
+
+La presentación clara y accesible de esta información les ayuda a tomar decisiones informadas mientras juegan y a aprovechar al máximo su experiencia en el juego.
+
+
+
+- ¿Cuándo utilizan o utilizarían el producto?
+
+Cuando deseen hacer comparaciones y conocer mas a detalle los pokemones de la generacion I y II.
+
+Con una descripcion detallada de los pokemones los usuarios sabran cual y cuando usar, o atrapar.
+
+*historias de usuari@s*
+
+- Historia 1:
+Como: usari@
+
+Quiero:  Conocer la cantidad de pokemones que hay en la  generación I y II.
+
+Para: saber la diversidad de los diferentes pokemones.
+
+- Historia 2:
+Como: usuari@ de entre 12-26 años
+
+Quiero: buscar a los pokemos por su nombre en tiempo real, es decir, mientras vaya tecleando vayan saliendo los diferentes pokemones que existan, hasta llegar al que deseo.
+
+Para: poder visualizar solo al pokemon que busque, y obsevar mejor sus caracteristicas y evoluciones.
+
+- Historia 3: 
+Como: usuari@
+
+Quiero: poder filtrar los pokemones en orden ascendente y decendente, ya sea por letras o numeros.
+
+Para: ordenarlos y poder clasificarlos.
+
+- historias 4: 
+Como: nuevo usuari@
+
+Quiero: ver el promedio total de los tipos de pokemones, es decir, por cada tipo deseo ver el porcentaje de pokemones hay.
+
+Para: conocer el tipo de pokemon predominante.
+
+*Cómo la página web resuelve las historias de usuari@s?*
+
+Creamos una página web sencilla, pero que cumpla con todos los requisitos visiuales, para que el usuario pueda tener una interacción eficaz en la web. Enfocandonos en las historias de usuari@s, y poder dar respuesta a las necesitadades dadas. 
+
+ *Proceso de diseño*
+ - Dimos respuesta a las preguntas generales.
+ - Creamos 4 historias de usuarios.
+ - Creamos un prototipo de baja fidelidad, como boceto. 
+ - Creamos un prototipo de alta fidelidad, donde pautamos como deseabamos que se viera nuestra web de una manera dinamica.
+ - Utilizamos javaScript vanilla, para poder crear una pagina completamente dinamica, conjunto al html semantico, test de prueba, y css. 
+
+Desafios:
+- 
+ - Al momento de crear los test, tuvimos que refacturizar las funciones, ya que muchas de ellas eran redundantes. 
+ - Notamos que debiamos indicarle a test como entrar al array de objetos, para ellos creamos nuevas constantes para que pudiera analizar correctamente. 
+ - Concluimos que es mejor ir creando las funciones y los test a la par, ya que asi aseguramos que las funciones cumplan con el onjetivo desde el incio. 
diff --git a/src/data/pokemon/README.pt.md b/src/data/pokemon/README.pt.md
@@ -1,33 +1,110 @@
-# Pokémon
-
-Pokémon GO é uma experiência de jogo internacional que tem mais de um bilhão de
-downloads e foi nomeado "o melhor jogo para celular" pelo Game Developers Choice
-Awards e "a melhor aplicação do ano" pelo TechCrunch (extraído do Google Play).
-Os usuários do jogo se tornam "Mestres/ treinadores Pokémons" e podem:
-
-- **Descobrir o mundo Pokémon:** explorar e descobrir novos Pokémon onde quer
-  que estejam.
-- **Pegar** diferentes Pokémon para completar seu Pokédex.
-- **Lutar** contra Pokémon de outros treinadores e conquiste ginásios.
-- **Competir** em batalhas épicas contra outros treinadores.
-- **Juntar-se** a outros treinadores para capturar Pokémon poderosos durante os
-  ataques.
-
-## Constatações
-
-Para entender melhor as necessidades complementares dos usuários do aplicativo,
-fizemos uma investigação rápida (pesquisa) e estas são algumas das descobertas.
-
-- Os Pokémons têm características únicas que determinam as decisões tomadas pelo
-  usuário (tipo, fraqueza, peso, multiplicador, etc.).
-- Um mestre Pokémon antes de sair para caçar os Pokémons tem que conhecer os 10
-  principais Pokémons que aparecem com mais frequência.
-- Os Pokémons têm diferentes tipos e fraquezas em combate. Estas características
-  são importantes na escolha do Pokémon mais adequado para sua batalha. Às
-  vezes, você tem que escolher aqueles com menos fraquezas e saber de que tipo
-  eles são. Portanto, é importante que um mestre de Pokémon seja capaz de
-  ordená-los por essas 2 características.
-- Os Pokémons evoluem e é importante para um mestre Pokémon saber quantas e
-  quais evoluções eles têm antes e depois.
-- Pokémon comem _candies_ e um mestre Pokémon precisa saber quantos _candies_ um
-  Pokémon precisa para evoluir.
+
+# Pokemón go! 
+
+
+¡Bienvenido a nuestro sitio web dedicado a Pokémon GO!
+
+*Descripción general*
+
+En nuestro sitio web, te sumergirás en el emocionante mundo de Pokémon GO, el juego de realidad aumentada que te permite capturar, entrenar y batallar con tus Pokémon favoritos en el mundo real.
+
+Explora nuestra extensa base de datos de Pokémon, donde podrás encontrar información detallada sobre cada especie, incluyendo su número, evoluciones, generación y descripción.
+
+
+*Funcionalidades:*
+
+- Permite ordenar la data de manera ascendente y decentente por letras y números, es decir, de la A-Z, de la Z-A, del número mayor al número menor y del número mayor al número menor. 
+
+- Permite buscar los nombres por su nombre. 
+
+- calcula el valor agregado de los pokemones mediande un porcentaje (promedio).
+
+- Muestra la data completa de los pokemones, con su nombre, número, tipo, generación, tamaño, peso y descripción. 
+
+
+*Guia de uso:*
+
+La página de Pokemón go, es de fácil uso, solo deberas hacer "click" en la barra de navegacion para encontrar a los pokemones ordenados y escribir en la barra del buscarcor para encontrar a tu Pokemón.
+
+Podrás encontral la página web de  "Pokemón go" con este link: http://localhost:3000/ 
+
+*Preguntas generales*
+
+- ¿Quiénes son los principales usuarios de producto?
+
+Los principales usuarios de esta aplicacion, son personas de un rango de edad de  12-26 años, que crean una comunidad entre si, para atrapar y buscar pokemones.
+
+Pokémon Go también ha atraído a muchos jugadores adultos, incluidos los fanáticos de Pokémon de larga data. Muchos adultos disfrutan de revivir la nostalgia de su infancia yendo tras los Pokémon y compitiendo en gimnasios.
+
+Es importante tener en cuenta que esta lista no es exhaustiva y que Pokémon Go ha atraído a una amplia gama de usuarios con diferentes intereses y motivaciones. El juego ha logrado una amplia popularidad y ha mantenido una base de jugadores activos desde su lanzamiento
+
+
+
+- ¿Cuáles son los objetivos de estos usuarios en relación con el producto?
+
+Uno de los principales objetivos para muchos usuarios de Pokémon Go es completar su Pokédex, que es una colección de todos los Pokémon disponibles en el juego. Los jugadores se esfuerzan por atrapar la mayor cantidad posible de Pokémon para completar su colección.
+
+Uno de los aspectos distintivos es su enfoque en la realidad aumentada y la exploración del mundo real. Los jugadores se motivan a salir y explorar su entorno en busca de Pokémon, Poképaradas y gimnasios. El juego fomenta el ejercicio físico y la interacción con lugares de interés en el mundo real.
+
+
+
+- ¿Cuáles son los datos más relevantes que quieren ver en la interfaz y por qué?
+
+Los datos mas relevantes que desean ver los usuarios son las evoluciones por tipo.
+
+La presentación clara y accesible de esta información les ayuda a tomar decisiones informadas mientras juegan y a aprovechar al máximo su experiencia en el juego.
+
+
+
+- ¿Cuándo utilizan o utilizarían el producto?
+
+Cuando deseen hacer comparaciones y conocer mas a detalle los pokemones de la generacion I y II.
+
+Con una descripcion detallada de los pokemones los usuarios sabran cual y cuando usar, o atrapar.
+
+*historias de usuari@s*
+
+- Historia 1:
+Como: usari@
+
+Quiero:  Conocer la cantidad de pokemones que hay en la  generación I y II.
+
+Para: saber la diversidad de los diferentes pokemones.
+
+- Historia 2:
+Como: usuari@ de entre 12-26 años
+
+Quiero: buscar a los pokemos por su nombre en tiempo real, es decir, mientras vaya tecleando vayan saliendo los diferentes pokemones que existan, hasta llegar al que deseo.
+
+Para: poder visualizar solo al pokemon que busque, y obsevar mejor sus caracteristicas y evoluciones.
+
+- Historia 3: 
+Como: usuari@
+
+Quiero: poder filtrar los pokemones en orden ascendente y decendente, ya sea por letras o numeros.
+
+Para: ordenarlos y poder clasificarlos.
+
+- historias 4: 
+Como: nuevo usuari@
+
+Quiero: ver el promedio total de los tipos de pokemones, es decir, por cada tipo deseo ver el porcentaje de pokemones hay.
+
+Para: conocer el tipo de pokemon predominante.
+
+*Cómo la página web resuelve las historias de usuari@s?*
+
+Creamos una página web sencilla, pero que cumpla con todos los requisitos visiuales, para que el usuario pueda tener una interacción eficaz en la web. Enfocandonos en las historias de usuari@s, y poder dar respuesta a las necesitadades dadas. 
+
+ *Proceso de diseño*
+ - Dimos respuesta a las preguntas generales.
+ - Creamos 4 historias de usuarios.
+ - Creamos un prototipo de baja fidelidad, como boceto. 
+ - Creamos un prototipo de alta fidelidad, donde pautamos como deseabamos que se viera nuestra web de una manera dinamica.
+ - Utilizamos javaScript vanilla, para poder crear una pagina completamente dinamica, conjunto al html semantico, test de prueba, y css. 
+
+Desafios:
+- 
+ - Al momento de crear los test, tuvimos que refacturizar las funciones, ya que muchas de ellas eran redundantes. 
+ - Notamos que debiamos indicarle a test como entrar al array de objetos, para ellos creamos nuevas constantes para que pudiera analizar correctamente. 
+ - Concluimos que es mejor ir creando las funciones y los test a la par, ya que asi aseguramos que las funciones cumplan con el onjetivo desde el incio.