obteniendo animaciones

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}

package.json

@@ -16,11 +16,14 @@
     "@babel/core": "^7.6.2",
     "@babel/plugin-transform-modules-commonjs": "^7.6.0",
     "babel-jest": "^27.0.1",
+    "chart.js": "^3.6.0",
     "eslint": "^7.12.1",
     "gh-pages": "^3.1.0",
     "htmlhint": "^0.15.1",
-    "jest": "^27.0.1",
     "opener": "^1.5.1",
     "serve": "^12.0.0"
+  },
+  "devDependencies": {
+    "jest": "^27.4.0"
   }
-}
+}

src/data.js

@@ -1,9 +1,175 @@
-// estas funciones son de ejemplo
 
-export const example = () => {
-  return 'example';
+//Filtro de people, vehiculo, locations para mostrar los items
+export const filterItems = (property, array) => {
+
+  if(property === ""){
+    return[]
+  }
+  let arrayItems= array.map((ele) => ele[property])
+  return arrayItems
 };
 
-export const anotherExample = () => {
-  return 'OMG';
+
+//Filtrar por directores
+export const filterDirector = (array, property ) => {
+  const arrayProperty = array.filter((arrayItem) =>  {
+    // eslint-disable-next-line no-undef
+    return arrayItem.director === property
+  });
+  return arrayProperty
 };
+
+
+//Filtrar por productores
+export const filterProducer = (array, property) => {
+  const arrayProperty = array.filter((arrayItem) =>  {
+    // eslint-disable-next-line no-undef
+    return arrayItem.producer === property
+  });
+  return arrayProperty
+};
+
+
+//Ordenar alfabticamente ascendente y descendente
+export const sortOrdenAlfabeticoAsc = (array) => {
+  const compareTitle = array.sort((a, b ) => {
+    if ( a.title.toLowerCase() < b.title.toLowerCase()){
+      return -1;
+    }
+    else {
+      return 0;
+    }
+})
+return compareTitle
+}
+
+
+export const sortOrdenAlfabeticoDesc = (array) => {
+  const compareTitle = array.sort((a, b ) => {
+    if ( a.title.toLowerCase() > b.title.toLowerCase()){
+      return -1;
+    }
+    else {
+      return 0;
+    }
+})
+return compareTitle
+}
+
+
+//Filtrar por Score  descendente
+export const sortOrdenNumericoDescScore = (array) => {
+  const compareNumber = array.sort((a, b) => {
+    return b.rt_score - a.rt_score;
+  });
+  return compareNumber
+}
+
+
+//Filtrar por Score ascendente
+export const sortOrdenNumericoAscScore = (array) => {
+  const compareNumber = array.sort((a, b) => {
+    return a.rt_score - b.rt_score;
+  });
+  return compareNumber
+} 
+
+//Filtrar por año de lanzamiento ascendente
+export const sortOrdenNumericoDescAñoLanz = (array) => {
+  const compareNumber = array.sort((a, b) => {
+    return b.release_date - a.release_date;
+  });
+  return compareNumber
+}
+
+//Filtrarpor año de lanzamiento descendente
+export const sortOrdenNumericoAscAñoLanz = (array) => {
+  const compareNumber = array.sort((a, b) => {
+    return a.release_date - b.release_date;
+  });
+  return compareNumber
+}
+
+   export const filterClima = (array,property) => { 
+    let sortArray = [];
+    for(let i=0; i<array.length;i++){
+      sortArray.push(array[i].locations)
+    }
+    const arrayProperty = sortArray.flat(2).filter((arrayItem)=> {
+     return arrayItem.climate=== property 
+  });
+      return arrayProperty
+    }
+
+
+export const filterTerreno = (array,property) => { 
+  let sortArray = [];
+  for(let i=0; i<array.length;i++){
+    sortArray.push(array[i].locations)
+  }
+  const arrayProperty = sortArray.flat(2).filter((arrayItem)=> {
+  return arrayItem.terrain === property 
+  });
+  return arrayProperty
+}
+
+
+export const filterGenero = (array,property) => { 
+  let sortArray = [];
+  for(let i=0; i<array.length;i++){
+    sortArray.push(array[i].people)
+  }
+  const arrayProperty = sortArray.flat(2).filter((arrayItem)=> {
+  return arrayItem.gender === property 
+  });
+  return arrayProperty
+}
+
+export const filterEspecie = (array,property) => { 
+  let sortArray = [];
+  for(let i=0; i<array.length;i++){
+    sortArray.push(array[i].people)
+  }
+  const arrayProperty = sortArray.flat(2).filter((arrayItem)=> {
+  return arrayItem.specie=== property 
+  });
+  return arrayProperty
+}
+
+export const filterVehiculo = (array,property) => { 
+  let sortArray = [];
+  for(let i=0; i<array.length;i++){
+    sortArray.push(array[i].vehicles)
+  }
+  const arrayProperty = sortArray.flat(2).filter((arrayItem)=> {
+  return arrayItem.vehicle_class=== property 
+  });
+  return arrayProperty
+}
+
+
+export const filterAge = (array, sliderValue) => {
+ let arrayPeople = array.map((el) => el.people);
+  const arrayAges = [];
+  arrayPeople.flat(1).forEach((p) => {
+    let edades= p.age;
+    if (edades.includes(sliderValue)){
+      arrayAges.push(p)
+    }
+  })
+  return arrayAges
+}
+
+
+export const inputSearch = (array,texto) => {
+  const arrayFilms = [ ];
+  array.forEach((film) => {
+    let textTitle = film.title.toLowerCase() ;
+      if (textTitle.includes(texto.toLowerCase())) {
+        arrayFilms.push(film)
+      }
+    })
+  return arrayFilms;
+    }
+
+

src/data/ghibli/ghibli.js

@@ -977,7 +977,7 @@ export default {
         {
           "id": "42f787d8-1fcb-4d3d-82f2-a74409869368",
           "name": "Seiji's House",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/a/a7/Mimi011.jpg",
+          "img": "http://1.bp.blogspot.com/-7Gp1L59g7w8/TwHmraTuHsI/AAAAAAAAAaA/E_8-eXv_KB0/s1600/%25E5%259C%25B0%25E7%2590%2583%25E5%25B1%258B.jpg",
           "climate": "Continental",
           "terrain": "City",
           "surface_water": "0",
@@ -1438,7 +1438,7 @@ export default {
         {
           "id": "a8bd9c03-7c80-4a97-b7c0-6a668acaf576",
           "name": "The Cat Kingdom",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/a/a9/Baron022.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/3/3c/CatKingdom.jpeg",
           "climate": "Continental",
           "terrain": "Plain",
           "surface_water": "30",
@@ -1497,7 +1497,7 @@ export default {
         {
           "id": "1287b275-6c32-4113-947f-519316d4a6be",
           "name": "Witch of the Waste",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/e/e1/Howls-moving-castle-disneyscreencaps.com-10507.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/3/3f/The_Witch.jpg",
           "gender": "Female",
           "age": "59",
           "eye_color": "Brown",
@@ -1527,7 +1527,7 @@ export default {
         {
           "id": "45237428-93bf-4dd6-97ce-f10647300429",
           "name": "Prince Justin or Turnip Head",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/d/d9/Prince_Justin.png",
+          "img": "https://static.wikia.nocookie.net/disney/images/e/ef/Howls-moving-castle-disneyscreencaps.com-13503.jpg",
           "gender": "Male",
           "age": "20-30",
           "eye_color": "Grey",
@@ -1848,7 +1848,7 @@ export default {
         {
           "id": "923d70c9-8f15-4972-ad53-0128b261d628",
           "name": "Sosuke's Boat",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/c/c1/PonyoS%C5%8DsukeBoat.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/b/b7/Sosuke_in_boat.png",
           "description": "A toy boat where Sosuke plays",
           "vehicle_class": "Boat",
           "length": "10",
@@ -1884,7 +1884,7 @@ export default {
           "name": "Sho (Shawn)",
           "img": "https://static.wikia.nocookie.net/studio-ghibli/images/0/04/Sho.jpg",
           "gender": "Male",
-          "age": "12-14",
+          "age": "12",
           "eye_color": "Brown",
           "hair_color": "Navy blue/black",
           "specie": "Human"
@@ -2330,7 +2330,7 @@ export default {
         {
           "id": "28d07ace-c309-48c6-b48e-ae2ece3a238c",
           "name": "Anna Sasaki",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/a/ae/Anna.png",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/2/29/Anna_Sasaki.jpg",
           "gender": "Female",
           "age": "12",
           "eye_color": "Blue",
@@ -2360,7 +2360,7 @@ export default {
         {
           "id": "66bca178-9920-4ec3-91e9-0d5b8a76dba1",
           "name": "Setsu Oiwa",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/6/6e/Setsu.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/7/78/Setsu_Ooiwa.jpg",
           "gender": "Female",
           "age": "50-60",
           "eye_color": "Dark brown",
@@ -2370,7 +2370,7 @@ export default {
         {
           "id": "5b8e4413-f943-40ba-8f9f-0ba059a401f0",
           "name": "Hisako",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/9/93/Hisako.png",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/6/61/Hisako.jpg",
           "gender": "Female",
           "age": "Elder",
           "eye_color": "Dark brown",
@@ -2400,7 +2400,7 @@ export default {
         {
           "id": "31b49ef6-ee60-4603-b983-e67fa0718aa9",
           "name": "Kiyomasa Ōiwa",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/d/d7/Kiyomasa.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/0/0f/Kiyomasa_Ooiwa.jpg",
           "gender": "Male",
           "age": "50-60",
           "eye_color": "Dark brown",
@@ -2410,7 +2410,7 @@ export default {
         {
           "id": "5d52d16f-ce72-41bd-8d88-436e206d9449",
           "name": "Doctor Yamashita",
-          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/8/8a/Yamashita.jpg",
+          "img": "https://static.wikia.nocookie.net/studio-ghibli/images/0/08/Doctor_Yamashita.jpg",
           "gender": "Male",
           "age": "Adult",
           "eye_color": "Black",