Progress before changing timer

bcrebel · May 5, 2018 · 686c742 · 686c742
1 parent efebfbc
commit 686c742
Showing 1 changed file with 34 additions and 4 deletions.
diff --git a/src/components/Game/Cards.js b/src/components/Game/Cards.js
@@ -4,16 +4,44 @@ import styles from './Game.scss'
 import Timer from '../Timer/Timer'
 
 
+class Start extends React.Component {
+	constructor(props) {
+		super(props)
+	}
+
+	render() {
+		const greeting = this.props.newPlayer ? 'Ready for Another Round?' : 'Welcome to Memory!'
+		const Time = (
+			<div>
+				<p>Lowest Time</p>
+				<p>{this.props.lowestTime}</p>
+			</div>
+		)
+
+		return (
+			<div>
+				<h1>{greeting}</h1>
+				{this.props.lowestTime && Time}
+				<p>Choose your level</p>
+				<button>Easy</button>
+				<button>Hard</button>
+			</div>
+		)
+	}
+}
+
 class Card extends React.Component {
 	constructor(props) {
 		super(props)
 	}
 
 	render() {  
 
-		return (<li type={this.props.type} id={this.props.id} onClick={this.props.onClick} className={this.props.className}>
-			{this.props.children}
-		</li>)
+		return (
+			<li type={this.props.type} id={this.props.id} onClick={this.props.onClick} className={this.props.className}>
+				{this.props.children}
+			</li>
+		)
 	}
 }
 
@@ -123,7 +151,9 @@ class CardContainer extends React.Component {
 	render() {  
 		return (
 			<div style={{position: 'relative'}}>
-				<div style={this.state.gameStarted ? {display: 'none'} : {display: 'block'}} className={styles.start} onClick={this.formatBoard} />
+				<div style={this.state.gameStarted ? {display: 'none'} : {display: 'block'}} className={styles.start} onClick={this.formatBoard}>
+					<Start newPlayer={this.state.gameStarted} lowestTime='0:34'/>
+				</div>
 				<h1 className={styles.header}>NYT Games Code Test</h1>
 				<div className={styles.intro}>
 					<Timer />