add points display

svg/results.svg

@@ -0,0 +1,822 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   inkscape:export-ydpi="96"
+   inkscape:export-xdpi="96"
+   inkscape:export-filename="/docs/Dslak/vds_quiz/vds-app/App/assets/unsafe.jpg.png"
+   height="800"
+   width="800"
+   inkscape:version="1.0beta1 (unknown)"
+   sodipodi:docname="results.svg"
+   xml:space="preserve"
+   viewBox="0 0 800 800"
+   y="0px"
+   x="0px"
+   id="Ebene_1"
+   version="1.1"><metadata
+   id="metadata47">
+  <rdf:RDF>
+    <cc:Work
+   rdf:about="">
+      <dc:format>image/svg+xml</dc:format>
+
+
+
+
+
+
+
+
+      <dc:type
+   rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+
+
+
+
+
+
+
+
+      <dc:title />
+
+
+
+
+
+
+
+
+    </cc:Work>
+
+
+
+
+
+
+
+
+  </rdf:RDF>
+
+
+
+
+
+
+
+
+</metadata>
+
+
+
+
+
+
+
+
+<defs
+   id="defs45"><linearGradient
+   id="linearGradient940"
+   inkscape:collect="always">
+  <stop
+   id="stop936"
+   offset="0"
+   style="stop-color:#000000;stop-opacity:1;" />
+
+
+
+
+
+
+  <stop
+   id="stop938"
+   offset="1"
+   style="stop-color:#000000;stop-opacity:0;" />
+
+
+
+
+
+
+</linearGradient>
+
+
+
+
+
+
+<linearGradient
+   id="linearGradient898"
+   inkscape:collect="always">
+  <stop
+   id="stop894"
+   offset="0"
+   style="stop-color:#ffffff;stop-opacity:0.1606186" />
+
+
+
+
+
+
+  <stop
+   id="stop896"
+   offset="1"
+   style="stop-color:#ffffff;stop-opacity:0;" />
+
+
+
+
+
+
+</linearGradient>
+
+
+
+
+
+
+<linearGradient
+   id="linearGradient862"
+   inkscape:collect="always">
+  <stop
+   id="stop858"
+   offset="0"
+   style="stop-color:#56168b;stop-opacity:1;" />
+
+
+
+
+
+
+
+
+  <stop
+   id="stop860"
+   offset="1"
+   style="stop-color:#7e20c9;stop-opacity:0" />
+
+
+
+
+
+
+
+
+</linearGradient>
+
+
+
+
+
+
+
+
+<linearGradient
+   id="linearGradient1177"
+   inkscape:collect="always">
+  <stop
+   id="stop1173"
+   offset="0"
+   style="stop-color:#ffffff;stop-opacity:1;" />
+
+
+
+
+
+
+
+
+  <stop
+   id="stop1175"
+   offset="1"
+   style="stop-color:#ffffff;stop-opacity:0;" />
+
+
+
+
+
+
+
+
+</linearGradient>
+
+
+
+
+
+
+
+
+<linearGradient
+   id="linearGradient1113"
+   inkscape:collect="always">
+  <stop
+   id="stop1109"
+   offset="0"
+   style="stop-color:#ffffff;stop-opacity:1;" />
+
+
+
+
+
+
+
+
+  <stop
+   id="stop1111"
+   offset="1"
+   style="stop-color:#ffffff;stop-opacity:0;" />
+
+
+
+
+
+
+
+
+</linearGradient>
+
+
+
+
+
+
+
+
+
+	<defs
+   id="defs13">
+		<rect
+   y="0"
+   x="0"
+   id="SVGID_1_"
+   width="250"
+   height="91.900002" />
+
+
+
+
+
+
+
+
+
+	</defs>
+
+
+
+
+
+
+
+
+
+	<clipPath
+   id="SVGID_2_">
+		<use
+   height="100%"
+   width="100%"
+   y="0"
+   x="0"
+   xlink:href="#SVGID_1_"
+   style="overflow:visible"
+   id="use15" />
+
+
+
+
+
+
+
+
+
+	</clipPath>
+
+
+
+
+
+
+
+
+
+	
+	
+	
+	
+	
+	
+	
+	
+	
+	
+	
+<linearGradient
+   gradientTransform="translate(0,158.1)"
+   gradientUnits="userSpaceOnUse"
+   y2="77.732155"
+   x2="77.917458"
+   y1="-85.32769"
+   x1="6.22612"
+   id="linearGradient1115"
+   xlink:href="#linearGradient1113"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+<linearGradient
+   gradientTransform="matrix(1.4791905,0,0,1.4791905,25.462738,22.270725)"
+   gradientUnits="userSpaceOnUse"
+   y2="19.294325"
+   x2="122.02882"
+   y1="122.54591"
+   x1="132.76462"
+   id="linearGradient1179"
+   xlink:href="#linearGradient1177"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+<linearGradient
+   y2="19.294325"
+   x2="122.02882"
+   y1="122.54591"
+   x1="132.76462"
+   gradientTransform="matrix(0.83762215,0,0,0.92541661,-275.43157,-172.04418)"
+   gradientUnits="userSpaceOnUse"
+   id="linearGradient1183"
+   xlink:href="#linearGradient1177"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+<linearGradient
+   y2="19.294325"
+   x2="122.02882"
+   y1="122.54591"
+   x1="132.76462"
+   gradientTransform="matrix(-1.1876812,-0.35290398,0.38989322,-1.3121667,345.47458,152.00026)"
+   gradientUnits="userSpaceOnUse"
+   id="linearGradient1212"
+   xlink:href="#linearGradient1177"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+
+
+<mask
+   id="mask1236"
+   maskUnits="userSpaceOnUse">
+  <circle
+   style="fill:#ffffff;fill-opacity:1;stroke-width:1.02044"
+   id="circle1238"
+   cx="125"
+   cy="125"
+   r="125" />
+
+
+
+
+
+
+
+
+</mask>
+
+
+
+
+
+
+
+
+<mask
+   id="mask1243"
+   maskUnits="userSpaceOnUse">
+  <circle
+   style="fill:#ffffff;fill-opacity:1;stroke-width:1.02044"
+   id="circle1245"
+   cx="125"
+   cy="125"
+   r="125" />
+
+
+
+
+
+
+
+
+</mask>
+
+
+
+
+
+
+
+
+<linearGradient
+   y2="147.05267"
+   x2="266.32431"
+   y1="125"
+   x1="0"
+   gradientUnits="userSpaceOnUse"
+   id="linearGradient866"
+   xlink:href="#linearGradient862"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+
+
+
+
+<linearGradient
+   gradientTransform="translate(-71.635743,25.813861)"
+   gradientUnits="userSpaceOnUse"
+   y2="716.57642"
+   x2="283.17621"
+   y1="-357.87811"
+   x1="311.80994"
+   id="linearGradient900"
+   xlink:href="#linearGradient898"
+   inkscape:collect="always" />
+
+
+
+
+
+
+<linearGradient
+   y2="691.98407"
+   x2="-391.84567"
+   y1="-447.91309"
+   x1="1851.9196"
+   gradientTransform="matrix(1.0427705,0,0,0.62690293,-1088.8324,-991.72226)"
+   gradientUnits="userSpaceOnUse"
+   id="linearGradient928"
+   xlink:href="#linearGradient898"
+   inkscape:collect="always" />
+
+
+
+
+
+
+<linearGradient
+   gradientTransform="matrix(1,0,0,2.1631993,-67.336207,-293.4148)"
+   gradientUnits="userSpaceOnUse"
+   y2="452.36615"
+   x2="687.32172"
+   y1="-966.22083"
+   x1="649.34778"
+   id="linearGradient942"
+   xlink:href="#linearGradient940"
+   inkscape:collect="always" />
+
+
+
+
+
+
+
+
+
+
+<clipPath
+   id="SVGID_2_-2">
+  <use
+   id="use15-8"
+   style="overflow:visible"
+   xlink:href="#SVGID_1_"
+   x="0"
+   y="0"
+   width="100%"
+   height="100%" />
+
+
+
+
+
+
+</clipPath>
+
+
+
+
+
+
+<clipPath
+   id="clipPath960">
+  <use
+   id="use958"
+   style="overflow:visible"
+   xlink:href="#SVGID_1_"
+   x="0"
+   y="0"
+   width="100%"
+   height="100%" />
+
+
+
+
+
+
+</clipPath>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<linearGradient
+   gradientTransform="matrix(0.73549165,0,0,0.53473221,-122.70061,-41.695048)"
+   gradientUnits="userSpaceOnUse"
+   y2="452.36615"
+   x2="687.32172"
+   y1="-966.22083"
+   x1="649.34778"
+   id="linearGradient942-7"
+   xlink:href="#linearGradient940"
+   inkscape:collect="always" />
+
+
+<linearGradient
+   gradientTransform="matrix(1.1577052,0,0,1,-1315.1116,-748.52772)"
+   inkscape:collect="always"
+   xlink:href="#linearGradient898"
+   id="linearGradient900-4"
+   x1="311.80994"
+   y1="-357.87811"
+   x2="929.01709"
+   y2="819.63794"
+   gradientUnits="userSpaceOnUse" />
+
+
+<linearGradient
+   y2="716.57642"
+   x2="283.17621"
+   y1="-357.87811"
+   x1="311.80994"
+   gradientTransform="translate(733.62375,-279.8094)"
+   gradientUnits="userSpaceOnUse"
+   id="linearGradient932"
+   xlink:href="#linearGradient898"
+   inkscape:collect="always" />
+
+
+</defs>
+
+
+
+
+
+
+
+
+<sodipodi:namedview
+   inkscape:showpageshadow="false"
+   showborder="true"
+   borderlayer="true"
+   fit-margin-bottom="0"
+   fit-margin-right="0"
+   fit-margin-left="0"
+   fit-margin-top="0"
+   inkscape:snap-global="false"
+   inkscape:current-layer="layer1"
+   inkscape:window-maximized="1"
+   inkscape:window-y="22"
+   inkscape:window-x="0"
+   inkscape:cy="666.25655"
+   inkscape:cx="-515.1138"
+   inkscape:zoom="0.175"
+   showgrid="false"
+   id="namedview43"
+   inkscape:window-height="719"
+   inkscape:window-width="1366"
+   inkscape:pageshadow="2"
+   inkscape:pageopacity="1"
+   guidetolerance="10"
+   gridtolerance="10"
+   objecttolerance="10"
+   borderopacity="1"
+   inkscape:document-rotation="0"
+   bordercolor="#666666"
+   pagecolor="#ffffff" />
+
+
+
+
+
+
+
+
+
+<style
+   id="style10"
+   type="text/css">
+	.st0{clip-path:url(#SVGID_2_);}
+	.st1{clip-path:url(#SVGID_2_);fill:#FFFFFF;}
+</style>
+
+
+
+
+
+
+
+
+
+
+<g
+   transform="translate(318.96439,1070.5177)"
+   inkscape:label="root"
+   id="layer1"
+   inkscape:groupmode="layer">
+  
+
+
+
+  
+
+
+
+<rect
+   y="-1479.5974"
+   x="-1457.7026"
+   height="1613.8571"
+   width="2982.7158"
+   id="rect907"
+   style="opacity:1;fill:#d38900;fill-opacity:0.99324107" />
+
+
+<rect
+   style="opacity:1;fill:#b41111;fill-opacity:0.993241"
+   id="rect907-8"
+   width="2982.7158"
+   height="1613.8571"
+   x="-4244.4434"
+   y="-1257.4875" />
+
+
+<rect
+   y="-961.82635"
+   x="-4378.9487"
+   height="1613.8571"
+   width="2982.7158"
+   id="rect907-8-7"
+   style="opacity:1;fill:#00a40d;fill-opacity:0.993241" />
+
+
+</g>
+
+
+
+
+
+
+
+
+<g
+   transform="translate(-24.887482)"
+   id="g1025"
+   inkscape:export-filename="/docs/Dslak/vds_quiz/vds-app/App/assets/logo.png"
+   inkscape:export-xdpi="120"
+   inkscape:export-ydpi="120">
+  
+  
+  
+</g>
+
+
+
+
+
+
+
+
+
+<g
+   inkscape:label="Logo"
+   id="layer2"
+   inkscape:groupmode="layer">
+  
+
+
+
+<rect
+   ry="0"
+   y="-308.34857"
+   x="-210.29063"
+   height="606.03857"
+   width="1337.6455"
+   id="rect934"
+   style="fill:url(#linearGradient942-7);fill-opacity:1;stroke:none;stroke-width:0.627133" />
+
+
+<g
+   id="g938"
+   transform="matrix(0.63334715,0,0,0.58549327,-46.569578,223.1593)">
+  <ellipse
+   ry="400.51532"
+   rx="1205.2823"
+   cy="327.19742"
+   cx="223.79865"
+   id="path870"
+   style="fill:url(#linearGradient900);fill-opacity:1;stroke:none" />
+
+
+  <ellipse
+   cx="-973.08563"
+   cy="-447.14417"
+   rx="1395.3616"
+   ry="400.51532"
+   transform="scale(-1)"
+   style="fill:url(#linearGradient900-4);fill-opacity:1;stroke:none;stroke-width:1.07597"
+   id="path870-0" />
+
+
+  <ellipse
+   ry="251.08421"
+   rx="1069.1677"
+   cy="-802.784"
+   cx="-780.76215"
+   id="ellipse926"
+   style="fill:url(#linearGradient928);fill-opacity:1;stroke:none;stroke-width:0.808527"
+   transform="matrix(-0.94066274,0.3393429,-0.10838861,-0.9941086,0,0)" />
+
+
+  <ellipse
+   style="fill:url(#linearGradient932);fill-opacity:1;stroke:none"
+   id="ellipse930"
+   cx="1029.0581"
+   cy="21.574158"
+   rx="1205.2823"
+   ry="400.51532" />
+
+
+</g>
+
+
+</g>
+
+
+
+
+
+
+
+</svg>

vds-app/App/components/Alert.js

@@ -34,6 +34,7 @@ const styles = StyleSheet.create({
 export const Alert = ({ correct, visible }) => {
   if (!visible) return null
 
+
   const icon = correct
     ? require("../assets/check.png")
     : require("../assets/close.png")

vds-app/App/components/Results.js

@@ -1,57 +1,54 @@
 import React from "react"
-import { View, StyleSheet, Dimensions, Text } from "react-native"
+import { View, StyleSheet, Dimensions, Text, Image, ImageBackground } from "react-native"
 import { colors, texts } from "../components/Variables"
 
 const screen = Dimensions.get("window")
+const imgError = require("../assets/error.jpg")
+const imgUnsafe = require("../assets/unsafe.jpg")
+const imgPassed = require("../assets/passed.jpg")
+const imgPanorama = require("../assets/panorama.jpg")
+const imgPanorama2 = require("../assets/panorama2.jpg")
 
 const styles = StyleSheet.create({
   container: {
-    position: "absolute",
     top: 0,
-    bottom: 0,
     left: 0,
-    right: 0,
     flex: 1,
     alignItems: "center",
-    justifyContent: "center"
+    justifyContent: "center",
+    height: screen.height-80,
+    width: screen.width,
+    backgroundColor: colors.white_alpha
   },
   box: {
-    backgroundColor: colors.green_alpha,
-    width: screen.width / 1.1,
-    height: 320,
-    borderRadius: 15,
-    borderColor: colors.white_alpha,
-    borderWidth: 5,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  boxWrong: {
-    backgroundColor: colors.red_alpha,
-    width: screen.width / 1.1,
-    height: 320,
-    borderRadius: 15,
-    borderColor: colors.white_alpha,
-    borderWidth: 5,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  boxUnsafe: {
-    backgroundColor: colors.orange,
-    width: screen.width / 1.1,
-    height: 320,
+    position: "absolute",
+    top: (screen.height/2)-220,
+    width: screen.width-50,
     borderRadius: 15,
+    height: 420,
     borderColor: colors.white_alpha,
-    borderWidth: 5,
-    alignItems: "center",
-    justifyContent: "center"
+    borderWidth: 0
   },
   text: {
     color: colors.white,
-    fontSize: 25,
+    fontSize: 22,
+    textAlign: "center",
+    fontWeight: "400",
+    lineHeight: 40,
+    textShadowColor: 'rgba(0, 0, 0, 0.75)',
+    textShadowOffset: {width: -1, height: 1},
+    textShadowRadius: 10
+  },
+  textSmall: {
+    marginTop: 20,
+    color: colors.white,
+    fontSize: 26,
     textAlign: "center",
-    letterSpacing: -0.02,
     fontWeight: "500",
-    lineHeight: 50
+    lineHeight: 30,
+    textShadowColor: 'rgba(0, 0, 0, 0.75)',
+    textShadowOffset: {width: -1, height: 1},
+    textShadowRadius: 10
   },
   textLabel: {
     paddingHorizontal: 20,
@@ -65,29 +62,64 @@ const styles = StyleSheet.create({
   },
   unsafe: {
     color: colors.yellow
+  },
+  bg: {
+    width: "100%",
+    height: "100%",
+    borderRadius: 5,
+    paddingVertical: 50
+  },
+  bgStyle: {
+    borderRadius: 0,
+    opacity: 0.8,
+    borderColor: colors.white_alpha,
+    borderWidth: 0
   }
 })
 
-export const Results = ({ total, correct, wrong, visible }) => {
+export const Results = ({ results, visible }) => {
   if (!visible) return null
 
-  const percentage = total ? (100/total) * correct : 0
-  const boxStyle = percentage >= 80 ? percentage >= 85 ? styles.box : styles.boxUnsafe : styles.boxWrong
-  const percentStyle = percentage >= 80 ? percentage >= 85 ? styles.correct : styles.unsafe : styles.wrong
+  //const percentage = results.totalPoints ? (100/results.totalPoints) * results.points : 0
+  const percentage = results.total ? (100/results.total) * results.correct : 0
+  let bgImage = results.points >= 80 ? results.points >= 85 ? imgPassed : imgUnsafe : imgError
+  let imgPanoramaResult = results.points >= 80 ? imgPanorama : imgPanorama2
+
+  if(!results.isExam) {
+    bgImage = percentage >= 80 ? percentage >= 85 ? imgPassed : imgUnsafe : imgError
+    imgPanoramaResult = percentage >= 80 ? imgPanorama : imgPanorama2
+  }
 
   return (
-    <View style={styles.container}>
-      <View style={boxStyle}>
+
+    <ImageBackground source={imgPanoramaResult} style={[styles.bg, styles.container]} resizeMode="cover">
+
+      <View style={styles.box}>
+        <ImageBackground source={bgImage} style={styles.bg} imageStyle={styles.bgStyle} resizeMode="cover">
+
+
         <Text style={styles.text}>
-          <Text style={styles.textLabel}>{`${texts.corrects}: ${correct}`}</Text>
+          <Text style={styles.textLabel}>{`${texts.corrects}: ${results.correct}`}</Text>
         </Text>
         <Text style={styles.text}>
-          <Text style={styles.textLabel}>{`${texts.wrongs}: ${wrong}`}</Text>
+          <Text style={styles.textLabel}>{`${texts.wrongs}: ${results.wrong}`}</Text>
         </Text>
         <Text style={styles.text}>
           <Text style={styles.textLabel}>{`${texts.percentage}: ${Math.round(percentage)}%`}</Text>
         </Text>
+        <Text style={styles.text}>
+          <Text style={styles.textLabel}>{`${texts.points}: ${results.points}/${results.totalPoints}`}</Text>
+        </Text>
+
+        {results.isExam ?
+          <Text style={styles.textSmall}>
+            {results.points >= 80 ? results.points >= 85 ? texts.exam_passed : texts.exam_needs_oral : texts.exam_not_passed}
+          </Text> : <Text/>
+        }
+
+        </ImageBackground>
       </View>
-    </View>
+    </ImageBackground>
+
   )
 }

vds-app/App/components/Variables.js

@@ -22,9 +22,13 @@ export const texts = {
   section_quizzes: "Quiz per argomento",
   exam: "Simulazione esame",
   exam_simulation: "30 domande in 30min",
+  exam_passed: "Esame superato!",
+  exam_not_passed: "Esame non superato!",
+  exam_needs_oral: "Necessaria prova orale!",
   corrects: "Corrette",
   wrongs: "Sbagliate",
   percentage: "Percentuale",
+  points: "Punti",
   aerodynamics: "Aerodinamica",
   first_aid: "Primo soccorso",
   flight_safety: "Sicurezza in volo",

vds-app/App/data/firstAid.js

@@ -147,6 +147,15 @@ const questions = [
       {
         id: "1",
         text: "Lasciare uscire più sangue possibile onde lavare la ferita."
+      },
+      {
+        id: "2",
+        text: "Interrompere il flusso sanguigno con laccio emostatico posto tra la lesione ed il cuore o con idoneo tampone posto sulla ferita.",
+        correct: true
+      },
+      {
+        id: "3",
+        text: "Distendere l’infortunato con la ferita posta verso l’alto."
       }
     ]
   },

vds-app/App/data/test.js

@@ -0,0 +1,64 @@
+const questions = [
+  {
+    id: "3001",
+    question: "Quale comportamento è auspicabile appena effettuato un soccorso d’emergenza?",
+    points: "2",
+    answers: [
+      {
+        id: "1",
+        text: "Si trasporta il ferito all’ospedale con qualsiasi mezzo disponibile seguendolo da vicino."
+      },
+      {
+        id: "2",
+        text: "VERA - Far trasportare all’ospedale con mezzo idoneo ed abilitato l’infortunato prendendosi cura dei suoi effetti personali ed avvisando al più presto i suoi parenti più prossimi.",
+        correct: true
+      },
+      {
+        id: "3",
+        text: "Una volta chiamate si attende che giungano le autorità di polizia e si lascia a esse ogni incombenza."
+      }
+    ]
+  },
+  {
+    id: "3002",
+    question: "Qual è, tra questi, il modo migliore per accompagnare un infortunato con una lesione leggera in grado di camminare?",
+    points: "2",
+    answers: [
+      {
+        id: "1",
+        text: "Procurandogli un paio di stampelle."
+      },
+      {
+        id: "2",
+        text: "Portandolo a spalle."
+      },
+      {
+        id: "3",
+        text: "VERA - Mettendosi al suo fianco, dal lato della lesione e cingendogli la vita con il braccio, se possibile.",
+        correct: true
+      }
+    ]
+  },
+  {
+    id: "3003",
+    question: "Come comportarsi alla presenza di un infortunato di cui si sospettano lesioni interne di entità sconosciuta?",
+    points: "2",
+    answers: [
+      {
+        id: "1",
+        text: "Ispezionarlo attentamente, interrogandolo sulle parti dolenti e facendolo muovere se può, indi chiamare i mezzi di soccorso."
+      },
+      {
+        id: "2",
+        text: "VERA - Interrompere il flusso sanguigno con laccio emostatico posto tra la lesione ed il cuore o con idoneo tampone posto sulla ferita.",
+        correct: true
+      },
+      {
+        id: "3",
+        text: "Distendere l’infortunato con la ferita posta verso l’alto."
+      }
+    ]
+  }
+]
+
+export default questions

vds-app/App/screens/Exam.js

@@ -2,23 +2,21 @@ import React from "react"
 import { View, ScrollView, StyleSheet, StatusBar, Text, SafeAreaView } from "react-native"
 
 import { Button, ButtonContainer } from "../components/Button"
-import { Alert } from "../components/Alert"
+//import { Alert } from "../components/Alert"
 import { Results } from "../components/Results"
 import { colors } from "../components/Variables"
 
 const styles = StyleSheet.create({
   container: {
     backgroundColor: colors.blue,
-    flex: 1,
-    paddingHorizontal: 20
+    flex: 1
   },
   text: {
     color: colors.white,
     fontSize: 20,
     textAlign: "center",
     fontWeight: "600",
-    paddingVertical: 20,
-    marginTop: 20,
+    paddingVertical: 20
   },
   timer: {
     color: colors.white,
@@ -31,6 +29,7 @@ const styles = StyleSheet.create({
   safearea: {
     flex: 1,
     marginTop: 20,
+    paddingHorizontal: 20,
     justifyContent: "space-between"
   }
 })
@@ -42,6 +41,8 @@ class Exam extends React.Component {
 
   state = {
     correctCount: 0,
+    pointsCount: 0,
+    totalPoints: 0,
     wrongCount: 0,
     totalCount: this.props.navigation.getParam("questions", []).length,
     availableIds: this.props.navigation.getParam("questions", []).map(a => a.id),
@@ -54,13 +55,14 @@ class Exam extends React.Component {
     timer: maxTime
   }
 
-  answer = (correct, id) => {
+  answer = (correct, id, points) => {
     this.setState(
       state => {
-        const nextState = { answered: true, clickedId: id }
+        const nextState = { answered: true, clickedId: id, totalPoints: state.totalPoints + parseInt(points)}
 
         if (correct) {
           nextState.correctCount = state.correctCount + 1
+          nextState.pointsCount = state.pointsCount + parseInt(points)
           nextState.answerCorrect = true
         } else {
           nextState.wrongCount = state.wrongCount + 1
@@ -87,7 +89,7 @@ class Exam extends React.Component {
         resultsShow = true
         setTimeout( () => {
           this.props.navigation.popToTop()
-        }, 5000)
+        }, 10000)
       }
 
       return {
@@ -99,6 +101,10 @@ class Exam extends React.Component {
     })
   }
 
+  componentWillUnmount(){
+    clearInterval(interval)
+  }
+
   render() {
     const questions = this.props.navigation.getParam("questions", [])
     const question = questions.filter(item => item.id == this.state.activeQuestionId)[0] || questions[0]
@@ -118,7 +124,7 @@ class Exam extends React.Component {
       clearInterval(interval)
       setTimeout( () => {
         this.props.navigation.popToTop()
-      }, 5000)
+      }, 10000)
     }
 
     return (
@@ -128,6 +134,8 @@ class Exam extends React.Component {
         ]}
       >
         <StatusBar barStyle="light-content" />
+
+        {!this.state.results ?
         <SafeAreaView style={styles.safearea}>
           <Text style={styles.timer}>{new Date(this.state.timer * 1000).toISOString().substr(11, 8)}</Text>
           <View>
@@ -139,7 +147,7 @@ class Exam extends React.Component {
                   key={answer.id}
                   text={answer.text}
                   colorize={{id: answer.id, clicked: this.state.clickedId, answered: this.state.answered, isCorrect: answer.correct}}
-                  onPress={() => this.answer(answer.correct, answer.id)}
+                  onPress={() => this.answer(answer.correct, answer.id, question.points)}
                 />
               ))}
             </ButtonContainer>
@@ -149,14 +157,17 @@ class Exam extends React.Component {
             {`${this.state.correctCount+this.state.wrongCount}/${this.state.totalCount}`}
           </Text>
         </SafeAreaView>
-        <Alert
-          correct={this.state.answerCorrect}
-          visible={this.state.answered}
-        />
+        : <SafeAreaView style={styles.safearea}></SafeAreaView>}
+
         <Results
-          total={this.state.totalCount}
-          correct={this.state.correctCount}
-          wrong={this.state.wrongCount}
+          results={{
+            isExam: true,
+            total: this.state.totalCount,
+            correct: this.state.correctCount,
+            wrong: this.state.wrongCount,
+            points: this.state.pointsCount,
+            totalPoints: this.state.totalPoints
+          }}
           visible={this.state.results}
         />
       </ScrollView>

vds-app/App/screens/Quiz.js

@@ -2,27 +2,26 @@ import React from "react"
 import { View, ScrollView, StyleSheet, StatusBar, Text, SafeAreaView } from "react-native"
 
 import { Button, ButtonContainer } from "../components/Button"
-import { Alert } from "../components/Alert"
+//import { Alert } from "../components/Alert"
 import { Results } from "../components/Results"
 import { colors } from "../components/Variables"
 
 const styles = StyleSheet.create({
   container: {
     backgroundColor: colors.blue,
-    flex: 1,
-    paddingHorizontal: 20
+    flex: 1
   },
   text: {
     color: colors.white,
     fontSize: 20,
     textAlign: "center",
     fontWeight: "600",
-    paddingVertical: 20,
-    marginTop: 20,
+    paddingVertical: 20
   },
   safearea: {
     flex: 1,
     marginTop: 20,
+    paddingHorizontal: 20,
     justifyContent: "space-between"
   }
 })
@@ -32,6 +31,8 @@ class Quiz extends React.Component {
   state = {
     correctCount: 0,
     wrongCount: 0,
+    pointsCount: 0,
+    totalPoints: 0,
     totalCount: this.props.navigation.getParam("questions", []).length,
     availableIds: this.props.navigation.getParam("questions", []).map(a => a.id),
     activeQuestionId: this.props.navigation.getParam("questions", [])[
@@ -42,13 +43,14 @@ class Quiz extends React.Component {
     results: false
   }
 
-  answer = (correct, id) => {
+  answer = (correct, id, points) => {
     this.setState(
       state => {
-        const nextState = { answered: true, clickedId: id }
+        const nextState = { answered: true, clickedId: id, totalPoints: state.totalPoints + parseInt(points)}
 
         if (correct) {
           nextState.correctCount = state.correctCount + 1
+          nextState.pointsCount = state.pointsCount + parseInt(points)
           nextState.answerCorrect = true
         } else {
           nextState.wrongCount = state.wrongCount + 1
@@ -97,6 +99,8 @@ class Quiz extends React.Component {
         ]}
       >
         <StatusBar barStyle="light-content" />
+
+        {!this.state.results ?
         <SafeAreaView style={styles.safearea}>
           <View>
             <Text style={styles.text}>{question.question}</Text>
@@ -107,7 +111,7 @@ class Quiz extends React.Component {
                   key={answer.id}
                   text={answer.text}
                   colorize={{id: answer.id, clicked: this.state.clickedId, answered: this.state.answered, isCorrect: answer.correct}}
-                  onPress={() => this.answer(answer.correct, answer.id)}
+                  onPress={() => this.answer(answer.correct, answer.id, question.points)}
                 />
               ))}
             </ButtonContainer>
@@ -117,11 +121,17 @@ class Quiz extends React.Component {
             {`${this.state.correctCount+this.state.wrongCount}/${this.state.totalCount}`}
           </Text>
         </SafeAreaView>
+        : <SafeAreaView></SafeAreaView>}
 
         <Results
-          total={this.state.totalCount}
-          correct={this.state.correctCount}
-          wrong={this.state.wrongCount}
+          results={{
+            isExam: false,
+            total: this.state.totalCount,
+            correct: this.state.correctCount,
+            wrong: this.state.wrongCount,
+            points: this.state.pointsCount,
+            totalPoints: this.state.totalPoints
+          }}
           visible={this.state.results}
         />
       </ScrollView>

vds-app/App/screens/QuizIndex.js

@@ -10,6 +10,7 @@ import materialsQuestions from "../data/materials"
 import meteorologyQuestions from "../data/meteorology"
 import physiopathologyQuestions from "../data/physiopathology"
 import pilotingTechniquesQuestions from "../data/pilotingTechniques"
+import testQuestions from "../data/test"
 
 import { Button, ButtonContainer } from "../components/Button"
 import { RowItem } from "../components/RowItem"
@@ -19,6 +20,7 @@ import { examQuestions } from "../components/ExamQuestions"
 export default ({ navigation }) => (
   <ScrollView style={[{ backgroundColor: colors.dark_blue }]}>
     <StatusBar barStyle="dark-content" />
+
     <RowItem name={texts.aerodynamics} color={colors.blue} textColor={colors.white} onPress={()=>
       navigation.navigate("Quiz", {
         title: texts.aerodynamics,

vds-app/app.json

@@ -8,7 +8,7 @@
       "ios",
       "android"
     ],
-    "version": "1.2.0",
+    "version": "1.3.0",
     "orientation": "portrait",
     "icon": "./assets/icon.png",
     "splash": {
@@ -26,7 +26,7 @@
       "icon": "./assets/icon.png",
       "package": "com.dslak.vdsquiz",
       "permissions": [],
-      "versionCode": 2,
+      "versionCode": 3,
       "config": {
         "googleMobileAdsAppId": "ca-app-pub-4145771316565790~1876877627"
       }