From 2e46580c23d169c16815f7bf1084ad7c9f9d79f8 Mon Sep 17 00:00:00 2001 From: mulhoo Date: Wed, 22 Apr 2020 17:07:24 -0700 Subject: [PATCH 1/6] Partially through Wave 1 --- src/components/Game.js | 36 +++++++++++++++++--------- src/components/PlayerSubmissionForm.js | 14 +++++++--- 2 files changed, 35 insertions(+), 15 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index ad27105b..f05f8be5 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -5,13 +5,24 @@ import FinalPoem from './FinalPoem'; import RecentSubmission from './RecentSubmission'; const Game = () => { - const exampleFormat = FIELDS.map((field) => { - if (field.key) { - return field.placeholder; - } else { - return field; - } - }).join(" "); + + const [turnNumber, setTurnNumber] = useState(0) + const [submissions, setSubmissions] = useState([]) + + const handleSubmit = (submit) => { + console.log(submit) + console.log(submissions) + // Place a players submission into state + setSubmission(submissions.push) + // Update the turn. + // increment the turn number + setTurnNumber(turnNumber + 1) + } + + const placeholderText = () => { + return FIELDS[turnNumber].placeholder + } + return (
@@ -27,7 +38,11 @@ const Game = () => { - + @@ -37,7 +52,6 @@ const Game = () => { const FIELDS = [ - "The", { key: 'adj1', placeholder: 'adjective', @@ -54,7 +68,6 @@ const FIELDS = [ key: 'verb', placeholder: 'verb', }, - "the", { key: 'adj2', placeholder: 'adjective', @@ -62,8 +75,7 @@ const FIELDS = [ { key: 'noun2', placeholder: 'noun', - }, - ".", + } ]; export default Game; diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index ba19e6ef..f70bc1ac 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -1,12 +1,19 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; -const PlayerSubmissionForm = () => { +const PlayerSubmissionForm = props => { + // Handles players submission of poetry + // Hands Data back to Game + // Props: + // Placeholder text + // Turn Number + // callback + return (

Player Submission Form for Player #{ }

-
+
@@ -14,7 +21,8 @@ const PlayerSubmissionForm = () => { // Put your form inputs here... We've put in one below as an example }
From 9d309b7a6cb21a852cfbf495793be18ce8240c14 Mon Sep 17 00:00:00 2001 From: mulhoo Date: Wed, 22 Apr 2020 17:54:26 -0700 Subject: [PATCH 2/6] Wave 1 finished --- .vscode/launch.json | 17 +++++++++++++++++ src/components/Game.js | 13 ++----------- src/components/PlayerSubmissionForm.js | 18 ++++++++++++------ 3 files changed, 31 insertions(+), 17 deletions(-) create mode 100644 .vscode/launch.json diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 00000000..cf710cdc --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,17 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "node", + "request": "launch", + "name": "Launch Program", + "skipFiles": [ + "/**" + ], + "program": "${workspaceFolder}\\src\\components\\Game.js" + } + ] +} \ No newline at end of file diff --git a/src/components/Game.js b/src/components/Game.js index f05f8be5..1cc51cd4 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -10,13 +10,8 @@ const Game = () => { const [submissions, setSubmissions] = useState([]) const handleSubmit = (submit) => { - console.log(submit) - console.log(submissions) - // Place a players submission into state - setSubmission(submissions.push) - // Update the turn. - // increment the turn number - setTurnNumber(turnNumber + 1) + setSubmissions([...submissions, submit]) + setTurnNumber(turnNumber >= FIELDS.length - 1 ? 0 : (turnNumber + 1)) } const placeholderText = () => { @@ -32,10 +27,6 @@ const Game = () => {

Please follow the following format for your poetry submission:

-

- { exampleFormat } -

- { // Turn Number // callback + const [value, setValue] = useState(''); + + const handleSubmit = (event) => { + event.preventDefault(); + props.handleSubmit(value); + setValue('') + } + return (
-

Player Submission Form for Player #{ }

+

Player Submission Form for Player #{props.turnNumber + 1}

- +
- { - // Put your form inputs here... We've put in one below as an example - } setValue(e.target.value)} type="text" />
From 19f342c7960387c2ced3b8603300f539378a5383 Mon Sep 17 00:00:00 2001 From: mulhoo Date: Thu, 23 Apr 2020 10:05:07 -0700 Subject: [PATCH 3/6] fixed bug, Wave 2 complete, most Wave 3 --- src/components/FinalPoem.js | 21 +++++++++++--- src/components/Game.css | 5 ++++ src/components/Game.js | 40 +++++++++++++++++++++++--- src/components/PlayerSubmissionForm.js | 6 ---- src/components/RecentSubmission.js | 2 +- 5 files changed, 59 insertions(+), 15 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index d516184e..dee4bac8 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -1,17 +1,30 @@ -import React from 'react'; +import React, { useState } from 'react'; import './FinalPoem.css'; -const FinalPoem = (props) => { +const FinalPoem = props => { + + const handleLastSentence = () => { + return
+ } + + const handleFullPoem = () => { + let i = 0 + let j = 0 + for (i=0; i <= props.length; i++) { + return
+ } + } + return (

Final Poem

-
- + +
); diff --git a/src/components/Game.css b/src/components/Game.css index 8ff58e42..8b51353e 100644 --- a/src/components/Game.css +++ b/src/components/Game.css @@ -2,3 +2,8 @@ text-align: center; font-style: italic; } + +.sentenceStructure { + text-align: center; + font-style: italic; +} diff --git a/src/components/Game.js b/src/components/Game.js index 1cc51cd4..e230f331 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -8,15 +8,42 @@ const Game = () => { const [turnNumber, setTurnNumber] = useState(0) const [submissions, setSubmissions] = useState([]) + const [finalPoem, setFinalPoem] = useState([]) const handleSubmit = (submit) => { setSubmissions([...submissions, submit]) - setTurnNumber(turnNumber >= FIELDS.length - 1 ? 0 : (turnNumber + 1)) + if (turnNumber === FIELDS.length) { + setFinalPoem([...finalPoem, submissions]) + setTurnNumber(turnNumber === 0) + } else { + setTurnNumber(turnNumber >= FIELDS.length - 1 ? 0 : (turnNumber + 1)) + }; + }; + + const handleClickLastSentence = () => { + if (finalPoem.length > 0) { + return finalPoem[finalPoem.length - 1] + } + return
+ }; + + const handleClickAllSetences = () => { + if (finalPoem.length > 0) { + return finalPoem + } + return
} const placeholderText = () => { return FIELDS[turnNumber].placeholder - } + }; + + const renderRecentSubmissions = () => { + if (submissions.length > 0) { + return () + } + return
+ }; return ( @@ -27,7 +54,9 @@ const Game = () => {

Please follow the following format for your poetry submission:

- +

"The adjective noun adverb verb the adjective noun."

+ + {renderRecentSubmissions()} { handleSubmit={handleSubmit} /> - +
); diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 893f41a4..b7c88be4 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -2,12 +2,6 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; const PlayerSubmissionForm = props => { - // Handles players submission of poetry - // Hands Data back to Game - // Props: - // Placeholder text - // Turn Number - // callback const [value, setValue] = useState(''); diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 663da34b..bd9d70ff 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -5,7 +5,7 @@ const RecentSubmission = (props) => { return (

The Most Recent Submission

-

{ }

+

{ props.submission }

); } From cc4d951774d01917afecfaf60c893f8c6a777243 Mon Sep 17 00:00:00 2001 From: mulhoo Date: Thu, 23 Apr 2020 10:38:38 -0700 Subject: [PATCH 4/6] fixed some small things --- src/components/FinalPoem.js | 16 ++++++---------- src/components/Game.js | 11 ++--------- 2 files changed, 8 insertions(+), 19 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index dee4bac8..bb35ba1a 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -3,15 +3,11 @@ import './FinalPoem.css'; const FinalPoem = props => { - const handleLastSentence = () => { - return
- } - const handleFullPoem = () => { - let i = 0 - let j = 0 - for (i=0; i <= props.length; i++) { - return
+ for (let i=0; i <= props.finalPoem.length; i++) { + return

+ The {props.finalPoem[i][0]} {props.finalPoem[i][1]} {props.finalPoem[i][2]} {props.finalPoem[i][3]} the {props.finalPoem[i][4]} {props.finalPoem[i][5]} +

} } @@ -20,11 +16,11 @@ const FinalPoem = props => {

Final Poem

+

{props.handleFullPoem}

- - +
); diff --git a/src/components/Game.js b/src/components/Game.js index e230f331..8858cfe4 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -20,13 +20,6 @@ const Game = () => { }; }; - const handleClickLastSentence = () => { - if (finalPoem.length > 0) { - return finalPoem[finalPoem.length - 1] - } - return
- }; - const handleClickAllSetences = () => { if (finalPoem.length > 0) { return finalPoem @@ -66,8 +59,8 @@ const Game = () => { + handleFullPoem={handleClickAllSetences()} + />
); From a98f5fbdbab9736fea7dc9c11d549366de9303fb Mon Sep 17 00:00:00 2001 From: mulhoo Date: Thu, 23 Apr 2020 17:08:47 -0700 Subject: [PATCH 5/6] exorcised the demon problem that's been haunting me --- src/components/FinalPoem.js | 34 +++++++++++++++----------- src/components/Game.js | 25 ++++++++----------- src/components/PlayerSubmissionForm.js | 1 + 3 files changed, 31 insertions(+), 29 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index bb35ba1a..3c36c4d4 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -1,29 +1,35 @@ -import React, { useState } from 'react'; +import React from 'react'; import './FinalPoem.css'; const FinalPoem = props => { - const handleFullPoem = () => { - for (let i=0; i <= props.finalPoem.length; i++) { - return

- The {props.finalPoem[i][0]} {props.finalPoem[i][1]} {props.finalPoem[i][2]} {props.finalPoem[i][3]} the {props.finalPoem[i][4]} {props.finalPoem[i][5]} -

- } - } + console.log(props.sentences) + + const finalPoem = props.sentences.map((sentence, i) => { + return

+ The {sentence[0]} {sentence[1]} {sentence[2]} {sentence[3]} the {sentence[4]} {sentence[5]}. +

+ }); + + const finalPoemButton = +
+ +
+ + const finalPoemContent = finalPoem === true ?

{ finalPoem }

:

; + const conditionalButton = props.poemfinalPoem === false ?

{ finalPoemButton }

:

return (

Final Poem

-

{props.handleFullPoem}

+ {finalPoemContent}
- -
- -
+ {conditionalButton}
); -} + }; + export default FinalPoem; diff --git a/src/components/Game.js b/src/components/Game.js index 8858cfe4..480e8f89 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -8,24 +8,19 @@ const Game = () => { const [turnNumber, setTurnNumber] = useState(0) const [submissions, setSubmissions] = useState([]) - const [finalPoem, setFinalPoem] = useState([]) + const [sentences, setSentences] = useState([]) const handleSubmit = (submit) => { - setSubmissions([...submissions, submit]) - if (turnNumber === FIELDS.length) { - setFinalPoem([...finalPoem, submissions]) - setTurnNumber(turnNumber === 0) - } else { - setTurnNumber(turnNumber >= FIELDS.length - 1 ? 0 : (turnNumber + 1)) - }; + setSubmissions(submissions => submissions.concat(submit)) + setTurnNumber(turnNumber >= FIELDS.length - 1 ? 0 : (turnNumber + 1)) }; - const handleClickAllSetences = () => { - if (finalPoem.length > 0) { - return finalPoem + const checkSubmissionsArrayLength = () => { + if (submissions.length === 6) { + setSentences([...sentences, submissions]) + setSubmissions([]) } - return
- } + }; const placeholderText = () => { return FIELDS[turnNumber].placeholder @@ -50,6 +45,7 @@ const Game = () => {

"The adjective noun adverb verb the adjective noun."

{renderRecentSubmissions()} + {checkSubmissionsArrayLength()} { />
diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index b7c88be4..099f05d2 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -3,6 +3,7 @@ import './PlayerSubmissionForm.css'; const PlayerSubmissionForm = props => { + const [value, setValue] = useState(''); const handleSubmit = (event) => { From 17e401a12ca9372db80f3031174150fb9a7ee6d5 Mon Sep 17 00:00:00 2001 From: mulhoo Date: Thu, 23 Apr 2020 17:56:03 -0700 Subject: [PATCH 6/6] button works, waves complete --- src/components/FinalPoem.js | 25 +++++++++++-------------- src/components/Game.js | 9 ++++----- 2 files changed, 15 insertions(+), 19 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index 3c36c4d4..99fcb64f 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -1,9 +1,8 @@ -import React from 'react'; +import React, {useState} from 'react'; import './FinalPoem.css'; const FinalPoem = props => { - - console.log(props.sentences) + const [seePoem, setSeePoem] = useState(false) const finalPoem = props.sentences.map((sentence, i) => { return

@@ -11,25 +10,23 @@ const FinalPoem = props => {

}); - const finalPoemButton = -
- -
- - const finalPoemContent = finalPoem === true ?

{ finalPoem }

:

; - const conditionalButton = props.poemfinalPoem === false ?

{ finalPoemButton }

:

- + const toSee = () => { + setSeePoem(true); + } return (

Final Poem

- {finalPoemContent} + {seePoem == true ? finalPoem : '' }
- {conditionalButton} + +
+ +
); - }; +} export default FinalPoem; diff --git a/src/components/Game.js b/src/components/Game.js index 480e8f89..f641dcc6 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -6,9 +6,9 @@ import RecentSubmission from './RecentSubmission'; const Game = () => { - const [turnNumber, setTurnNumber] = useState(0) - const [submissions, setSubmissions] = useState([]) - const [sentences, setSentences] = useState([]) + const [turnNumber, setTurnNumber] = useState(0); + const [submissions, setSubmissions] = useState([]); + const [sentences, setSentences] = useState([]); const handleSubmit = (submit) => { setSubmissions(submissions => submissions.concat(submit)) @@ -33,7 +33,6 @@ const Game = () => { return
}; - return (

Game

@@ -54,7 +53,7 @@ const Game = () => { />