Created
May 14, 2018 01:50
-
-
Save jmercedes/df77854b2b13444e413cfde41d669ced to your computer and use it in GitHub Desktop.
This file contains hidden or 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 logo from './logo.svg'; | |
import './App.css'; | |
const value1 = Math.floor(Math.random() * 100); | |
const value2 = Math.floor(Math.random() * 100); | |
const value3 = Math.floor(Math.random() * 100); | |
const proposedAnswer = Math.floor(Math.random() * 3) + value1 + value2 + value3; | |
let numQuestions = 0; | |
let numCorrect = 0; | |
class App extends Component { | |
state = { | |
values: [value1: 42, value2: 35, value3: 48], | |
proposedAnswer: 125, | |
numQuestions: 0, | |
numCorrect: 0 | |
} | |
handleClick = (event) => { | |
event.preventDefault(); | |
this.setState((prevState)=> { | |
if ((prevState.proposedAnswer === (this.state.values[0] + this.state.values[1] + this.state.values[2])) && (event.target.innerHTML.toLowerCase() == true )) { | |
return { | |
values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)), | |
proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2], | |
numCorrect: prevState.numCorrect + 1, | |
numQuestions: prevState.numQuestions + 1 | |
} | |
} | |
else if ((prevState.proposedAnswer === (this.state.values[0] + this.state.values[1] + this.state.values[2])) && (event.target.innerHTML.toLowerCase() == false)) { | |
return { | |
values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)), | |
proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2], | |
numCorrect: prevState.numCorrect + 1, | |
numQuestions: prevState.numQuestions + 1 | |
} | |
} | |
else { | |
return { | |
values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)), | |
proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2], | |
numQuestions: prevState.numQuestions + 1 | |
} | |
} | |
}) | |
console.log(this.state.values[1]); | |
const reducer = (accumulator, currentValue) => accumulator + currentValue; | |
console.log(this.state.values.reduce(reducer)); | |
console.log(event.target.innerHTML.toLowerCase()); | |
} | |
render() { | |
return ( | |
<div className="App"> | |
<header className="App-header"> | |
<img src={logo} className="App-logo" alt="logo" /> | |
<h1 className="App-title">ReactND - Coding Practice</h1> | |
</header> | |
<div className="game"> | |
<h2>Mental Math</h2> | |
<div className="equation"> | |
<p className="text"> | |
{`${this.state.values[0]} + ${this.state.values[1]} + ${this.state.values[2]} = ${this.state.proposedAnswer}`}</p> | |
</div> | |
<button onClick={this.handleClick}>True</button> | |
<button onClick={this.handleClick}>False</button> | |
<p className="text"> | |
Your Score: {this.state.numCorrect}/{this.state.numQuestions} | |
</p> | |
<p>{this.state.value1}</p> | |
</div> | |
</div> | |
); | |
} | |
} | |
export default App; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment