diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js
index d516184e..01b8ef8d 100644
--- a/src/components/FinalPoem.js
+++ b/src/components/FinalPoem.js
@@ -3,18 +3,34 @@ import './FinalPoem.css';
const FinalPoem = (props) => {
+ const finishedPoem = props.poem.map((line) => {
return (
-
+
{line}
+ )
+ })
+
+ if(props.poemStatus){
+ return(
+
Final Poem
-
+
+ {finishedPoem}
+
+
-
-
-
+ )
+ }else{
+ return(
+
+
+
+ { props.showPoemCallback()} }/>
- );
+ )}
+
+
}
export default FinalPoem;
diff --git a/src/components/Game.js b/src/components/Game.js
index e99f985a..2b1ad8ac 100644
--- a/src/components/Game.js
+++ b/src/components/Game.js
@@ -8,9 +8,46 @@ class Game extends Component {
constructor(props) {
super(props);
+
+ this.state = {
+ recentLine: "",
+ submissions: [],
+ poemFinished: false,
+ playerNum: 1
+ }
+ }
+
+ showPoem = () => {
+
+ this.setState({
+ poemFinished: true
+ }
+ )
+ console.log(this.state)
+
+ }
+
+ addLine = (words) => {
+
+
+ const wordArray = Object.values(words)
+ const line = `The ${wordArray[0]} ${wordArray[1]} ${wordArray[2]} ${wordArray[3]} the ${wordArray[4]} ${wordArray[5]}.`
+
+ this.setState({
+ recentLine: line,
+ playerNum: this.state.playerNum + 1
+ })
+ this.state.submissions.push(line)
+
}
render() {
+ let recentSubmission = ""
+ if (this.state.submissions.length >= 1 && !this.state.poemFinished){
+ recentSubmission =
+ }
+
+
const exampleFormat = FIELDS.map((field) => {
if (field.key) {
@@ -32,11 +69,12 @@ class Game extends Component {
{ exampleFormat }
-
+
+ {recentSubmission}
-
+ { this.state.poemFinished ? "" :
}
-
+
);
diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js
index 1de05095..ee9e68c5 100644
--- a/src/components/PlayerSubmissionForm.js
+++ b/src/components/PlayerSubmissionForm.js
@@ -2,32 +2,94 @@ import React, { Component } from 'react';
import './PlayerSubmissionForm.css';
class PlayerSubmissionForm extends Component {
+fieldState = () => {
+ let fieldState = {}
+ this.props.fields.forEach((field) => {
+ if(field.key) {
+ fieldState[field.key] = ""
+ }
+
+ })
+ return fieldState
+}
constructor(props) {
super(props);
+
+
+ this.state = this.fieldState()
+ }
+
+
+
+ onInputChange = (event) => {
+ const updatedState = {};
+
+ const field = event.target.name;
+ const value = event.target.value;
+
+ updatedState[field] = value;
+ this.setState(updatedState);
+ }
+
+ checkSubmission = () => {
+ let check = true
+ this.props.fields.forEach((field) => {
+ if (field === ""){
+ check = false
+ }
+
+ })
+ return check
}
+ onSubmit = (event) => {
+ event.preventDefault();
+ if (this.checkSubmission()) {
+ this.props.addLineCallback(this.state)
+ }
+
+ this.setState(this.fieldState());
+
+ }
+
+
render() {
+
+ console.log(this.state)
+ const playerForm = this.props.fields.map((field, i) => {
+ if(field.key) {
+ return(