diff --git a/src/components/QuestionSearchResult.js b/src/components/QuestionSearchResult.js index 4611cdd..4817432 100644 --- a/src/components/QuestionSearchResult.js +++ b/src/components/QuestionSearchResult.js @@ -1,7 +1,6 @@ import React, { PureComponent } from 'react' import Questions from './Questions.js' -import Sleep from '../components/sleep' import constants from '../constants.json' @@ -62,7 +61,6 @@ class QuestionSearchResult extends PureComponent { } )} - ) } diff --git a/src/components/layout.js b/src/components/layout.js index d297bb4..addf087 100644 --- a/src/components/layout.js +++ b/src/components/layout.js @@ -10,6 +10,7 @@ import BB from './b.js' export default function Layout(props) { let href = props.route const [sidebarOpen, setSidebarOpen] = useState(true) + const [userId, setUserId] = useState(null) if (href === '/' || href === '') { href = 'index' @@ -23,6 +24,22 @@ export default function Layout(props) { } } + useEffect(() => { + closeSideBar() + + fetch(`${constants.apiUrl}infos`, { + credentials: 'include', + Accept: 'application/json', + 'Content-Type': 'application/json', + }) + .then((resp) => { + return resp.json() + }) + .then((data) => { + setUserId(data.uid) + }) + }, []) + useEffect(() => { closeSideBar() }, []) @@ -66,7 +83,7 @@ export default function Layout(props) { -
User # TODO
+
User #{userId}
) : null} diff --git a/src/constants.json b/src/constants.json index dec44ec..5fb043c 100644 --- a/src/constants.json +++ b/src/constants.json @@ -1,5 +1,5 @@ { - "siteUrl": "https://qmining.frylabs.net/", + "siteUrl": "http://localhost:8080/", "apiUrl": "http://localhost:8080/", "mobileWindowWidth": 700, "maxQuestionsToRender": 250 diff --git a/src/data/tabs.json b/src/data/tabs.json index 5179dbe..6b374b1 100644 --- a/src/data/tabs.json +++ b/src/data/tabs.json @@ -9,11 +9,7 @@ }, "allQuestions": { "href": "/allQuestions", - "text": "Kérdés keresés" - }, - "subjectBrowser": { - "href": "/subjectBrowser", - "text": "Tárgyak" + "text": "Kérdések és tárgyak" }, "addQuestion": { "href": "/addQuestion", diff --git a/src/defaultStyles.css b/src/defaultStyles.css index a187c12..d04cf06 100644 --- a/src/defaultStyles.css +++ b/src/defaultStyles.css @@ -226,3 +226,22 @@ a { .manualUsage { display: flex; } + +select { + cursor: pointer; + width: 100%; + max-width: 100%; + appearance: none; + border: 1px solid #99f; + box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.04); + line-height: 35px; + border-radius: 3px; + + background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'), + linear-gradient(to bottom, #222426 0%, #222426 100%); + background-repeat: no-repeat, repeat; + background-position: right 0.7em top 50%, 0 0; + background-size: 0.65em auto, 100%; + + color: white; +} diff --git a/src/pages/addQuestion.module.css b/src/pages/addQuestion.module.css index 6bbe376..a118707 100644 --- a/src/pages/addQuestion.module.css +++ b/src/pages/addQuestion.module.css @@ -63,12 +63,10 @@ .subjSelector { flex-grow: 1; background-color: var(--background-color); - font-size: 24px; - color: white; - height: 50px; } .newSubj { + width: 150px; padding: 10px; cursor: pointer; font-size: 20px; diff --git a/src/pages/allQuestions.js b/src/pages/allQuestions.js index 55e4266..8f7469f 100644 --- a/src/pages/allQuestions.js +++ b/src/pages/allQuestions.js @@ -3,6 +3,9 @@ import Head from 'next/head' import LoadingIndicator from '../components/LoadingIndicator.js' import QuestionSearchResult from '../components/QuestionSearchResult.js' +import Subject from '../components/Subject.js' +import SubjectSelector from '../components/SubjectSelector.js' +import Sleep from '../components/sleep' import styles from './allQuestions.module.css' @@ -28,17 +31,25 @@ function fetchData(db) { credentials: 'include', }) .then((resp) => { - resp.json() + return resp.json() }) - .then((data) => { + .then((resp) => { resolve({ dbName: db.name, - data: data, + data: resp, }) }) }) } +function fetchAllData(dbs) { + const promises = dbs.map((db) => { + return fetchData(db) + }) + + return Promise.all(promises) +} + function fetchDbs() { return new Promise((resolve) => { console.info('Fetching data') @@ -49,53 +60,63 @@ function fetchDbs() { return resp.json() }) .then((data) => { + console.log(data) resolve(data) }) }) } export default function AllQuestions({ router }) { + const [asd, setAsd] = useState(false) const [data, setData] = useState(null) const [dbs, setDbs] = useState(null) const [searchTerm, setSearchTerm] = useState('') + const [activeSubjName, setActiveSubjName] = useState('') useEffect(() => { router.replace(`${router.asPath.replace('.html', '')}`, undefined, { shallow: true, }) + // TODO: fix dis const querySearch = router.query.question ? decodeURIComponent(router.query.question) : '' + console.log(querySearch) fetchDbs().then((res) => { setDbs(res) - console.log(res) }) - // fetchData().then((result) => { - // setData(result) - - // setSearchTerm(querySearch) - // }) }, []) - return ( -
- - Qmining - Kérdés keresés | Frylabs.net - - {dbs ? ( + const renderDbSelector = () => { + if (dbs) { + return ( <> - ) : null} - {data ? ( - <> -
- { - setSearchTerm(event.target.value) - router.replace( - `${router.pathname}${event.target.value && - '?question='}${encodeURIComponent(event.target.value)}`, - undefined, - { shallow: true } - ) + ) + } else { + return null + } + } + + const renderSubjectBrowser = () => { + let currSubj = data + ? data.find((subj) => { + return subj.Name === activeSubjName + }) + : {} + + return ( +
+ + Qmining - Tárgyak | Frylabs.net + + {data ? ( + <> +
+ { + setSearchTerm(event.target.value) + }} + /> + +
+
+ { + setActiveSubjName(subjName) }} /> - -
-
-
- -
- +
+
{/*{qCount} kérdés, {sCount} tárgy */}
+ +
+ +
+ + ) : ( + + )} +
+ ) + } + + const renderQuestionBrowser = () => { + return ( +
+ + Qmining - Kérdés keresés | Frylabs.net + + {data ? ( + <> +
+ { + setSearchTerm(event.target.value) + router.replace( + `${router.pathname}${event.target.value && + '?question='}${encodeURIComponent(event.target.value)}`, + undefined, + { shallow: true } + ) + }} + /> + +
+
+
+ +
+ + ) : null} +
+ ) + } + + return ( +
+ {dbs && renderDbSelector()} +
+
setAsd(false)} + > + Kérdések +
+
setAsd(true)} + > + Tárgyak +
+
+ {dbs ? ( +
{asd ? renderSubjectBrowser() : renderQuestionBrowser()}
) : ( )} diff --git a/src/pages/allQuestions.module.css b/src/pages/allQuestions.module.css index 15580ff..f67d0b7 100644 --- a/src/pages/allQuestions.module.css +++ b/src/pages/allQuestions.module.css @@ -20,3 +20,28 @@ cursor: pointer; border: none; } + +.typeSelector { + margin: 10px 0px; + height: 50px; + display: flex; +} + +.typeSelector div { + display: flex; + align-items: center; + justify-content: center; + flex: 1; + + font-size: 18px; + color: #fff; + cursor: pointer; +} + +.typeSelector div:hover { + background-color: #333; +} + +.activeTypeSelector { + background-color: #444; +} diff --git a/src/pages/ranklist.js b/src/pages/ranklist.js index 79f74af..412734e 100644 --- a/src/pages/ranklist.js +++ b/src/pages/ranklist.js @@ -97,15 +97,13 @@ export default function RankList() { setRanklist(null) getListFromServer(since) .then((data) => { - console.log(data) setRanklist(data.list || []) setSum(data.sum || {}) if (data.selfuserId) { setSelfUserId(data.selfuserId) } }) - .catch((error) => { - console.error(error) + .catch(() => { setRanklist(null) }) } diff --git a/src/pages/subjectBrowser.js b/src/pages/subjectBrowser.js deleted file mode 100644 index a53e7e3..0000000 --- a/src/pages/subjectBrowser.js +++ /dev/null @@ -1,87 +0,0 @@ -import React, { useState, useEffect } from 'react' -import fetch from 'unfetch' -import Head from 'next/head' - -import LoadingIndicator from '../components/LoadingIndicator.js' -import Subject from '../components/Subject.js' -import SubjectSelector from '../components/SubjectSelector.js' -import Sleep from '../components/sleep' - -import styles from './subjectBrowser.module.css' - -export default function SubjectBrowser({ getData }) { - const [data, setData] = useState(null) - const [activeSubjName, setActiveSubjName] = useState('') - const [searchTerm, setSearchTerm] = useState('') - - const [sCount, setSCount] = useState(0) - const [qCount, setQCount] = useState(0) - - useEffect(() => { - getData().then((result) => { - setData(result) - setSCount(result.length) - setQCount( - result.reduce((acc, subj) => { - return acc + subj.Questions.length - }, 0) - ) - }) - }, []) - - let currSubj = data - ? data.find((subj) => { - return subj.Name === activeSubjName - }) - : {} - - return ( -
- - Qmining - Tárgyak | Frylabs.net - - {data ? ( - <> -
- { - setSearchTerm(e.target.value) - }} - /> - -
- { - setActiveSubjName(subjName) - }} - /> -
-
- {qCount} kérdés, {sCount} tárgy -
- -
- -
- - ) : ( - - )} -
- ) -} diff --git a/src/pages/subjectBrowser.module.css b/src/pages/subjectBrowser.module.css deleted file mode 100644 index a166353..0000000 --- a/src/pages/subjectBrowser.module.css +++ /dev/null @@ -1,23 +0,0 @@ -.searchBar { - margin: 10px; - color: white; - background-color: #222426; - border: none; - font-size: 18px; - flex-grow: 1; -} - - -.searchContainer { - width: 100%; - display: flex; -} - -.clearButton { - width: 80px; - background-color: var(--background-color); - color: white; - font-size: 23px; - cursor: pointer; - border: none; -}