diff --git a/src/data/tabs.json b/src/data/tabs.json
index e7e44f1..100ee65 100644
--- a/src/data/tabs.json
+++ b/src/data/tabs.json
@@ -15,6 +15,10 @@
"href": "/subjectBrowser",
"text": "Tárgyak"
},
+ "addQuestion": {
+ "href": "/addQuestion",
+ "text": "Kérdés beküldés"
+ },
"pwRequest": {
"href": "/pwRequest",
"text": "Jelszó kérés"
diff --git a/src/pages/addQuestion.js b/src/pages/addQuestion.js
new file mode 100644
index 0000000..c3aa5d7
--- /dev/null
+++ b/src/pages/addQuestion.js
@@ -0,0 +1,300 @@
+import React, { useState, useEffect } from 'react'
+import fetch from 'unfetch'
+
+import LoadingIndicator from '../components/LoadingIndicator.js'
+
+import styles from './addQuestion.module.css'
+import constants from '../constants.json'
+
+const getDefaultQuestion = () => {
+ return {
+ Q: '',
+ A: '',
+ data: { type: 'simple' }
+ }
+}
+
+export default function AddQuestion (props) {
+ const [form, setForm] = useState({ quiz: [getDefaultQuestion()] })
+ const [subjects, setSubjects] = useState(undefined)
+ const [isNewSubj, setIsNewSubj] = useState(false)
+
+ useEffect(() => {
+ console.info('Fetching subject names')
+ fetch(`${constants.apiUrl}dataCount?detailed=true`, {
+ credentials: 'include'
+ })
+ .then((resp) => {
+ return resp.json()
+ })
+ .then((data) => {
+ let res = data.map((x) => {
+ return x.name
+ })
+ res = res.sort()
+ setSubjects(res)
+ })
+ }, [])
+
+ const onChange = (newData, index) => {
+ let quiz = form.quiz
+ quiz[index] = newData
+
+ setForm({
+ ...form,
+ quiz: quiz
+ })
+ }
+
+ const renderQuestionInput = (params) => {
+ const { index, onChange } = params
+ const currData = form.quiz[index]
+ const { Q, A, data } = form.quiz[index] || {}
+
+ return (
+
+ )
+ }
+
+ const deleteQuestion = (index) => {
+ let quiz = form.quiz
+
+ quiz.splice(index, 1)
+
+ setForm({
+ ...form,
+ quiz: quiz
+ })
+ }
+
+ const handleSubmit = async () => {
+ if (!form.subj) {
+ alert('Nem választottál ki tantárgyat!') // eslint-disable-line
+ return
+ }
+ let isValid = form.quiz.every((x) => {
+ return x.Q && x.A
+ })
+ if (!isValid || form.quiz.length === 0) {
+ alert('Kérdés kitöltése kötelező!') // eslint-disable-line
+ return
+ }
+
+ const t = document.getElementById('cid').value
+ let cid = ''
+ let version = ''
+ if (t) {
+ cid = t.split('|')[0]
+ version = t.split('|')[1]
+ }
+
+ const rawResponse = await fetch(constants.apiUrl + 'isAdding', {
+ method: 'POST',
+ credentials: 'include',
+ headers: {
+ 'Accept': 'application/json',
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({
+ ...form,
+ id: cid,
+ version: 'WEBSITE',
+ scriptVersion: version
+ })
+ })
+ rawResponse.json()
+ .then((resp) => {
+ if (resp.success) {
+ alert('Sikeres beküldés, ' + resp.newQuestions + ' új kérdés') // eslint-disable-line
+ } else {
+ console.log(resp)
+ alert('Hiba beküldés közben :/') // eslint-disable-line
+ }
+ })
+ .catch((e) => {
+ alert('Hiba beküldés közben :/') // eslint-disable-line
+ console.log(e)
+ })
+ }
+
+ const renderStuff = (props) => {
+ return (
+
+ {form.quiz.map((q, i) => {
+ return (
+
+ {renderQuestionInput({
+ index: i,
+ onChange
+ })}
+
+ )
+ })}
+
+ {
+ let quiz = form.quiz
+ quiz.push(getDefaultQuestion())
+ setForm({
+ ...form,
+ quiz: quiz
+ })
+ }}
+ >
+ Új kérdés hozzáadása
+
+
+
+
+ Kérdések beküldése
+
+
+
+
+ )
+ }
+
+ const renderSubjSelector = (props) => {
+ // TODO: handle if new subject
+ return (
+
+ {isNewSubj
+ ? {
+ setForm({
+ ...form,
+ subj: e.target.value
+ })
+ }} />
+ : {
+ setForm({
+ ...form,
+ subj: subjects[e.target.value]
+ })
+ }}>
+ Válassz egy tárgyat...
+ {props.subjects.map((subjName, i) => {
+ return (
+ {subjName}
+ )
+ })}
+
+
+
+ }
+ { setIsNewSubj(!isNewSubj) }}
+ >
+ {isNewSubj
+ ? 'Létező tárgy ...'
+ : 'Új tárgy ...'
+ }
+
+
+ )
+ }
+
+ const renderUsage = () => {
+ return (
+
+
+ Ezen az oldalon kérdéseket tudsz beküldeni manuálisan.
+
+
+ Egyszerre csak egy tárgyhoz lehet kérdéseket hozzáadni, de ahhoz bármennyit
+
+
+ Ezek a kérdések ellenőrizve lesznek hogy megvannak-e már
+
+
+ Kérdéseknél az utolsó sor (ahol a JSON cucc van) jelenleg nem módosítható, csak olyan
+ kérdéseket lehet beküldeni, amik sima kérdés-válaszok, szóval pl nincs benne kép. Ez
+ később bővül majd
+
+
+ Bármilyen szöveget beküldhettek, de ne tegyétek, más felhasználókkal és magatokkal szúrtok
+ ki, ty!
+
+
+
+ )
+ }
+
+ if (subjects) {
+ return (
+
+ {renderUsage()}
+
+ {renderSubjSelector({ subjects })}
+ {renderStuff()}
+
+ )
+ } else {
+ return (
+
+ )
+ }
+}
diff --git a/src/pages/addQuestion.module.css b/src/pages/addQuestion.module.css
new file mode 100644
index 0000000..2710d89
--- /dev/null
+++ b/src/pages/addQuestion.module.css
@@ -0,0 +1,85 @@
+.questionInput {
+ flex-grow: 1;
+ font-size: 22px;
+ background-color: var(--background-color);
+ color: white;
+ border: none;
+ padding: 8px;
+ border: 1px solid;
+ border-color: var(--background-color);
+}
+
+.questionContainer {
+ margin-top: 30px;
+ margin-bottom: 30px;
+ margin-right: 10px;
+ margin-left: 10px;
+}
+
+.inputContainer {
+ width: 100%;
+ display: flex;
+}
+
+.buttonContainer {
+ text-align: "center";
+ width: 200px;
+ margin: 0 auto;
+ padding: 10px;
+}
+
+.deleteButton {
+ padding: 6px;
+ font-size: 22px;
+ background-color: var(--background-color);
+ color: white;
+ cursor: pointer;
+ border: 1px solid;
+ border-color: var(--background-color);
+}
+
+.questionInput:hover {
+ border: 1px solid;
+}
+
+.deleteButton:hover {
+ border: 1px solid;
+}
+
+.button {
+ cursor: pointer;
+ background-color: var(--text-color);
+ border: none;
+ padding: 10px 30px;
+ color: white;
+ width: 200px;
+}
+
+.subjSelectorContainer {
+ width: 100%;
+ display: flex;
+}
+
+.subjSelector {
+ flex-grow: 1;
+ background-color: var(--background-color);
+ font-size: 24px;
+ color: white;
+ height: 50px;
+}
+
+.newSubj {
+ padding: 10px;
+ cursor: pointer;
+ font-size: 20px;
+ color: white;
+}
+
+.usage li {
+ margin: 5px;
+}
+
+.usage {
+ font-size: 18px;
+ color: white;
+}