Browse Source

Eliminacion de los titulos en el header, imagenes correspondientes en pagina de Quiz

ryanbarreto1 2 years ago
parent
commit
51f2b2d455

+ 10
- 1
src/data/BioInfo.ts View File

16
 
16
 
17
 export const getMessages = () => ListBio;
17
 export const getMessages = () => ListBio;
18
 
18
 
19
-export const getMessage = (id: number) => ListBio.find(m => m.id === id);
19
+export const getMessage = (id: number) => ListBio.find(m => m.id === id);
20
+
21
+export function getBioInfoPhoto (id: number) {
22
+    const bio = ListBio.find(bio => bio.id === id);
23
+
24
+    if (bio) {
25
+        return bio.photo;
26
+    }
27
+    return undefined;
28
+}

+ 2
- 2
src/data/Biograph.json View File

1
 [
1
 [
2
     {
2
     {
3
         "id": 1,
3
         "id": 1,
4
-        "title": "Roberto Clemente",
4
+        "title": "Roberto Clemente Walker",
5
         "tags": "Pelotero, Filántropo",
5
         "tags": "Pelotero, Filántropo",
6
         "birth": "Nació: 1934",
6
         "birth": "Nació: 1934",
7
         "place": "Lugar: San Antón, Carolina",
7
         "place": "Lugar: San Antón, Carolina",
118
     },
118
     },
119
     {
119
     {
120
         "id": 10,
120
         "id": 10,
121
-        "title": "Marian Villaronga Toro",
121
+        "title": "Mariano Villaronga Toro",
122
         "tags": "Educador, Funcionario público",
122
         "tags": "Educador, Funcionario público",
123
         "birth": "Nació: ",
123
         "birth": "Nació: ",
124
         "place": "Lugar: ",
124
         "place": "Lugar: ",

+ 22
- 1
src/data/Quizzes.json View File

1
 [
1
 [
2
     {
2
     {
3
         "id": 1,
3
         "id": 1,
4
-        "title": "Roberto Clemente",
4
+        "title": "Roberto Clemente Walker",
5
 
5
 
6
         "pregunta1": "¿En que año nació Roberto Clemente?",
6
         "pregunta1": "¿En que año nació Roberto Clemente?",
7
         "res1":["1934","1950","1943","2022"],
7
         "res1":["1934","1950","1943","2022"],
189
         "res4": ["41","42","43","44"],
189
         "res4": ["41","42","43","44"],
190
         "correcta4":"44"
190
         "correcta4":"44"
191
     }
191
     }
192
+    ,
193
+    {
194
+        "id":10,
195
+        "title": "Mariano Villaronga Toro",
196
+
197
+        "pregunta1": "Mariano1",
198
+        "res1": ["11","12","13","14"],
199
+        "correcta1":"11",
200
+
201
+        "pregunta2": "Mariano2",
202
+        "res2": ["21","22","23","24"],
203
+        "correcta2":"22",
204
+
205
+        "pregunta3": "Mariano3",
206
+        "res3": ["31","32","33","34"],
207
+        "correcta3":"33",
208
+
209
+        "pregunta4": "Mariano4",
210
+        "res4": ["41","42","43","44"],
211
+        "correcta4":"44"
212
+    }
192
 ]
213
 ]

+ 1
- 2
src/pages/AboutUs.tsx View File

2
   IonImg,
2
   IonImg,
3
   IonContent,
3
   IonContent,
4
   IonHeader,
4
   IonHeader,
5
-  IonTitle,
6
   IonPage,
5
   IonPage,
7
   IonToolbar,
6
   IonToolbar,
8
   IonFooter,
7
   IonFooter,
27
               <IonCol></IonCol>
26
               <IonCol></IonCol>
28
               <IonCol>
27
               <IonCol>
29
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
28
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
30
-                <IonTitle>Más sobre nosotros</IonTitle>
29
+                
31
               </IonCol>
30
               </IonCol>
32
               <IonCol></IonCol>
31
               <IonCol></IonCol>
33
             </IonRow>
32
             </IonRow>

+ 1
- 2
src/pages/Biography.tsx View File

2
     IonPage,
2
     IonPage,
3
     IonContent,
3
     IonContent,
4
     IonHeader,
4
     IonHeader,
5
-    IonTitle,
6
     IonToolbar,
5
     IonToolbar,
7
     IonFooter,
6
     IonFooter,
8
     IonImg,
7
     IonImg,
40
                             <IonCol></IonCol>
39
                             <IonCol></IonCol>
41
                             <IonCol>
40
                             <IonCol>
42
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
41
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
43
-                                <IonTitle>Biografía</IonTitle>
42
+                                
44
                             </IonCol>
43
                             </IonCol>
45
                             <IonCol></IonCol>
44
                             <IonCol></IonCol>
46
                         </IonRow>
45
                         </IonRow>

+ 1
- 2
src/pages/Capsule.tsx View File

2
     IonPage,
2
     IonPage,
3
     IonContent,
3
     IonContent,
4
     IonHeader,
4
     IonHeader,
5
-    IonTitle,
6
     IonToolbar,
5
     IonToolbar,
7
     IonFooter,
6
     IonFooter,
8
     IonImg,
7
     IonImg,
41
                             <IonCol></IonCol>
40
                             <IonCol></IonCol>
42
                             <IonCol>
41
                             <IonCol>
43
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
42
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
44
-                                <IonTitle>Cápsula</IonTitle>
43
+                                
45
                             </IonCol>
44
                             </IonCol>
46
                             <IonCol></IonCol>
45
                             <IonCol></IonCol>
47
                         </IonRow>
46
                         </IonRow>

+ 1
- 2
src/pages/HomePage.tsx View File

2
   IonContent,
2
   IonContent,
3
   IonHeader,
3
   IonHeader,
4
   IonPage,
4
   IonPage,
5
-  IonTitle,
6
   IonToolbar,
5
   IonToolbar,
7
   IonCard,
6
   IonCard,
8
   IonCardHeader,
7
   IonCardHeader,
33
               <IonCol></IonCol>
32
               <IonCol></IonCol>
34
               <IonCol>
33
               <IonCol>
35
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
34
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
36
-                <IonTitle>Hogar</IonTitle>
35
+                
37
               </IonCol>
36
               </IonCol>
38
               <IonCol></IonCol>
37
               <IonCol></IonCol>
39
             </IonRow>
38
             </IonRow>

+ 1
- 2
src/pages/ListBiographies.tsx View File

3
   IonContent,
3
   IonContent,
4
   IonHeader,
4
   IonHeader,
5
   IonPage,
5
   IonPage,
6
-  IonTitle,
7
   IonToolbar,
6
   IonToolbar,
8
   IonFooter,
7
   IonFooter,
9
   IonGrid,
8
   IonGrid,
26
               <IonCol></IonCol>
25
               <IonCol></IonCol>
27
               <IonCol>
26
               <IonCol>
28
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
27
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
29
-                <IonTitle>Lista de Biografías</IonTitle>
28
+                
30
               </IonCol>
29
               </IonCol>
31
               <IonCol></IonCol>
30
               <IonCol></IonCol>
32
             </IonRow>
31
             </IonRow>

+ 1
- 2
src/pages/ListCapsules.tsx View File

3
   IonContent,
3
   IonContent,
4
   IonHeader,
4
   IonHeader,
5
   IonPage,
5
   IonPage,
6
-  IonTitle,
7
   IonToolbar,
6
   IonToolbar,
8
   IonFooter,
7
   IonFooter,
9
   IonGrid,
8
   IonGrid,
26
               <IonCol></IonCol>
25
               <IonCol></IonCol>
27
               <IonCol>
26
               <IonCol>
28
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
27
                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
29
-                <IonTitle>Lista de Cápsulas de Contenido</IonTitle>
28
+                
30
               </IonCol>
29
               </IonCol>
31
               <IonCol></IonCol>
30
               <IonCol></IonCol>
32
             </IonRow>
31
             </IonRow>

+ 8
- 6
src/pages/Questions.tsx View File

2
     IonPage,
2
     IonPage,
3
     IonContent,
3
     IonContent,
4
     IonHeader,
4
     IonHeader,
5
-    IonTitle,
6
     IonToolbar,
5
     IonToolbar,
7
     IonFooter,
6
     IonFooter,
8
     IonImg,
7
     IonImg,
30
 import React, { useState } from 'react';
29
 import React, { useState } from 'react';
31
 import './Questions.css';
30
 import './Questions.css';
32
 import EnciclopediaPR from '../assets/EnciclopediaPR.png';
31
 import EnciclopediaPR from '../assets/EnciclopediaPR.png';
33
-import RobertoClemente from '../assets/RobertoClemente.jpg';
34
 import { QuizInfo, getQuiz } from '../data/QuizInfo';
32
 import { QuizInfo, getQuiz } from '../data/QuizInfo';
33
+import { getBioInfoPhoto } from '../data/BioInfo';
35
 import { thumbsDown, thumbsUp } from 'ionicons/icons';
34
 import { thumbsDown, thumbsUp } from 'ionicons/icons';
36
 
35
 
37
 
36
 
80
         ThumbsDowmn para seleccion incorrecta.
79
         ThumbsDowmn para seleccion incorrecta.
81
     */
80
     */
82
     const verificarRes = () => {
81
     const verificarRes = () => {
83
-        // borrar console logs para el release
82
+        /* borrar console logs para el release
84
         console.log([qres1, qres2, qres3, qres4]);
83
         console.log([qres1, qres2, qres3, qres4]);
85
-        console.log(countres);
84
+        console.log(countres);*/
86
 
85
 
87
         // reset a los icons, count por si hubo seleccion anterior
86
         // reset a los icons, count por si hubo seleccion anterior
88
         let count = 0;
87
         let count = 0;
317
     const [quizInfo, setQuiz] = useState<QuizInfo>();
316
     const [quizInfo, setQuiz] = useState<QuizInfo>();
318
     const params = useParams<{ id: string }>();
317
     const params = useParams<{ id: string }>();
319
 
318
 
319
+    // Foto a ser desplegada en el tope del quiz
320
+    const photo = getBioInfoPhoto(parseInt(params.id, 10));
321
+
320
     useIonViewWillEnter(() => {
322
     useIonViewWillEnter(() => {
321
         const quiz = getQuiz(parseInt(params.id, 10));
323
         const quiz = getQuiz(parseInt(params.id, 10));
322
         setQuiz(quiz);
324
         setQuiz(quiz);
331
                             <IonCol></IonCol>
333
                             <IonCol></IonCol>
332
                             <IonCol>
334
                             <IonCol>
333
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
335
                                 <IonImg style={{ height: 50, width: 100 }} src={EnciclopediaPR} alt='Logo'></IonImg>
334
-                                <IonTitle>Quiz</IonTitle>
336
+                                
335
                             </IonCol>
337
                             </IonCol>
336
                             <IonCol></IonCol>
338
                             <IonCol></IonCol>
337
                         </IonRow>
339
                         </IonRow>
340
             </IonHeader>
342
             </IonHeader>
341
             
343
             
342
             <IonContent fullscreen className="ion-padding">
344
             <IonContent fullscreen className="ion-padding">
343
-                <IonImg style={{ height: 300, width: 600 }} src={RobertoClemente} alt='Logo'></IonImg>
345
+                <IonImg style={{ height: 300, width: 300 }} src={photo} alt='Foto de Personaje'></IonImg>
344
 
346
 
345
                 {
347
                 {
346
                     quizInfo ?
348
                     quizInfo ?