diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js
index d516184e..98811967 100644
--- a/src/components/FinalPoem.js
+++ b/src/components/FinalPoem.js
@@ -1,20 +1,38 @@
import React from 'react';
import './FinalPoem.css';
+import PropTypes from 'prop-types';
const FinalPoem = (props) => {
+ const sentences = props.sentences.map((sentence, i) => {
+ return (
+
{ sentence }
+ );
+ })
return (
);
}
+FinalPoem.propTypes = {
+ sentences: PropTypes.arrayOf(PropTypes.string).isRequired,
+ completedGame: PropTypes.bool.isRequired,
+ onPoemComplete: PropTypes.func.isRequired
+}
export default FinalPoem;
+
+
diff --git a/src/components/Game.js b/src/components/Game.js
index e99f985a..bda48852 100644
--- a/src/components/Game.js
+++ b/src/components/Game.js
@@ -8,6 +8,24 @@ class Game extends Component {
constructor(props) {
super(props);
+
+ this.state = {
+ sentences: [],
+ completed: false
+ }
+ }
+
+ onPlayerSubmit = (submissionData) => {
+ this.setState({
+ sentences: this.state.sentences.concat(submissionData)
+ })
+
+ }
+
+ completePoem = () => {
+ this.setState({
+ completed: true
+ })
}
render() {
@@ -20,6 +38,8 @@ class Game extends Component {
}
}).join(" ");
+ const lastIndex= this.state.sentences.length - 1
+
return (
Game
@@ -32,11 +52,15 @@ class Game extends Component {
{ exampleFormat }
-
+
+ {
+ !this.state.completed &&
+
+ }
-
+
-
+
);
diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js
index 1de05095..7a19096e 100644
--- a/src/components/PlayerSubmissionForm.js
+++ b/src/components/PlayerSubmissionForm.js
@@ -1,28 +1,99 @@
import React, { Component } from 'react';
import './PlayerSubmissionForm.css';
+import PropTypes from 'prop-types';
class PlayerSubmissionForm extends Component {
constructor(props) {
super(props);
+ this.state = {
+ words: ["", "", "", "", "", ""],
+ count: 1
+ }
}
+ onInputChange = (event) => {
+ const name = event.target.name
+ const value = event.target.value
+
+ const index = parseInt(name, 10);
+ let oldWords = this.state.words;
+ oldWords[index] = value
+
+ this.setState({
+ words: oldWords
+ })
+ }
+
+ clickedPlayerSubmission = (event) => {
+ event.preventDefault()
+ const sentence = this.state.words.join(" ")
+ this.props.onFormSubmit(sentence)
+ this.setState({
+ words: ["", "", "", "", "", ""],
+ count: this.state.count + 1
+ })
+ }
+
+
render() {
return (
-
Player Submission Form for Player #{ }
+
Player Submission Form for Player #{this.state.count }
-