Created
May 15, 2018 16:42
-
-
Save oflarcade/781a79bf584b45dcf2c3f7dd952e333d to your computer and use it in GitHub Desktop.
Odd behavior of this.setState && this.state
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React, { Component } from 'react'; | |
| import { View, StatusBar, StyleSheet, AsyncStorage, Dimensions, TouchableOpacity, ImageBackground } from 'react-native'; | |
| import { Container, Content, Card, CardItem, Body, Text, Left, Right, Icon, Header } from 'native-base'; | |
| import TimerCountdown from 'react-native-timer-countdown' | |
| import Btn from 'react-native-micro-animated-button'; | |
| import { Font } from 'expo'; | |
| import ResponseButton from '../components/ResponseButton'; | |
| import axios from 'axios'; | |
| import QuestionDataRaw from '../data/QuestionData'; | |
| const screenWidth = Dimensions.get('window').width; | |
| const logoWidth = Dimensions.get('window').width / 12; | |
| export default class Game extends Component { | |
| constructor(props) { | |
| super(props) | |
| this.state = { | |
| question:'this is the question', | |
| doorName: '', | |
| correctAnswer: '', | |
| selectedAnswer: '', | |
| firstAnswer: ' this is the first answer', | |
| secondAnswer: '', | |
| thirdAnswer: '', | |
| fourthAnswer: '', | |
| score: 0, | |
| wrongColor: '', | |
| correctColor: '', | |
| disableOne: false, | |
| disableTwo: false, | |
| disableThree: true, | |
| disableFour: false, | |
| questionNbr: 1, | |
| questionTitle: '', | |
| level: 1, | |
| }; | |
| }; | |
| componentWillMount() { | |
| StatusBar.setHidden(true, 'slide'); | |
| this._loadData(); | |
| this._loadQuestionData(); | |
| } | |
| componentDidMount(){ | |
| } | |
| _loadQuestionData() { | |
| switch (this.state.level) { | |
| case 1: | |
| {this._FirstLevel();} | |
| case 2: | |
| this._SecondLevel() | |
| case 3: | |
| this._ThirdLevel() | |
| case 4: | |
| this._FourthLevel() | |
| case 5: | |
| this._FifthLevel() | |
| case 6: | |
| this._SixthLevel() | |
| case 7: | |
| this._SeventhLevel() | |
| } | |
| } | |
| _goBack = () => { | |
| this.props.navigation.goBack(null) | |
| } | |
| _goQuestion = () => { | |
| this.props.navigation.navigate('Game') | |
| } | |
| _loadData() { //Persistance | |
| AsyncStorage.getItem('levelSelected').then((levelSelectedPersist) => { this.setState({ level: parseInt(levelSelectedPersist, 10) }) }) | |
| AsyncStorage.getItem('questionNbrPersist').then((questionNbrPersist) => { this.setState({ questionTitle: questionNbrPersist }) }) | |
| AsyncStorage.getItem('levelName').then((levelName) => { this.setState({ doorName: levelName }) }) | |
| AsyncStorage.getItem('questionValue').then((questionValue) => { this.setState({ questionNbr: parseInt(questionValue, 10) }) }) | |
| } | |
| _FirstLevel(){ | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| let questionRaw = QuestionDataRaw.level1.Question1Text; | |
| let firstRaw = QuestionDataRaw.level1.Response1One; | |
| let secondRaw = QuestionDataRaw.level1.Response1Two; | |
| let ThirdRaw = QuestionDataRaw.level1.Response1Three; | |
| let FourthRaw = QuestionDataRaw.level1.Response1Four; | |
| console.log("value before assigned: ",questionRaw); | |
| this.setState({ question: 'a' }) | |
| //this.setState({question: questionRaw,firstAnswer: firstRaw,secondAnswer: secondRaw,thirdAnswer: ThirdRaw,fourthAnswer: FourthRaw,correctAnswer: QuestionDataRaw.level1.correct1Answer }) | |
| //this.setState({ question: questionRaw }); | |
| this.setState((question)=>{ | |
| return{ | |
| question: questionRaw | |
| } | |
| }) | |
| console.log("value After assigned: ",this.state.question); | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question2Text, | |
| firstAnswer: QuestionDataRaw.level1.Response2One, | |
| secondAnswer: QuestionDataRaw.level1.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response2Four, | |
| correctAnswer: QuestionDataRaw.level1.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question3Text, | |
| firstAnswer: QuestionDataRaw.level1.Response3One, | |
| secondAnswer: QuestionDataRaw.level1.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response3Four, | |
| correctAnswer: QuestionDataRaw.level1.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question4Text, | |
| firstAnswer: QuestionDataRaw.level1.Response4One, | |
| secondAnswer: QuestionDataRaw.level1.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response4Four, | |
| correctAnswer: QuestionDataRaw.level1.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question5Text, | |
| firstAnswer: QuestionDataRaw.level1.Response5One, | |
| secondAnswer: QuestionDataRaw.level1.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response5Four, | |
| correctAnswer: QuestionDataRaw.level1.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question6Text, | |
| firstAnswer: QuestionDataRaw.level1.Response6One, | |
| secondAnswer: QuestionDataRaw.level1.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response6Four, | |
| correctAnswer: QuestionDataRaw.level1.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question7Text, | |
| firstAnswer: QuestionDataRaw.level1.Response7One, | |
| secondAnswer: QuestionDataRaw.level1.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response7Four, | |
| correctAnswer: QuestionDataRaw.level1.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question8Text, | |
| firstAnswer: QuestionDataRaw.level1.Response8One, | |
| secondAnswer: QuestionDataRaw.level1.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response8Four, | |
| correctAnswer: QuestionDataRaw.level1.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question9Text, | |
| firstAnswer: QuestionDataRaw.level1.Response9One, | |
| secondAnswer: QuestionDataRaw.level1.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response9Four, | |
| correctAnswer: QuestionDataRaw.level1.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level1.Question10Text, | |
| firstAnswer: QuestionDataRaw.level1.Response10One, | |
| secondAnswer: QuestionDataRaw.level1.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level1.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level1.Response10Four, | |
| correctAnswer: QuestionDataRaw.level1.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _SecondLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question1Text, | |
| firstAnswer: QuestionDataRaw.level2.Response1One, | |
| secondAnswer: QuestionDataRaw.level2.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response1Four, | |
| correctAnswer: QuestionDataRaw.level2.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question2Text, | |
| firstAnswer: QuestionDataRaw.level2.Response2One, | |
| secondAnswer: QuestionDataRaw.level2.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response2Four, | |
| correctAnswer: QuestionDataRaw.level2.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question3Text, | |
| firstAnswer: QuestionDataRaw.level2.Response3One, | |
| secondAnswer: QuestionDataRaw.level2.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response3Four, | |
| correctAnswer: QuestionDataRaw.level2.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question4Text, | |
| firstAnswer: QuestionDataRaw.level2.Response4One, | |
| secondAnswer: QuestionDataRaw.level2.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response4Four, | |
| correctAnswer: QuestionDataRaw.level2.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question5Text, | |
| firstAnswer: QuestionDataRaw.level2.Response5One, | |
| secondAnswer: QuestionDataRaw.level2.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response5Four, | |
| correctAnswer: QuestionDataRaw.level2.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question6Text, | |
| firstAnswer: QuestionDataRaw.level2.Response6One, | |
| secondAnswer: QuestionDataRaw.level2.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response6Four, | |
| correctAnswer: QuestionDataRaw.level2.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question7Text, | |
| firstAnswer: QuestionDataRaw.level2.Response7One, | |
| secondAnswer: QuestionDataRaw.level2.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response7Four, | |
| correctAnswer: QuestionDataRaw.level2.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question8Text, | |
| firstAnswer: QuestionDataRaw.level2.Response8One, | |
| secondAnswer: QuestionDataRaw.level2.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response8Four, | |
| correctAnswer: QuestionDataRaw.level2.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question9Text, | |
| firstAnswer: QuestionDataRaw.level2.Response9One, | |
| secondAnswer: QuestionDataRaw.level2.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response9Four, | |
| correctAnswer: QuestionDataRaw.level2.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level2.Question10Text, | |
| firstAnswer: QuestionDataRaw.level2.Response10One, | |
| secondAnswer: QuestionDataRaw.level2.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level2.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level2.Response10Four, | |
| correctAnswer: QuestionDataRaw.level2.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _ThirdLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question1Text, | |
| firstAnswer: QuestionDataRaw.level3.Response1One, | |
| secondAnswer: QuestionDataRaw.level3.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response1Four, | |
| correctAnswer: QuestionDataRaw.level3.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question2Text, | |
| firstAnswer: QuestionDataRaw.level3.Response2One, | |
| secondAnswer: QuestionDataRaw.level3.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response2Four, | |
| correctAnswer: QuestionDataRaw.level3.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question3Text, | |
| firstAnswer: QuestionDataRaw.level3.Response3One, | |
| secondAnswer: QuestionDataRaw.level3.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response3Four, | |
| correctAnswer: QuestionDataRaw.level3.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question4Text, | |
| firstAnswer: QuestionDataRaw.level3.Response4One, | |
| secondAnswer: QuestionDataRaw.level3.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response4Four, | |
| correctAnswer: QuestionDataRaw.level3.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question5Text, | |
| firstAnswer: QuestionDataRaw.level3.Response5One, | |
| secondAnswer: QuestionDataRaw.level3.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response5Four, | |
| correctAnswer: QuestionDataRaw.level3.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question6Text, | |
| firstAnswer: QuestionDataRaw.level3.Response6One, | |
| secondAnswer: QuestionDataRaw.level3.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response6Four, | |
| correctAnswer: QuestionDataRaw.level3.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question7Text, | |
| firstAnswer: QuestionDataRaw.level3.Response7One, | |
| secondAnswer: QuestionDataRaw.level3.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response7Four, | |
| correctAnswer: QuestionDataRaw.level3.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question8Text, | |
| firstAnswer: QuestionDataRaw.level3.Response8One, | |
| secondAnswer: QuestionDataRaw.level3.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response8Four, | |
| correctAnswer: QuestionDataRaw.level3.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question9Text, | |
| firstAnswer: QuestionDataRaw.level3.Response9One, | |
| secondAnswer: QuestionDataRaw.level3.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response9Four, | |
| correctAnswer: QuestionDataRaw.level3.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level3.Question10Text, | |
| firstAnswer: QuestionDataRaw.level3.Response10One, | |
| secondAnswer: QuestionDataRaw.level3.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level3.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level3.Response10Four, | |
| correctAnswer: QuestionDataRaw.level3.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _FourthLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question1Text, | |
| firstAnswer: QuestionDataRaw.level4.Response1One, | |
| secondAnswer: QuestionDataRaw.level4.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response1Four, | |
| correctAnswer: QuestionDataRaw.level4.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question2Text, | |
| firstAnswer: QuestionDataRaw.level4.Response2One, | |
| secondAnswer: QuestionDataRaw.level4.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response2Four, | |
| correctAnswer: QuestionDataRaw.level4.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question3Text, | |
| firstAnswer: QuestionDataRaw.level4.Response3One, | |
| secondAnswer: QuestionDataRaw.level4.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response3Four, | |
| correctAnswer: QuestionDataRaw.level4.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question4Text, | |
| firstAnswer: QuestionDataRaw.level4.Response4One, | |
| secondAnswer: QuestionDataRaw.level4.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response4Four, | |
| correctAnswer: QuestionDataRaw.level4.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question5Text, | |
| firstAnswer: QuestionDataRaw.level4.Response5One, | |
| secondAnswer: QuestionDataRaw.level4.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response5Four, | |
| correctAnswer: QuestionDataRaw.level4.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question6Text, | |
| firstAnswer: QuestionDataRaw.level4.Response6One, | |
| secondAnswer: QuestionDataRaw.level4.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response6Four, | |
| correctAnswer: QuestionDataRaw.level4.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question7Text, | |
| firstAnswer: QuestionDataRaw.level4.Response7One, | |
| secondAnswer: QuestionDataRaw.level4.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response7Four, | |
| correctAnswer: QuestionDataRaw.level4.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question8Text, | |
| firstAnswer: QuestionDataRaw.level4.Response8One, | |
| secondAnswer: QuestionDataRaw.level4.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response8Four, | |
| correctAnswer: QuestionDataRaw.level4.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question9Text, | |
| firstAnswer: QuestionDataRaw.level4.Response9One, | |
| secondAnswer: QuestionDataRaw.level4.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response9Four, | |
| correctAnswer: QuestionDataRaw.level4.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level4.Question10Text, | |
| firstAnswer: QuestionDataRaw.level4.Response10One, | |
| secondAnswer: QuestionDataRaw.level4.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level4.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level4.Response10Four, | |
| correctAnswer: QuestionDataRaw.level4.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _FifthLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question1Text, | |
| firstAnswer: QuestionDataRaw.level5.Response1One, | |
| secondAnswer: QuestionDataRaw.level5.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response1Four, | |
| correctAnswer: QuestionDataRaw.level5.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question2Text, | |
| firstAnswer: QuestionDataRaw.level5.Response2One, | |
| secondAnswer: QuestionDataRaw.level5.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response2Four, | |
| correctAnswer: QuestionDataRaw.level5.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question3Text, | |
| firstAnswer: QuestionDataRaw.level5.Response3One, | |
| secondAnswer: QuestionDataRaw.level5.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response3Four, | |
| correctAnswer: QuestionDataRaw.level5.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question4Text, | |
| firstAnswer: QuestionDataRaw.level5.Response4One, | |
| secondAnswer: QuestionDataRaw.level5.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response4Four, | |
| correctAnswer: QuestionDataRaw.level5.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question5Text, | |
| firstAnswer: QuestionDataRaw.level5.Response5One, | |
| secondAnswer: QuestionDataRaw.level5.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response5Four, | |
| correctAnswer: QuestionDataRaw.level5.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question6Text, | |
| firstAnswer: QuestionDataRaw.level5.Response6One, | |
| secondAnswer: QuestionDataRaw.level5.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response6Four, | |
| correctAnswer: QuestionDataRaw.level5.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question7Text, | |
| firstAnswer: QuestionDataRaw.level5.Response7One, | |
| secondAnswer: QuestionDataRaw.level5.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response7Four, | |
| correctAnswer: QuestionDataRaw.level5.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question8Text, | |
| firstAnswer: QuestionDataRaw.level5.Response8One, | |
| secondAnswer: QuestionDataRaw.level5.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response8Four, | |
| correctAnswer: QuestionDataRaw.level5.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question9Text, | |
| firstAnswer: QuestionDataRaw.level5.Response9One, | |
| secondAnswer: QuestionDataRaw.level5.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response9Four, | |
| correctAnswer: QuestionDataRaw.level5.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level5.Question10Text, | |
| firstAnswer: QuestionDataRaw.level5.Response10One, | |
| secondAnswer: QuestionDataRaw.level5.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level5.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level5.Response10Four, | |
| correctAnswer: QuestionDataRaw.level5.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _SixthLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question1Text, | |
| firstAnswer: QuestionDataRaw.level6.Response1One, | |
| secondAnswer: QuestionDataRaw.level6.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response1Four, | |
| correctAnswer: QuestionDataRaw.level6.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question2Text, | |
| firstAnswer: QuestionDataRaw.level6.Response2One, | |
| secondAnswer: QuestionDataRaw.level6.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response2Four, | |
| correctAnswer: QuestionDataRaw.level6.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question3Text, | |
| firstAnswer: QuestionDataRaw.level6.Response3One, | |
| secondAnswer: QuestionDataRaw.level6.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response3Four, | |
| correctAnswer: QuestionDataRaw.level6.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question4Text, | |
| firstAnswer: QuestionDataRaw.level6.Response4One, | |
| secondAnswer: QuestionDataRaw.level6.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response4Four, | |
| correctAnswer: QuestionDataRaw.level6.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question5Text, | |
| firstAnswer: QuestionDataRaw.level6.Response5One, | |
| secondAnswer: QuestionDataRaw.level6.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response5Four, | |
| correctAnswer: QuestionDataRaw.level6.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question6Text, | |
| firstAnswer: QuestionDataRaw.level6.Response6One, | |
| secondAnswer: QuestionDataRaw.level6.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response6Four, | |
| correctAnswer: QuestionDataRaw.level6.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question7Text, | |
| firstAnswer: QuestionDataRaw.level6.Response7One, | |
| secondAnswer: QuestionDataRaw.level6.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response7Four, | |
| correctAnswer: QuestionDataRaw.level6.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question8Text, | |
| firstAnswer: QuestionDataRaw.level6.Response8One, | |
| secondAnswer: QuestionDataRaw.level6.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response8Four, | |
| correctAnswer: QuestionDataRaw.level6.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question9Text, | |
| firstAnswer: QuestionDataRaw.level6.Response9One, | |
| secondAnswer: QuestionDataRaw.level6.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response9Four, | |
| correctAnswer: QuestionDataRaw.level6.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level6.Question10Text, | |
| firstAnswer: QuestionDataRaw.level6.Response10One, | |
| secondAnswer: QuestionDataRaw.level6.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level6.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level6.Response10Four, | |
| correctAnswer: QuestionDataRaw.level6.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _SeventhLevel = () => { | |
| switch (this.state.questionNbr) { | |
| case 1: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question1Text, | |
| firstAnswer: QuestionDataRaw.level7.Response1One, | |
| secondAnswer: QuestionDataRaw.level7.Response1Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response1Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response1Four, | |
| correctAnswer: QuestionDataRaw.level7.correct1Answer, | |
| }) | |
| } | |
| case 2: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question2Text, | |
| firstAnswer: QuestionDataRaw.level7.Response2One, | |
| secondAnswer: QuestionDataRaw.level7.Response2Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response2Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response2Four, | |
| correctAnswer: QuestionDataRaw.level7.correct2Answer, | |
| }) | |
| } | |
| case 3: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question3Text, | |
| firstAnswer: QuestionDataRaw.level7.Response3One, | |
| secondAnswer: QuestionDataRaw.level7.Response3Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response3Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response3Four, | |
| correctAnswer: QuestionDataRaw.level7.correct13Answer, | |
| }) | |
| } | |
| case 4: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question4Text, | |
| firstAnswer: QuestionDataRaw.level7.Response4One, | |
| secondAnswer: QuestionDataRaw.level7.Response4Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response4Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response4Four, | |
| correctAnswer: QuestionDataRaw.level7.correct4Answer, | |
| }) | |
| } | |
| case 5: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question5Text, | |
| firstAnswer: QuestionDataRaw.level7.Response5One, | |
| secondAnswer: QuestionDataRaw.level7.Response5Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response5Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response5Four, | |
| correctAnswer: QuestionDataRaw.level7.correct5Answer, | |
| }) | |
| } | |
| case 6: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question6Text, | |
| firstAnswer: QuestionDataRaw.level7.Response6One, | |
| secondAnswer: QuestionDataRaw.level7.Response6Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response6Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response6Four, | |
| correctAnswer: QuestionDataRaw.level7.correct6Answer, | |
| }) | |
| } | |
| case 7: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question7Text, | |
| firstAnswer: QuestionDataRaw.level7.Response7One, | |
| secondAnswer: QuestionDataRaw.level7.Response7Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response7Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response7Four, | |
| correctAnswer: QuestionDataRaw.level7.correct7Answer, | |
| }) | |
| } | |
| case 8: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question8Text, | |
| firstAnswer: QuestionDataRaw.level7.Response8One, | |
| secondAnswer: QuestionDataRaw.level7.Response8Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response8Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response8Four, | |
| correctAnswer: QuestionDataRaw.level7.correct8Answer, | |
| }) | |
| } | |
| case 9: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question9Text, | |
| firstAnswer: QuestionDataRaw.level7.Response9One, | |
| secondAnswer: QuestionDataRaw.level7.Response9Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response9Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response9Four, | |
| correctAnswer: QuestionDataRaw.level7.correct9Answer, | |
| }) | |
| } | |
| case 10: { | |
| this.setState({ | |
| question: QuestionDataRaw.level7.Question10Text, | |
| firstAnswer: QuestionDataRaw.level7.Response10One, | |
| secondAnswer: QuestionDataRaw.level7.Response10Two, | |
| thirdAnswer: QuestionDataRaw.level7.Response10Three, | |
| fourthAnswer: QuestionDataRaw.level7.Response10Four, | |
| correctAnswer: QuestionDataRaw.level7.correct10Answer, | |
| }) | |
| } | |
| } | |
| } | |
| _checkAnswer(correctAnswer, firstAnswer, secondAnswer, thirdAnswer, fourthAnswer) { | |
| if (correctAnswer === firstAnswer) { | |
| this.setState({ | |
| disableOne: false, | |
| disableTwo: true, | |
| disableThree: true, | |
| disableFour: true, | |
| score: score + 10, | |
| }); | |
| } else if (correctAnswer === secondAnswer) { | |
| this.setState({ | |
| disableOne: true, | |
| disableTwo: false, | |
| disableThree: true, | |
| disableFour: true, | |
| score: score + 10, | |
| }) | |
| } else if (correctAnswer === thirdAnswer) { | |
| this.setState({ | |
| disableOne: true, | |
| disableTwo: true, | |
| disableThree: false, | |
| disableFour: true, | |
| score: score + 10, | |
| }) | |
| } else if (correctAnswer === fourthAnswer) { | |
| this.setState({ | |
| disableOne: true, | |
| disableTwo: true, | |
| disableThree: true, | |
| disableFour: false, | |
| score: score + 10, | |
| }) | |
| } | |
| } | |
| render() { | |
| //rendering the correct content | |
| return ( | |
| <Container style={styles.main} > | |
| <ImageBackground source={require('../assets/images/bg_app.png')} style={styles.bg}> | |
| <Header> | |
| <Left> | |
| <TouchableOpacity onPress={() => this._goBack()} style={{ flexDirection: 'row' }}> | |
| <ImageBackground source={require('../assets/images/left-arrow.png')} style={styles.scoreLogo} /> | |
| <Text style={styles.backText}>رجوع</Text> | |
| </TouchableOpacity> | |
| </Left> | |
| <Body style={styles.headerStyle}> | |
| <Text style={styles.text}>{this.state.doorName}</Text> | |
| </Body> | |
| <Right> | |
| <Text style={styles.score}>{this.state.score}</Text> | |
| <ImageBackground source={require('../assets/images/score.png')} style={styles.scoreLogo} /> | |
| </Right> | |
| </Header> | |
| <Content> | |
| <Card style={styles.questionCard}> | |
| <CardItem style={{ alignSelf: 'center', backgroundColor: 'rgba(19, 15, 64,0)' }}> | |
| <Text style={{ color: 'white', fontSize: 23, }}> {this.state.questionTitle}: </Text> | |
| </CardItem> | |
| <CardItem bordered style={{ alignSelf: 'center', backgroundColor: 'rgba(19, 15, 64,0.8)', borderRadius: 5, }}> | |
| <Body> | |
| <Text style={{ color: 'white', fontSize: 20, }}>this is a test{this.state.question} </Text> | |
| </Body> | |
| </CardItem> | |
| </Card> | |
| <View style={styles.body}> | |
| <ResponseButton text={this.state.firstAnswer} onPress={() => this._goBack()} disabled={this.state.disableOne} /> | |
| <ResponseButton text={this.state.secondAnswer} onPress={() => this._goBack()} disabled={this.state.disableTwo} /> | |
| <ResponseButton text={this.state.thirdAnswer} onPress={() => this._goBack()} disabled={this.state.disableThree} /> | |
| <ResponseButton text={this.state.fourthAnswer} onPress={() => this._goBack()} disabled={this.state.disableFour} /> | |
| </View> | |
| </Content> | |
| </ImageBackground> | |
| </Container> | |
| ); | |
| } | |
| } | |
| const styles = StyleSheet.create({ | |
| main: { | |
| backgroundColor: '#FFF', | |
| }, | |
| header: { | |
| flexGrow: 1, | |
| }, | |
| bg: { | |
| width: '100%', | |
| height: '100%', | |
| }, | |
| body: { | |
| marginTop: 3, | |
| justifyContent: 'center', | |
| alignItems: 'center', | |
| }, | |
| timer: { | |
| fontSize: 20, | |
| color: '#01a3a4', | |
| fontWeight: 'bold', | |
| }, | |
| bodyTopContainer: { | |
| flexGrow: 1, | |
| backgroundColor: 'white', | |
| borderColor: '#01a3a4', | |
| borderWidth: 1, | |
| borderRadius: 2, | |
| }, | |
| backButton: { | |
| color: 'white', | |
| marginLeft: 5, | |
| fontWeight: 'bold', | |
| }, | |
| text: { | |
| fontSize: 19, | |
| fontWeight: 'bold', | |
| color: 'white', | |
| marginLeft: 30, | |
| }, | |
| headerStyle: { | |
| alignSelf: 'center', | |
| marginLeft: 50, | |
| }, | |
| questionCard: { | |
| backgroundColor: 'rgba(19, 15, 64,0.8)', | |
| }, | |
| scoreLogo: { | |
| width: logoWidth, | |
| height: logoWidth, | |
| }, | |
| score: { | |
| fontSize: 22, | |
| fontWeight: 'bold', | |
| color: 'white', | |
| marginBottom: 4, | |
| marginRight: 4, | |
| }, | |
| backText: { | |
| fontSize: 18, | |
| fontWeight: 'normal', | |
| color: 'white', | |
| marginTop: 3, | |
| marginLeft: 3, | |
| } | |
| }) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment