From 0a8d025ce5f1752e1a92c2fc1a01fa7b35fa1da6 Mon Sep 17 00:00:00 2001 From: YlvaKarlsson Date: Tue, 14 Mar 2023 15:56:50 +0100 Subject: [PATCH 01/10] Added some components and started with the survey --- code/.eslintrc.json | 35 +++++++++--------- code/.vscode/settings.json | 6 ++++ code/package-lock.json | 49 -------------------------- code/package.json | 3 +- code/src/App.js | 35 +++++++++++++++--- code/src/components/FormRadioButton.js | 31 ++++++++++++++++ code/src/components/FormTextField.js | 0 code/src/components/Question.js | 14 ++++++++ 8 files changed, 102 insertions(+), 71 deletions(-) create mode 100644 code/.vscode/settings.json create mode 100644 code/src/components/FormRadioButton.js create mode 100644 code/src/components/FormTextField.js create mode 100644 code/src/components/Question.js diff --git a/code/.eslintrc.json b/code/.eslintrc.json index c9c0675c3..df2fbad96 100644 --- a/code/.eslintrc.json +++ b/code/.eslintrc.json @@ -36,25 +36,25 @@ "arrow-body-style": "off", "class-methods-use-this": "off", "brace-style": [ - "error", + "warn", "1tbs", { "allowSingleLine": true } ], "comma-dangle": [ - "error", + "warn", "never" ], "consistent-return": "off", - "curly": "error", + "curly": "warn", "eol-last": "off", "import/extensions": "off", "import/no-extraneous-dependencies": "off", "import/no-unresolved": "off", "import/prefer-default-export": "off", "indent": [ - "error", + "warn", 2, { "SwitchCase": 1 @@ -62,14 +62,15 @@ ], "jsx-a11y/anchor-is-valid": "off", "jsx-a11y/label-has-for": "off", + "jsx-a11y/label-has-associated-control": "off", "jsx-a11y/href-no-hash": "off", "no-alert": "off", "no-console": "off", "no-debugger": "off", "no-else-return": "off", - "no-irregular-whitespace": "error", + "no-irregular-whitespace": "warn", "no-multiple-empty-lines": [ - "error", + "warn", { "max": 1 } @@ -77,7 +78,7 @@ "no-param-reassign": "off", "no-restricted-syntax": "off", "object-curly-newline": [ - "error", + "warn", { "ObjectExpression": { "consistent": true @@ -87,44 +88,44 @@ } } ], - "prefer-template": "error", + "prefer-template": "warn", "react/destructuring-assignment": "off", "react/forbid-prop-types": "off", "react/jsx-closing-bracket-location": [ - "error", + "warn", { "selfClosing": "after-props", "nonEmpty": "after-props" } ], "react/jsx-curly-spacing": [ - "error", + "warn", { "when": "never", "children": true } ], "react/jsx-filename-extension": "off", - "react/jsx-no-bind": "error", + "react/jsx-no-bind": "warn", "react/jsx-uses-react": "warn", "react/jsx-wrap-multilines": "off", "react/jsx-one-expression-per-line": "off", "react/no-danger": "off", - "react/no-did-mount-set-state": "error", - "react/no-did-update-set-state": "error", - "react/no-direct-mutation-state": "error", + "react/no-did-mount-set-state": "warn", + "react/no-did-update-set-state": "warn", + "react/no-direct-mutation-state": "warn", "react/no-multi-comp": [ - "error", + "warn", { "ignoreStateless": true } ], - "react/no-string-refs": "error", + "react/no-string-refs": "warn", "react/prop-types": "off", "react/require-extension": "off", "react/sort-comp": "off", "react/jsx-indent": "off", - "react-hooks/rules-of-hooks": "error", + "react-hooks/rules-of-hooks": "warn", "react-hooks/exhaustive-deps": "warn", "semi": "off" } diff --git a/code/.vscode/settings.json b/code/.vscode/settings.json new file mode 100644 index 000000000..fa03d4e65 --- /dev/null +++ b/code/.vscode/settings.json @@ -0,0 +1,6 @@ +{ + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + }, + "eslint.validate": ["javascript"] +} \ No newline at end of file diff --git a/code/package-lock.json b/code/package-lock.json index e34d9bb1c..3a317936e 100644 --- a/code/package-lock.json +++ b/code/package-lock.json @@ -9,7 +9,6 @@ "version": "1.0.0", "dependencies": { "@babel/eslint-parser": "^7.18.9", - "babel-eslint": "^10.1.0", "eslint": "^8.21.0", "eslint-config-airbnb": "^19.0.4", "eslint-plugin-import": "^2.26.0", @@ -4637,34 +4636,6 @@ "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", "integrity": "sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==" }, - "node_modules/babel-eslint": { - "version": "10.1.0", - "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz", - "integrity": "sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==", - "deprecated": "babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.", - "dependencies": { - "@babel/code-frame": "^7.0.0", - "@babel/parser": "^7.7.0", - "@babel/traverse": "^7.7.0", - "@babel/types": "^7.7.0", - "eslint-visitor-keys": "^1.0.0", - "resolve": "^1.12.0" - }, - "engines": { - "node": ">=6" - }, - "peerDependencies": { - "eslint": ">= 4.12.1" - } - }, - "node_modules/babel-eslint/node_modules/eslint-visitor-keys": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz", - "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==", - "engines": { - "node": ">=4" - } - }, "node_modules/babel-jest": { "version": "27.5.1", "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-27.5.1.tgz", @@ -20687,26 +20658,6 @@ "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", "integrity": "sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==" }, - "babel-eslint": { - "version": "10.1.0", - "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz", - "integrity": "sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==", - "requires": { - "@babel/code-frame": "^7.0.0", - "@babel/parser": "^7.7.0", - "@babel/traverse": "^7.7.0", - "@babel/types": "^7.7.0", - "eslint-visitor-keys": "^1.0.0", - "resolve": "^1.12.0" - }, - "dependencies": { - "eslint-visitor-keys": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz", - "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==" - } - } - }, "babel-jest": { "version": "27.5.1", "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-27.5.1.tgz", diff --git a/code/package.json b/code/package.json index 7214c8fde..d64f7045b 100644 --- a/code/package.json +++ b/code/package.json @@ -18,7 +18,8 @@ "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", - "lint": "eslint ." + "lint": "eslint .", + "fix": "eslint --fix ." }, "browserslist": { "production": [ diff --git a/code/src/App.js b/code/src/App.js index f2007d229..6e40566b6 100644 --- a/code/src/App.js +++ b/code/src/App.js @@ -1,9 +1,36 @@ -import React from 'react'; +import Question from 'components/Question'; +import FormRadioButton from 'components/FormRadioButton'; +import FormTextField from 'components/FormTextField'; +import React, { useState } from 'react'; export const App = () => { + const [questionNo, setQuestionNo] = useState(0); + const [favoriteIceCream, setFavoriteIceCream] = useState(''); + // const [name, setName] = useState(''); + + // setExampleVariable('second value'); + // 1 > 2 && ==0 + // const handleNextClick = () => { + // console.log('counter before increase, counter'); + // setCounter(1) + // console.log('counter after increase, counter'); + // } + return ( -
- Find me in src/app.js! -
+ <> +
+ {questionNo === 0 && (} />)} + {questionNo === 1 && ()} + {questionNo === 2 && ()} + {questionNo >= 3 && (

Slut

)} + + + {/* */} + ); } diff --git a/code/src/components/FormRadioButton.js b/code/src/components/FormRadioButton.js new file mode 100644 index 000000000..cc3d0c894 --- /dev/null +++ b/code/src/components/FormRadioButton.js @@ -0,0 +1,31 @@ +/* eslint-disable max-len */ +import React from 'react'; + +const handleChange = () => { + // get data from radio buttons + // save with setFavIceCream + + setQuestionNo(questionNo + 1) + // ... +} + +const FormRadioButton = ({ favoriteIceCream, setFavoriteIceCream, questionNo, setQuestionNo }) => { + return ( +
+ + + +
+ ); +} + +export default FormRadioButton; \ No newline at end of file diff --git a/code/src/components/FormTextField.js b/code/src/components/FormTextField.js new file mode 100644 index 000000000..e69de29bb diff --git a/code/src/components/Question.js b/code/src/components/Question.js new file mode 100644 index 000000000..868225035 --- /dev/null +++ b/code/src/components/Question.js @@ -0,0 +1,14 @@ +import React from 'react'; + +const Question = ({ question, form }) => { + return ( +
+

{question.header}

+

{question.text}

+ {form} +
+ + ) +} + +export default Question; \ No newline at end of file From eaae3e82f44e7e03717d370395d56b9a73fded11 Mon Sep 17 00:00:00 2001 From: YlvaKarlsson Date: Tue, 14 Mar 2023 17:41:49 +0100 Subject: [PATCH 02/10] Minor fixes, pausing for now --- code/src/App.js | 31 +++++++++++++++++--------- code/src/components/FormRadioButton.js | 11 ++++----- code/src/components/FormSelect.js | 17 ++++++++++++++ code/src/index.css | 20 +++++++++++++++++ 4 files changed, 64 insertions(+), 15 deletions(-) create mode 100644 code/src/components/FormSelect.js diff --git a/code/src/App.js b/code/src/App.js index 6e40566b6..7c1180a4f 100644 --- a/code/src/App.js +++ b/code/src/App.js @@ -1,31 +1,40 @@ import Question from 'components/Question'; import FormRadioButton from 'components/FormRadioButton'; import FormTextField from 'components/FormTextField'; +import FormSelect from 'components/FormSelect'; import React, { useState } from 'react'; +import './index.css'; export const App = () => { const [questionNo, setQuestionNo] = useState(0); - const [favoriteIceCream, setFavoriteIceCream] = useState(''); - // const [name, setName] = useState(''); + const [favoriteAnimal, setFavoriteAnimal] = useState(''); + const [name, setName] = useState(''); - // setExampleVariable('second value'); - // 1 > 2 && ==0 - // const handleNextClick = () => { - // console.log('counter before increase, counter'); - // setCounter(1) - // console.log('counter after increase, counter'); // } + // first question - Radio Buttons // + // second question - Select field // + // third question - Freetext field // + return ( <>
+ {questionNo === 0 && (} />)} - {questionNo === 1 && ()} + favoriteAnimal={favoriteAnimal} />} />)} + {questionNo === 1 && ()} {questionNo === 2 && ()} {questionNo >= 3 && (

Slut

)} @@ -34,3 +43,5 @@ export const App = () => { ); } + +export default App; \ No newline at end of file diff --git a/code/src/components/FormRadioButton.js b/code/src/components/FormRadioButton.js index cc3d0c894..4de339547 100644 --- a/code/src/components/FormRadioButton.js +++ b/code/src/components/FormRadioButton.js @@ -1,7 +1,8 @@ /* eslint-disable max-len */ import React from 'react'; -const handleChange = () => { +const handleChange = (event) => { + console.log(event.target.value); // get data from radio buttons // save with setFavIceCream @@ -9,18 +10,18 @@ const handleChange = () => { // ... } -const FormRadioButton = ({ favoriteIceCream, setFavoriteIceCream, questionNo, setQuestionNo }) => { +const FormRadioButton = ({ favoriteAnimal, setFavoriteAnimal, questionNo, setQuestionNo }) => { return (
-
diff --git a/code/src/components/FormRadioButtons/FormRadioButtons.module.css b/code/src/components/FormRadioButtons/FormRadioButtons.module.css new file mode 100644 index 000000000..aabe5fd6b --- /dev/null +++ b/code/src/components/FormRadioButtons/FormRadioButtons.module.css @@ -0,0 +1,8 @@ +.formRadioButtons { + display: flex; + flex-direction: column; + } + + .label { + padding: 6rem; + } \ No newline at end of file diff --git a/code/src/components/Question.js b/code/src/components/Questions/Question.js similarity index 91% rename from code/src/components/Question.js rename to code/src/components/Questions/Question.js index 0e59b6bee..2051091e0 100644 --- a/code/src/components/Question.js +++ b/code/src/components/Questions/Question.js @@ -1,6 +1,7 @@ -import React from 'react'; - -import FormRadioButton from './FormRadioButton'; +import React, { useState } from 'react'; +import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; +import FormRadioButton from '../FormRadioButtons/FormRadioButton'; +import styles from './Questions.module.css'; const Question = ({ question, questionNo, setQuestionNo, answers }) => { const nextQuestion = () => { diff --git a/code/src/components/Questions/Questions.module.css b/code/src/components/Questions/Questions.module.css new file mode 100644 index 000000000..8b0d4b2a4 --- /dev/null +++ b/code/src/components/Questions/Questions.module.css @@ -0,0 +1,7 @@ +.questions { + display: flex; + flex-direction: column; + align-items: center; + font-family: Verdana, Geneva, Tahoma, sans-serif; + color: #7e49df; +} \ No newline at end of file diff --git a/code/src/components/Start/StartSurvey.js b/code/src/components/Start/StartSurvey.js new file mode 100644 index 000000000..5e390e611 --- /dev/null +++ b/code/src/components/Start/StartSurvey.js @@ -0,0 +1,31 @@ +import React from 'react'; +import styles from './StartSurvey.module.css'; + +const Start = (props) => { + const handleSubmit = (event) => { + props.setName(event.target.usernameInput.value); + props.nextPage(); + }; + + return ( +
+
+

What personality type do you have?

+

First, please write your name here:

+
+ + + +
+
+
+ ); +}; + +export default Start; \ No newline at end of file diff --git a/code/src/components/Start/StartSurvey.module.css b/code/src/components/Start/StartSurvey.module.css new file mode 100644 index 000000000..8f5499a1f --- /dev/null +++ b/code/src/components/Start/StartSurvey.module.css @@ -0,0 +1,33 @@ +@font-face { + font-family: Verdana, Geneva, Tahoma, sans-serif; +} + +.titleContainer { + display: flex; + flex-direction: column; + align-items: center; + font-family: Verdana, Geneva, Tahoma, sans-serif; + color:aqua; +} + +h2 { + font-size: 15px; +} + +.form { + display: flex; + flex-direction: column; +} + +.input { + background: transparent; + border: 0; + border-bottom: 1rem solid #c507f5; +} + +.startButton { + background-color: #4430f6; + border-radius: 2rem; + font-family:Verdana, Geneva, Tahoma, sans-serif; + padding: 4rem; +} \ No newline at end of file From 2923c930d19ad8ef3223c5ab984e627557f3d14b Mon Sep 17 00:00:00 2001 From: YlvaKarlsson Date: Fri, 17 Mar 2023 18:07:33 +0100 Subject: [PATCH 05/10] still trying but with so many errors --- code/src/App.js | 113 ++++++------- code/src/components/EndSurvey/EndSurvey.js | 35 ++++ .../components/EndSurvey/EndSurvey.module.css | 28 ++++ .../FormRadioButtons/FormRadioButton.js | 25 +-- code/src/components/FormSelect.js | 4 +- code/src/components/Questions/Question.js | 155 +++++++++++------- .../components/Questions/Questions.module.css | 20 +++ code/src/components/Start/StartSurvey.js | 4 +- .../components/Start/StartSurvey.module.css | 2 + code/src/index.js | 7 +- code/src/library/answers.js | 2 + 11 files changed, 252 insertions(+), 143 deletions(-) create mode 100644 code/src/components/EndSurvey/EndSurvey.js create mode 100644 code/src/components/EndSurvey/EndSurvey.module.css diff --git a/code/src/App.js b/code/src/App.js index 65326b28d..6bee8bd7f 100644 --- a/code/src/App.js +++ b/code/src/App.js @@ -1,80 +1,63 @@ -import Question from 'components/Questions/Question'; -import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; -import FormTextField from 'components/FormTextField'; -import FormSelect from 'components/FormSelect'; +/* eslint-disable react/react-in-jsx-scope */ import React, { useState } from 'react'; +import StartSurvey from 'components/Start/StartSurvey'; +import Question from 'components/Questions/Question'; +import EndSurvey from './.components/EndSurvey/EndSurvey'; import './index.css'; -export const App = () => { - const [questionNo, setQuestionNo] = useState(0); +// import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; +// import FormTextField from 'components/FormTextField'; +// import FormSelect from 'components/FormSelect'; + +const App = () => { + // const [questionNo, setQuestionNo] = useState(0); const [name, setName] = useState(''); - const [question1Answer, setQuestion1Answer] = useState(''); - const [question2Answer, setQuestion2Answer] = useState(''); - const [question3Answer, setQuestion3Answer] = useState(''); - const [question4Answer, setQuestion4Answer] = useState(''); - const nextQuestion = () => { - setQuestionNo(questionNo + 1); - }; - // } + const [page, setPage] = useState('start'); + const [question1, setQuestion1] = useState(''); + const [question2, setQuestion2] = useState(''); + const [question3, setQuestion3] = useState(''); + const [question4, setQuestion4] = useState(''); + // const nextQuestion = () => { + // setQuestionNo(questionNo + 1); + // }; // first question - Radio Buttons // // second question - Select field // // third question - Freetext field // return ( -
- {questionNo === 0 && ( -
- - - -
+
+ {page === 'start' && ( + { + setPage('questions'); + }} + setName={setName} + name={name} /> )} - {questionNo === 1 && ()} - - {questionNo === 2 && ()} - - {questionNo === 3 && ()} - - {questionNo === 4 && ()} - - {questionNo >= 5 && (

The end

)} - - {false && ( - <> - {/* */} - - + {page === 'questions' && ( + setPage('end')} + question1={question1} + setQuestion1={question1} + question2={question2} + setQuestion2={question2} + question3={question3} + setQuestion3={question3} + question4={question4} + setQuestion4={question4} /> )} - - + {page === 'end' && ( + setPage('start')} + name={name} + question1={question1} + question2={question2} + question3={question3} + question4={question4} /> + )} +
); -} +}; export default App; \ No newline at end of file diff --git a/code/src/components/EndSurvey/EndSurvey.js b/code/src/components/EndSurvey/EndSurvey.js new file mode 100644 index 000000000..77cbb8a3e --- /dev/null +++ b/code/src/components/EndSurvey/EndSurvey.js @@ -0,0 +1,35 @@ +import React from 'react'; +import { answersQ1 } from 'lib/questions'; +import styles from './EndSurvey.module.css'; + +const EndSurvey = (props) => { + let yourPersonality; + if (props.question1 === answersQ1[0]) { + yourPersonality = 'Stubborn!'; + } else if (props.question1 === answersQ1[1]) { + yourPersonality = 'Happy!'; + } else if (props.question1 === answersQ1[2]) { + yourPersonality = 'Quiet!'; + } else if (props.question1 === answersQ1[3]) { + yourPersonality = 'Outgoing!'; + } + + return ( +
+
+

Which tech entrepreneur named his son X Æ A-12:

+ {props.question1} +

Johhny Depp is famously afraid of what:

+ {props.question2} +

Which pop star is the godmother of both of Elton John`'`s sons:

+ {props.question3} +

What did you hate sharing as a kid?:

+ {props.question4} +

{props.name}, You have this personality:

+ {yourPersonality} +
+
+ ); +}; + +export default EndSurvey; \ No newline at end of file diff --git a/code/src/components/EndSurvey/EndSurvey.module.css b/code/src/components/EndSurvey/EndSurvey.module.css new file mode 100644 index 000000000..15b50bc12 --- /dev/null +++ b/code/src/components/EndSurvey/EndSurvey.module.css @@ -0,0 +1,28 @@ +.yourPersonality { + font-size: 20px; + } + + p { + font-family: 'verdana'; + } + .end { + display: flex; + flex-direction: column; + align-items: center; + } + .answer { + background-color: black; + padding: 6px; + color: black; + border-radius: 5px; + font-family: 'verdana'; + } + + .finalPersonality { + font-size: 40px; + background-color: #c5c667; + padding: 6px; + color: black; + border-radius: 5px; + font-family: 'verdana'; + } \ No newline at end of file diff --git a/code/src/components/FormRadioButtons/FormRadioButton.js b/code/src/components/FormRadioButtons/FormRadioButton.js index 02216df41..4b4fb1cb2 100644 --- a/code/src/components/FormRadioButtons/FormRadioButton.js +++ b/code/src/components/FormRadioButtons/FormRadioButton.js @@ -7,25 +7,28 @@ const handleChange = (event) => { // get data from radio buttons // save with setAndTheNameYouWantToCallIt // ... + // changed from "answers" to "props" - the orange letters below } -const FormRadioButton = ({ answers }) => { +const FormRadioButton = ({ props }) => { + console.log(props.question2); + console.log('props', props); + return ( -
- {answers.map((answer) => ( -
- ); -} + + ))}; export default FormRadioButton; \ No newline at end of file diff --git a/code/src/components/FormSelect.js b/code/src/components/FormSelect.js index 5e4c0fb76..d4e65726d 100644 --- a/code/src/components/FormSelect.js +++ b/code/src/components/FormSelect.js @@ -10,11 +10,11 @@ const FormSelect = ({ answers }) => { {answers.map((answer) => ( ))} ); -} +}; export default FormSelect; \ No newline at end of file diff --git a/code/src/components/Questions/Question.js b/code/src/components/Questions/Question.js index 2051091e0..e536ae249 100644 --- a/code/src/components/Questions/Question.js +++ b/code/src/components/Questions/Question.js @@ -1,98 +1,133 @@ import React, { useState } from 'react'; import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; +import FormTextField from 'components/FormTextField'; +import FormSelect from 'components/FormSelect'; import FormRadioButton from '../FormRadioButtons/FormRadioButton'; import styles from './Questions.module.css'; - -const Question = ({ question, questionNo, setQuestionNo, answers }) => { +/* {FormRadioButton + answers={answers} + value={question} + onChange={setQuestionNo} /> */ +/* First question */ +// outcommented from props by now: question, questionNo, setQuestionNo, answers +const Questions = (props) => { + // new code to try + const [question, SetQuestion] = useState(1); + // new code ends const nextQuestion = () => { setQuestionNo(questionNo + 1); }; const previousQuestion = () => { setQuestionNo(questionNo - 1); - }; - - // const Question = () => { + return ( -
-
- {/* {FormRadioButton - answers={answers} - value={question} - onChange={setQuestionNo} /> */} - {/* First question */} -
-

{question.header}

-

{question.text}

- {questionNo === 1 && ()} + <> + {question === 1 && ( +
+

Question 1

+

Which tech entrepreneur named his son X Æ A-12?

+ + + -
- {/* Second question */} -
-

{question.header}

-

{question.text}

- {questionNo === 2 && ()} + )} + {question === 2 && ( +
+

Question 2

+

Johhny Depp is famously afraid of what?

+
+ +
+
- {/* Third question */} -
-

{question.header}

-

{question.text}

- {questionNo === 3 && ()} + )} + {question === 3 && ( +
+

Question 3

+

Which pop star is the godmother of both of Elton John`'`s sons?

+
- {/* Fourth question */} -
-

{question.header}

-

{question.text}

- {questionNo === 4 && ()} + )} + {question === 4 && ( +
+

Question 4

+

What did you hate sharing as a kid?

+
-
-
- ) -} + )} + + ); +}; + export default Question; \ No newline at end of file diff --git a/code/src/components/Questions/Questions.module.css b/code/src/components/Questions/Questions.module.css index 8b0d4b2a4..af5207e27 100644 --- a/code/src/components/Questions/Questions.module.css +++ b/code/src/components/Questions/Questions.module.css @@ -4,4 +4,24 @@ align-items: center; font-family: Verdana, Geneva, Tahoma, sans-serif; color: #7e49df; +} + +.dropdown { + color: #7e49df; + margin-bottom: 20px; + border: 0; + border-bottom: 2px solid #7e49df; + outline: 0; + font-size: 20px; + padding: 7px 0; + background: transparent; + transition: 0.2s; +} + +.pageButton { + margin-top: 30px; + background-color: ##7e49df; + border-radius: 5px; + font-family: Verdana; + padding: 10px 50px; } \ No newline at end of file diff --git a/code/src/components/Start/StartSurvey.js b/code/src/components/Start/StartSurvey.js index 5e390e611..aec66d310 100644 --- a/code/src/components/Start/StartSurvey.js +++ b/code/src/components/Start/StartSurvey.js @@ -11,7 +11,7 @@ const Start = (props) => {

What personality type do you have?

-

First, please write your name here:

+

First, what is your name?

{ required />
diff --git a/code/src/components/Start/StartSurvey.module.css b/code/src/components/Start/StartSurvey.module.css index 8f5499a1f..1b4f9f07e 100644 --- a/code/src/components/Start/StartSurvey.module.css +++ b/code/src/components/Start/StartSurvey.module.css @@ -17,6 +17,8 @@ h2 { .form { display: flex; flex-direction: column; + border: solid black 2rem; + /*borders will be deleted later*/ } .input { diff --git a/code/src/index.js b/code/src/index.js index 99f6d0de7..6083d53de 100644 --- a/code/src/index.js +++ b/code/src/index.js @@ -1,7 +1,8 @@ +/* eslint-disable react/react-in-jsx-scope */ import React from 'react'; -import { createRoot } from 'react-dom/client' -import './index.css' -import { App } from './App' +import { createRoot } from 'react-dom/client'; +import './index.css'; +import { App } from './App'; const container = document.getElementById('root'); const root = createRoot(container); diff --git a/code/src/library/answers.js b/code/src/library/answers.js index 2b951f056..1580f7261 100644 --- a/code/src/library/answers.js +++ b/code/src/library/answers.js @@ -1,3 +1,5 @@ +import React from 'react'; + export const answersQ1 = [ 'Mark Zuckerberg', 'Steve Jobs', From f6989260ffe442bc359e0966b5777e4fcb2ae7c6 Mon Sep 17 00:00:00 2001 From: YlvaKarlsson Date: Fri, 17 Mar 2023 23:23:29 +0100 Subject: [PATCH 06/10] Still so many errors but too tired to keep on now --- code/src/App.js | 7 ++++-- code/src/assets/nextarrow.svg | Bin 0 -> 8283 bytes code/src/assets/previousarrow.svg | Bin 0 -> 8359 bytes code/src/assets/submiticon.svg | 1 + code/src/components/Buttons/NextButton.js | 22 +++++++++++++++++ code/src/components/Buttons/PreviousButton.js | 20 +++++++++++++++ code/src/components/Buttons/SubmitButton.js | 20 +++++++++++++++ code/src/components/ProgressCounter.js | 13 ++++++++++ code/src/components/Questions/Question.js | 9 ++++--- code/src/components/Start/NameInput.js | 23 ++++++++++++++++++ code/src/components/Start/StartSurvey.js | 1 + code/src/components/SubmitScreen.js | 22 +++++++++++++++++ code/src/index.css | 6 +++++ 13 files changed, 139 insertions(+), 5 deletions(-) create mode 100644 code/src/assets/nextarrow.svg create mode 100644 code/src/assets/previousarrow.svg create mode 100644 code/src/assets/submiticon.svg create mode 100644 code/src/components/Buttons/NextButton.js create mode 100644 code/src/components/Buttons/PreviousButton.js create mode 100644 code/src/components/Buttons/SubmitButton.js create mode 100644 code/src/components/ProgressCounter.js create mode 100644 code/src/components/Start/NameInput.js create mode 100644 code/src/components/SubmitScreen.js diff --git a/code/src/App.js b/code/src/App.js index 6bee8bd7f..c0e2ac104 100644 --- a/code/src/App.js +++ b/code/src/App.js @@ -2,6 +2,9 @@ import React, { useState } from 'react'; import StartSurvey from 'components/Start/StartSurvey'; import Question from 'components/Questions/Question'; +import SubmitScreen from 'components/SubmitScreen'; +import NameInput from 'components/Start/NameInput'; +import ProgressCounter from 'components/ProgressCounter'; import EndSurvey from './.components/EndSurvey/EndSurvey'; import './index.css'; @@ -9,8 +12,8 @@ import './index.css'; // import FormTextField from 'components/FormTextField'; // import FormSelect from 'components/FormSelect'; -const App = () => { - // const [questionNo, setQuestionNo] = useState(0); +export const App = () => { + const [counter, setCounter] = useState(0); const [name, setName] = useState(''); const [page, setPage] = useState('start'); const [question1, setQuestion1] = useState(''); diff --git a/code/src/assets/nextarrow.svg b/code/src/assets/nextarrow.svg new file mode 100644 index 0000000000000000000000000000000000000000..dec666ce7ba719ac9cef2a883cfc407f0f741d8c GIT binary patch literal 8283 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 NLq+#qrIK~T{{whHXEp!; literal 0 HcmV?d00001 diff --git a/code/src/assets/previousarrow.svg b/code/src/assets/previousarrow.svg new file mode 100644 index 0000000000000000000000000000000000000000..bf34826b740cd8c92592453db3b639a9dc64ab4e GIT binary patch literal 8359 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 literal 0 HcmV?d00001 diff --git a/code/src/assets/submiticon.svg b/code/src/assets/submiticon.svg new file mode 100644 index 000000000..4c2cf56a0 --- /dev/null +++ b/code/src/assets/submiticon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/code/src/components/Buttons/NextButton.js b/code/src/components/Buttons/NextButton.js new file mode 100644 index 000000000..f3a258b04 --- /dev/null +++ b/code/src/components/Buttons/NextButton.js @@ -0,0 +1,22 @@ +import React from 'react'; +import NextArrow from './assets/nextarrow.svg'; + +const NextButton = ({ counter, setCounter }) => { + const handleIncreaseCounterClick = () => { + setCounter(counter + 1); + } + + return ( +

+ +
+ ); +}; + +export default NextButton; \ No newline at end of file diff --git a/code/src/components/Buttons/PreviousButton.js b/code/src/components/Buttons/PreviousButton.js new file mode 100644 index 000000000..d46e03c9d --- /dev/null +++ b/code/src/components/Buttons/PreviousButton.js @@ -0,0 +1,20 @@ +import React from 'react'; +import PreviousArrow from './assets/previousarrow.svg'; + +const PreviousButton = ({ counter, setCounter }) => { + const PreviousClick = () => { + setCounter(counter - 1); + } + + return ( + + ); +}; + +export default PreviousButton; \ No newline at end of file diff --git a/code/src/components/Buttons/SubmitButton.js b/code/src/components/Buttons/SubmitButton.js new file mode 100644 index 000000000..4bb57125f --- /dev/null +++ b/code/src/components/Buttons/SubmitButton.js @@ -0,0 +1,20 @@ +import React from 'react'; +import SubmitIcon from './assets/submit.svg'; + +const SubmitButton = ({ counter, setCounter }) => { + const Submit = () => { + setCounter(counter + 1); + } + + return ( +
+ + ); + }; + +export default SubmitButton; \ No newline at end of file diff --git a/code/src/components/ProgressCounter.js b/code/src/components/ProgressCounter.js new file mode 100644 index 000000000..e1e34c336 --- /dev/null +++ b/code/src/components/ProgressCounter.js @@ -0,0 +1,13 @@ +import React from 'react'; + +const ProgressCounter = ({ counter }) => { + return ( +
+ {counter > 0 && ( + `Progress: ${counter}/4` + )} +
+ ) +} + +export default ProgressCounter; \ No newline at end of file diff --git a/code/src/components/Questions/Question.js b/code/src/components/Questions/Question.js index e536ae249..b959a1107 100644 --- a/code/src/components/Questions/Question.js +++ b/code/src/components/Questions/Question.js @@ -3,6 +3,8 @@ import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; import FormTextField from 'components/FormTextField'; import FormSelect from 'components/FormSelect'; import FormRadioButton from '../FormRadioButtons/FormRadioButton'; +import NextButton from './assets/nextbutton.svg'; +import PreviousButton from './assets/previousbutton.svg'; import styles from './Questions.module.css'; /* {FormRadioButton answers={answers} @@ -32,13 +34,14 @@ const Questions = (props) => { value={props.question1} onChange={props.setQuestion1} /> - + */}
)} {question === 2 && ( @@ -130,4 +133,4 @@ const Questions = (props) => { ); }; -export default Question; \ No newline at end of file +export default Questions; \ No newline at end of file diff --git a/code/src/components/Start/NameInput.js b/code/src/components/Start/NameInput.js new file mode 100644 index 000000000..5ef5772bf --- /dev/null +++ b/code/src/components/Start/NameInput.js @@ -0,0 +1,23 @@ +import React from 'react'; +import NextButton from 'components/Buttons/NextButton'; +import PreviousButton from 'components/Buttons/PreviousButton'; + +const NameInput = ({ counter, setCounter, name, setName }) => { + return ( +
+

First, what is your name?

+ setName(event.target.value)} /> +
+ + +
+
+ ) +} + +export default NameInput; \ No newline at end of file diff --git a/code/src/components/Start/StartSurvey.js b/code/src/components/Start/StartSurvey.js index aec66d310..cb4de388c 100644 --- a/code/src/components/Start/StartSurvey.js +++ b/code/src/components/Start/StartSurvey.js @@ -1,4 +1,5 @@ import React from 'react'; +import NextButton from 'components/Buttons/NextButton'; import styles from './StartSurvey.module.css'; const Start = (props) => { diff --git a/code/src/components/SubmitScreen.js b/code/src/components/SubmitScreen.js new file mode 100644 index 000000000..13a9a9738 --- /dev/null +++ b/code/src/components/SubmitScreen.js @@ -0,0 +1,22 @@ +import React from 'react'; + +// will add more here tomorrow - NOT FINISHED // +const SubmitScreen = ({ name }) => { + return ( +
+

Thanks for taking this survey today!

+

Your name is:

+

{name}

+

Q1 - You thought that - put the answer in here

+

/ TO DO

+

Q2 - You thought that - put the answer in here

+

/ TO DO

+

Q3 - You thought that - put the answer in here

+

/ TO DO

+

Q4 - You thought that - put the answer in here

+

/ TO DO

+
+ ); +}; + +export default SubmitScreen; \ No newline at end of file diff --git a/code/src/index.css b/code/src/index.css index af8927bfe..23e278b90 100644 --- a/code/src/index.css +++ b/code/src/index.css @@ -31,3 +31,9 @@ code { grid-template-columns: 1em auto; gap: 0.5em; } + +.progressCounter { + position: absolute; + bottom: 4%; + right: 4%; +} From 938c0a1cc41eda7bea055a7998edc3aa20afbee0 Mon Sep 17 00:00:00 2001 From: YlvaKarlsson Date: Sun, 19 Mar 2023 23:25:08 +0100 Subject: [PATCH 07/10] so ugly but finally it works! --- code/src/App.js | 120 +++++++++------- code/src/assets/nextarrow.svg | Bin 8283 -> 0 bytes code/src/assets/previousarrow.svg | Bin 8359 -> 0 bytes code/src/assets/submiticon.svg | 1 - code/src/components/Buttons/NextButton.js | 22 --- code/src/components/Buttons/PreviousButton.js | 20 --- code/src/components/Buttons/SubmitButton.js | 20 --- code/src/components/Comments.js | 23 +++ code/src/components/EndSurvey.js | 17 +++ code/src/components/EndSurvey/EndSurvey.js | 35 ----- .../components/EndSurvey/EndSurvey.module.css | 28 ---- code/src/components/Favoriteplace.js | 47 ++++++ .../FormRadioButtons/FormRadioButton.js | 34 ----- .../FormRadioButtons.module.css | 8 -- code/src/components/FormSelect.js | 20 --- code/src/components/FormTextField.js | 11 -- code/src/components/NameInput.js | 23 +++ code/src/components/ProgressCounter.js | 13 -- code/src/components/Questions/Question.js | 136 ------------------ .../components/Questions/Questions.module.css | 27 ---- code/src/components/Slider.js | 22 +++ code/src/components/Start/NameInput.js | 23 --- code/src/components/Start/StartSurvey.js | 32 ----- .../components/Start/StartSurvey.module.css | 35 ----- code/src/components/SubmitScreen.js | 22 --- code/src/components/Time.js | 27 ++++ code/src/index.css | 78 ++++++++-- code/src/library/answers.js | 26 ---- 28 files changed, 293 insertions(+), 577 deletions(-) delete mode 100644 code/src/assets/nextarrow.svg delete mode 100644 code/src/assets/previousarrow.svg delete mode 100644 code/src/assets/submiticon.svg delete mode 100644 code/src/components/Buttons/NextButton.js delete mode 100644 code/src/components/Buttons/PreviousButton.js delete mode 100644 code/src/components/Buttons/SubmitButton.js create mode 100644 code/src/components/Comments.js create mode 100644 code/src/components/EndSurvey.js delete mode 100644 code/src/components/EndSurvey/EndSurvey.js delete mode 100644 code/src/components/EndSurvey/EndSurvey.module.css create mode 100644 code/src/components/Favoriteplace.js delete mode 100644 code/src/components/FormRadioButtons/FormRadioButton.js delete mode 100644 code/src/components/FormRadioButtons/FormRadioButtons.module.css delete mode 100644 code/src/components/FormSelect.js delete mode 100644 code/src/components/FormTextField.js create mode 100644 code/src/components/NameInput.js delete mode 100644 code/src/components/ProgressCounter.js delete mode 100644 code/src/components/Questions/Question.js delete mode 100644 code/src/components/Questions/Questions.module.css create mode 100644 code/src/components/Slider.js delete mode 100644 code/src/components/Start/NameInput.js delete mode 100644 code/src/components/Start/StartSurvey.js delete mode 100644 code/src/components/Start/StartSurvey.module.css delete mode 100644 code/src/components/SubmitScreen.js create mode 100644 code/src/components/Time.js delete mode 100644 code/src/library/answers.js diff --git a/code/src/App.js b/code/src/App.js index c0e2ac104..15b201cee 100644 --- a/code/src/App.js +++ b/code/src/App.js @@ -1,66 +1,78 @@ /* eslint-disable react/react-in-jsx-scope */ import React, { useState } from 'react'; -import StartSurvey from 'components/Start/StartSurvey'; -import Question from 'components/Questions/Question'; -import SubmitScreen from 'components/SubmitScreen'; -import NameInput from 'components/Start/NameInput'; -import ProgressCounter from 'components/ProgressCounter'; -import EndSurvey from './.components/EndSurvey/EndSurvey'; -import './index.css'; +import NameInput from 'components/NameInput'; +import Favoriteplace from 'components/Favoriteplace'; +import Time from 'components/Time'; +import Comments from 'components/Comments'; +import Slider from 'components/Slider'; +import EndSurvey from 'components/EndSurvey'; -// import { answersQ1, answersQ2, answersQ3, answersQ4 } from 'library/answers'; -// import FormTextField from 'components/FormTextField'; -// import FormSelect from 'components/FormSelect'; +import './index.css'; export const App = () => { - const [counter, setCounter] = useState(0); + const [step, setStep] = useState(1); const [name, setName] = useState(''); - const [page, setPage] = useState('start'); - const [question1, setQuestion1] = useState(''); - const [question2, setQuestion2] = useState(''); - const [question3, setQuestion3] = useState(''); - const [question4, setQuestion4] = useState(''); - // const nextQuestion = () => { - // setQuestionNo(questionNo + 1); - // }; + const [favoriteplace, setFavoriteplace] = useState(''); + const [time, setTime] = useState(''); + const [comments, setComments] = useState(''); + const [slider, setSlider] = useState(''); + const [submitted, setSubmitted] = useState(false); + const [progress, setProgress] = useState(0); + + const handleStepIncrease = () => { + const increment = 100 / 5; + setStep(step + 1); + setProgress(progress + increment); + } - // first question - Radio Buttons // - // second question - Select field // - // third question - Freetext field // + const handleSubmit = (e) => { + e.preventDefault(); + setSubmitted(true); + }; return ( -
- {page === 'start' && ( - { - setPage('questions'); - }} - setName={setName} - name={name} /> - )} - {page === 'questions' && ( - setPage('end')} - question1={question1} - setQuestion1={question1} - question2={question2} - setQuestion2={question2} - question3={question3} - setQuestion3={question3} - question4={question4} - setQuestion4={question4} /> - )} - {page === 'end' && ( - setPage('start')} - name={name} - question1={question1} - question2={question2} - question3={question3} - question4={question4} /> +
+

Please fill in this survey about your favorite place!

+ {submitted ? ( + // eslint-disable-next-line max-len + + ) : ( +
+ {step === 1 && ( + + )} + {step === 2 && ( + + )} + {step === 3 && ( +
); -}; - -export default App; \ No newline at end of file +} \ No newline at end of file diff --git a/code/src/assets/nextarrow.svg b/code/src/assets/nextarrow.svg deleted file mode 100644 index dec666ce7ba719ac9cef2a883cfc407f0f741d8c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 8283 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 NLq+#qrIK~T{{whHXEp!; diff --git a/code/src/assets/previousarrow.svg b/code/src/assets/previousarrow.svg deleted file mode 100644 index bf34826b740cd8c92592453db3b639a9dc64ab4e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 8359 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 diff --git a/code/src/assets/submiticon.svg b/code/src/assets/submiticon.svg deleted file mode 100644 index 4c2cf56a0..000000000 --- a/code/src/assets/submiticon.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/code/src/components/Buttons/NextButton.js b/code/src/components/Buttons/NextButton.js deleted file mode 100644 index f3a258b04..000000000 --- a/code/src/components/Buttons/NextButton.js +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react'; -import NextArrow from './assets/nextarrow.svg'; - -const NextButton = ({ counter, setCounter }) => { - const handleIncreaseCounterClick = () => { - setCounter(counter + 1); - } - - return ( -

- -
- ); -}; - -export default NextButton; \ No newline at end of file diff --git a/code/src/components/Buttons/PreviousButton.js b/code/src/components/Buttons/PreviousButton.js deleted file mode 100644 index d46e03c9d..000000000 --- a/code/src/components/Buttons/PreviousButton.js +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import PreviousArrow from './assets/previousarrow.svg'; - -const PreviousButton = ({ counter, setCounter }) => { - const PreviousClick = () => { - setCounter(counter - 1); - } - - return ( - - ); -}; - -export default PreviousButton; \ No newline at end of file diff --git a/code/src/components/Buttons/SubmitButton.js b/code/src/components/Buttons/SubmitButton.js deleted file mode 100644 index 4bb57125f..000000000 --- a/code/src/components/Buttons/SubmitButton.js +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import SubmitIcon from './assets/submit.svg'; - -const SubmitButton = ({ counter, setCounter }) => { - const Submit = () => { - setCounter(counter + 1); - } - - return ( -
- - ); - }; - -export default SubmitButton; \ No newline at end of file diff --git a/code/src/components/Comments.js b/code/src/components/Comments.js new file mode 100644 index 000000000..44d02521a --- /dev/null +++ b/code/src/components/Comments.js @@ -0,0 +1,23 @@ +import React from 'react'; + +const Comments = ({ comments, setComments }) => { + const handleCommentsChange = (event) => { + setComments(event.target.value); + } + return ( + // eslint-disable-next-line jsx-a11y/label-has-associated-control +