mirror of
https://gitlab.com/MrFry/qmining-page
synced 2025-04-01 20:23:44 +02:00
Merge branch 'new_style-2' into new_style
This commit is contained in:
mrfry
commit
03aefe21b4
18 changed files with 461 additions and 522 deletions
|
|
@ -1,4 +1,4 @@
|
|||
import React, { PureComponent } from 'react'
|
||||
import React from 'react'
|
||||
|
||||
import Questions from './Questions.js'
|
||||
|
||||
|
|
@ -8,75 +8,74 @@ const countReducer = (acc, subj) => {
|
|||
return acc + subj.Questions.length
|
||||
}
|
||||
|
||||
class QuestionSearchResult extends PureComponent {
|
||||
render() {
|
||||
const { data, searchTerm } = this.props
|
||||
export default function QuestionSearchResult({ data, searchTerm }) {
|
||||
let subjs = []
|
||||
let results = -1
|
||||
|
||||
let subjs = []
|
||||
let results = -1
|
||||
|
||||
if (searchTerm) {
|
||||
subjs = data.reduce((acc, subj) => {
|
||||
const resultQuestions = subj.Questions.reduce((qacc, question) => {
|
||||
const keys = ['Q', 'A', 'data']
|
||||
keys.some((key) => {
|
||||
if (typeof question[key] !== 'string') {
|
||||
return false
|
||||
}
|
||||
if (
|
||||
question[key] &&
|
||||
question[key].toLowerCase().includes(searchTerm.toLowerCase())
|
||||
) {
|
||||
qacc.push(question)
|
||||
return true
|
||||
}
|
||||
})
|
||||
return qacc
|
||||
}, [])
|
||||
if (resultQuestions.length > 0) {
|
||||
acc.push({
|
||||
Name: subj.Name,
|
||||
Questions: resultQuestions,
|
||||
})
|
||||
}
|
||||
return acc
|
||||
if (searchTerm) {
|
||||
subjs = data.reduce((acc, subj) => {
|
||||
const resultQuestions = subj.Questions.reduce((qacc, question) => {
|
||||
const keys = ['Q', 'A', 'data']
|
||||
keys.some((key) => {
|
||||
if (typeof question[key] !== 'string') {
|
||||
return false
|
||||
}
|
||||
if (
|
||||
question[key] &&
|
||||
question[key].toLowerCase().includes(searchTerm.toLowerCase())
|
||||
) {
|
||||
qacc.push(question)
|
||||
return true
|
||||
}
|
||||
})
|
||||
return qacc
|
||||
}, [])
|
||||
results = subjs.reduce(countReducer, 0)
|
||||
} else {
|
||||
results = data.reduce(countReducer, 0)
|
||||
}
|
||||
if (resultQuestions.length > 0) {
|
||||
acc.push({
|
||||
Name: subj.Name,
|
||||
Questions: resultQuestions,
|
||||
})
|
||||
}
|
||||
return acc
|
||||
}, [])
|
||||
results = subjs.reduce(countReducer, 0)
|
||||
} else {
|
||||
results = data.reduce(countReducer, 0)
|
||||
}
|
||||
|
||||
const renderCount = () => {
|
||||
return (
|
||||
const renderCount = () => {
|
||||
return (
|
||||
<div>
|
||||
<div>
|
||||
<div>
|
||||
{searchTerm ? '' : 'Kezdj el írni kereséshez! '}
|
||||
{`${results} találat, ${subjs.length} tárgyból`}
|
||||
</div>
|
||||
{results === 0 && (
|
||||
<div>
|
||||
{
|
||||
'Pontos egyezést keres a kereső, próbálj kisebb részletre keresni'
|
||||
}
|
||||
</div>
|
||||
)}
|
||||
{searchTerm ? '' : 'Kezdj el írni kereséshez! '}
|
||||
{`${results} találat, ${subjs.length || data.length} tárgyból`}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{results === 0 && (
|
||||
<div>
|
||||
{'Pontos egyezést keres a kereső, próbálj kisebb részletre keresni'}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (results > constants.maxQuestionsToRender) {
|
||||
return renderCount()
|
||||
} else {
|
||||
return (
|
||||
if (results > constants.maxQuestionsToRender) {
|
||||
return (
|
||||
<div>
|
||||
{renderCount()}
|
||||
{searchTerm ? (
|
||||
<div>Szűkítsd a keresést találatok megjelenítéséhez!</div>
|
||||
) : null}
|
||||
</div>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<div>
|
||||
<div>{renderCount()}</div>
|
||||
<div>
|
||||
<div>{renderCount()}</div>
|
||||
<div>
|
||||
<Questions subjs={subjs} />
|
||||
</div>
|
||||
<Questions subjs={subjs} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default QuestionSearchResult
|
||||
|
|
|
|||
22
src/components/externalLinkIcon.js
Normal file
22
src/components/externalLinkIcon.js
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
import React from 'react'
|
||||
|
||||
export default function ExternalLinkIcon({ size }) {
|
||||
return (
|
||||
<span style={{ margin: '4px', display: 'inline-block' }}>
|
||||
<svg
|
||||
width={size}
|
||||
height={size}
|
||||
viewBox={`0 0 24 24`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeWidth="2"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
>
|
||||
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
|
||||
<polyline points="15 3 21 3 21 9"></polyline>
|
||||
<line x1="10" y1="14" x2="21" y2="3"></line>
|
||||
</svg>
|
||||
</span>
|
||||
)
|
||||
}
|
||||
|
|
@ -15,6 +15,51 @@ const renderSnow = () => {
|
|||
return date.getMonth() === 11 && date.getDate() > 5
|
||||
}
|
||||
|
||||
function MessageButton({
|
||||
userSpecificMotd,
|
||||
setShowMotdModal,
|
||||
refetchGlobalData,
|
||||
}) {
|
||||
return (
|
||||
<div className="msgs">
|
||||
<div
|
||||
onClick={() => {
|
||||
if (!userSpecificMotd) {
|
||||
return
|
||||
}
|
||||
setShowMotdModal(true)
|
||||
if (userSpecificMotd.seen) {
|
||||
return
|
||||
}
|
||||
fetch(constants.apiUrl + 'infos', {
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
userSpecificMotdSeen: true,
|
||||
}),
|
||||
})
|
||||
.then((resp) => {
|
||||
return resp.json()
|
||||
})
|
||||
.then(() => {
|
||||
refetchGlobalData()
|
||||
})
|
||||
}}
|
||||
style={{ cursor: userSpecificMotd ? 'pointer' : 'default' }}
|
||||
title={
|
||||
userSpecificMotd && !userSpecificMotd.seen ? "You've got Mail!" : ''
|
||||
}
|
||||
>
|
||||
{userSpecificMotd && !userSpecificMotd.seen ? '📬' : '📭'}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default function Layout({
|
||||
children,
|
||||
route,
|
||||
|
|
@ -25,6 +70,7 @@ export default function Layout({
|
|||
const [sidebarOpen, setSidebarOpen] = useState(true)
|
||||
const [windowSize, setWindowSize] = useState([100, 200])
|
||||
const [showMotdModal, setShowMotdModal] = useState(false)
|
||||
const [donateShowing, setDonateShowing] = useState(false)
|
||||
const [showNewMsgModal, setShowNewMsgModal] = useState(true)
|
||||
|
||||
const userId = globalData.userId
|
||||
|
|
@ -109,55 +155,22 @@ export default function Layout({
|
|||
)
|
||||
})}
|
||||
<a
|
||||
href={`/donate`}
|
||||
className="donate"
|
||||
onClick={closeSideBar}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
onClick={() => {
|
||||
console.log('AAAAAAAAA')
|
||||
closeSideBar()
|
||||
setDonateShowing(true)
|
||||
}}
|
||||
>
|
||||
Donate
|
||||
</a>
|
||||
</div>
|
||||
<div className="userStatus">
|
||||
<div className="msgs">
|
||||
<div
|
||||
onClick={() => {
|
||||
if (!userSpecificMotd) {
|
||||
return
|
||||
}
|
||||
setShowMotdModal(true)
|
||||
if (userSpecificMotd.seen) {
|
||||
return
|
||||
}
|
||||
fetch(constants.apiUrl + 'infos', {
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
userSpecificMotdSeen: true,
|
||||
}),
|
||||
})
|
||||
.then((resp) => {
|
||||
return resp.json()
|
||||
})
|
||||
.then(() => {
|
||||
refetchGlobalData()
|
||||
})
|
||||
}}
|
||||
style={{ cursor: userSpecificMotd ? 'pointer' : 'default' }}
|
||||
title={
|
||||
userSpecificMotd && !userSpecificMotd.seen
|
||||
? "You've got Mail!"
|
||||
: ''
|
||||
}
|
||||
>
|
||||
{userSpecificMotd && !userSpecificMotd.seen ? '📬' : '📭'}
|
||||
</div>
|
||||
<div title="User ID">UID: {userId || '...'}</div>
|
||||
</div>
|
||||
<MessageButton
|
||||
userSpecificMotd={userSpecificMotd}
|
||||
setShowMotdModal={setShowMotdModal}
|
||||
refetchGlobalData={refetchGlobalData}
|
||||
/>
|
||||
<div title="User ID">UID: {userId || '...'}</div>
|
||||
<div
|
||||
className="logout"
|
||||
onClick={() => {
|
||||
|
|
@ -175,21 +188,28 @@ export default function Layout({
|
|||
Logout
|
||||
</div>
|
||||
</div>
|
||||
{showMotdModal ? (
|
||||
<Modal
|
||||
closeClick={() => {
|
||||
setShowMotdModal(false)
|
||||
}}
|
||||
>
|
||||
<div style={{ textAlign: 'center' }}>Üzenet admintól:</div>
|
||||
<div
|
||||
dangerouslySetInnerHTML={{ __html: userSpecificMotd.msg }}
|
||||
/>
|
||||
</Modal>
|
||||
) : null}
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
{donateShowing ? (
|
||||
<Modal
|
||||
closeClick={() => {
|
||||
setDonateShowing(false)
|
||||
}}
|
||||
>
|
||||
<div>hi</div>
|
||||
</Modal>
|
||||
) : null}
|
||||
{showMotdModal ? (
|
||||
<Modal
|
||||
closeClick={() => {
|
||||
setShowMotdModal(false)
|
||||
}}
|
||||
>
|
||||
<div style={{ textAlign: 'center' }}>Üzenet admintól:</div>
|
||||
<div dangerouslySetInnerHTML={{ __html: userSpecificMotd.msg }} />
|
||||
</Modal>
|
||||
) : null}
|
||||
<div className="content">{children}</div>
|
||||
{userSpecificMotd && !userSpecificMotd.seen && showNewMsgModal ? (
|
||||
<Modal
|
||||
|
|
|
|||
|
|
@ -1,22 +0,0 @@
|
|||
{
|
||||
"install": {
|
||||
"href": "/install",
|
||||
"text": "Install"
|
||||
},
|
||||
"allqr": {
|
||||
"href": "/allqr.txt",
|
||||
"text": "Összes kérdés TXT"
|
||||
},
|
||||
"data": {
|
||||
"href": "/data.json",
|
||||
"text": "Összes kérdés JSON"
|
||||
},
|
||||
"irc": {
|
||||
"href": "/irc?index",
|
||||
"text": "IRC chat"
|
||||
},
|
||||
"dataeditor": {
|
||||
"href": "/dataeditor?index",
|
||||
"text": "Dataeditor"
|
||||
}
|
||||
}
|
||||
|
|
@ -3,14 +3,14 @@
|
|||
"href": "/",
|
||||
"text": "Főoldal"
|
||||
},
|
||||
"script": {
|
||||
"href": "/script",
|
||||
"text": "Script"
|
||||
},
|
||||
"allQuestions": {
|
||||
"href": "/allQuestions",
|
||||
"text": "Kérdések és tárgyak"
|
||||
},
|
||||
"pwRequest": {
|
||||
"href": "/pwRequest",
|
||||
"text": "Jelszó generálás"
|
||||
},
|
||||
"contribute": {
|
||||
"href": "/contribute",
|
||||
"text": "Teendők"
|
||||
|
|
@ -18,5 +18,17 @@
|
|||
"ranklist": {
|
||||
"href": "/ranklist",
|
||||
"text": "Ranklista"
|
||||
},
|
||||
"pwRequest": {
|
||||
"href": "/pwRequest",
|
||||
"text": "Jelszó generálás"
|
||||
},
|
||||
"faq": {
|
||||
"href": "/faq",
|
||||
"text": "GYIK"
|
||||
},
|
||||
"contact": {
|
||||
"href": "/contact",
|
||||
"text": "Kapcsolat"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ textarea {
|
|||
color: var(--text-color);
|
||||
background-color: var(--background-color);
|
||||
box-sizing: border-box;
|
||||
height: 120px;
|
||||
height: 140px;
|
||||
width: 100%;
|
||||
border: 1px solid #666;
|
||||
border-radius: 3px;
|
||||
|
|
@ -39,10 +39,14 @@ textarea {
|
|||
input {
|
||||
color: var(--text-color);
|
||||
background-color: var(--background-color);
|
||||
border: 1px solid #444;
|
||||
border: 0px solid #444;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
border: 0px solid #444;
|
||||
}
|
||||
|
||||
.link {
|
||||
margin: 20px;
|
||||
font-size: 20px;
|
||||
|
|
@ -184,6 +188,7 @@ input {
|
|||
}
|
||||
|
||||
.rtfmImage {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 2px solid white;
|
||||
|
|
@ -263,6 +268,7 @@ input {
|
|||
}
|
||||
|
||||
.rtfmImage {
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
margin: 0px 10px;
|
||||
}
|
||||
|
|
@ -377,3 +383,50 @@ select:hover {
|
|||
.actions > span:hover {
|
||||
background-color: var(--hoover-color);
|
||||
}
|
||||
|
||||
.buttonContainer {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
|
||||
margin: 10px 0px;
|
||||
height: 50px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.buttonContainer > * {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
|
||||
background-color: #f2cb05;
|
||||
border: none;
|
||||
color: black;
|
||||
padding: 5px 10px;
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
margin: 8px 2px 2px 2px;
|
||||
cursor: pointer;
|
||||
text-shadow: 1px 1px 8px black;
|
||||
transition: width 0.5s, height 0.5s, ease-in 0.5s;
|
||||
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.buttonContainer > *:active {
|
||||
transform: translateY(2.5px);
|
||||
}
|
||||
|
||||
.buttonContainer > *:hover {
|
||||
text-shadow: 2px 2px 8px black;
|
||||
transition: width 0.5s, height 0.5s, ease-out 0.5s;
|
||||
background-color: #a38c1a;
|
||||
}
|
||||
|
||||
.buttonContainer > .activeButton {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import QuestionSearchResult from '../components/QuestionSearchResult.js'
|
|||
import Subject from '../components/Subject.js'
|
||||
import SubjectSelector from '../components/SubjectSelector.js'
|
||||
import Sleep from '../components/sleep'
|
||||
import ExternalLinkIcon from '../components/externalLinkIcon'
|
||||
|
||||
import styles from './allQuestions.module.css'
|
||||
|
||||
|
|
@ -74,6 +75,7 @@ export default function AllQuestions({ router }) {
|
|||
const [searchTerm, setSearchTerm] = useState('')
|
||||
const [activeSubjName, setActiveSubjName] = useState('')
|
||||
const [dbs, setDbs] = useState(null)
|
||||
const [selectedDb, setSelectedDb] = useState('')
|
||||
const [data, setData] = useState(null)
|
||||
const [fetchingData, setFetchingData] = useState(false)
|
||||
const subjectCount = data ? data.length : 0
|
||||
|
|
@ -106,11 +108,13 @@ export default function AllQuestions({ router }) {
|
|||
setData(null)
|
||||
setFetchingData(true)
|
||||
if (key === 'all') {
|
||||
setSelectedDb(key)
|
||||
fetchAllData(dbs).then((res) => {
|
||||
setData(mergeData(res))
|
||||
setFetchingData(false)
|
||||
})
|
||||
} else {
|
||||
setSelectedDb(dbs[key].name)
|
||||
fetchData(dbs[key]).then((res) => {
|
||||
setData(res.data)
|
||||
setFetchingData(false)
|
||||
|
|
@ -238,11 +242,11 @@ export default function AllQuestions({ router }) {
|
|||
|
||||
return (
|
||||
<div>
|
||||
{dbs ? (
|
||||
{dbs ? <>{renderDbSelector()}</> : <LoadingIndicator />}
|
||||
{dbs && data ? (
|
||||
<>
|
||||
{renderDbSelector()}
|
||||
{data && `${questionCount} kérdés, ${subjectCount} tárgy`}
|
||||
<div className={styles.typeSelector}>
|
||||
{`${questionCount} kérdés, ${subjectCount} tárgy`}
|
||||
<div className={'buttonContainer'}>
|
||||
<div
|
||||
className={!subjectsShowing ? styles.activeTypeSelector : ''}
|
||||
onClick={() => setSubjectsShowing(false)}
|
||||
|
|
@ -255,6 +259,21 @@ export default function AllQuestions({ router }) {
|
|||
>
|
||||
Tárgyak
|
||||
</div>
|
||||
<a
|
||||
onClick={() => {
|
||||
if (selectedDb === 'all') {
|
||||
window.open(`${constants.apiUrl}allqr.txt`, '_blank')
|
||||
} else {
|
||||
window.open(
|
||||
`${constants.apiUrl}allqr.txt?db=${selectedDb}`,
|
||||
'_blank'
|
||||
)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{'Kérdések letöltése'}
|
||||
<ExternalLinkIcon size={15} />
|
||||
</a>
|
||||
</div>
|
||||
{fetchingData ? (
|
||||
<LoadingIndicator />
|
||||
|
|
@ -266,9 +285,7 @@ export default function AllQuestions({ router }) {
|
|||
</div>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<LoadingIndicator />
|
||||
)}
|
||||
) : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,28 +11,3 @@
|
|||
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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
import React from 'react'
|
||||
import Head from 'next/head'
|
||||
|
||||
import FeedbackArea from '../components/feedbackArea'
|
||||
|
||||
import styles from './contact.module.css'
|
||||
|
||||
const contactMethods = {
|
||||
|
|
@ -26,6 +28,7 @@ export default function Contact() {
|
|||
<Head>
|
||||
<title>Kapcsolat - Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<FeedbackArea from={'contact'} />
|
||||
<div className={styles.contactsContainer}>
|
||||
<div>Itt vannak hogy hogy lehet kontaktolni</div>
|
||||
{Object.keys(contactMethods).map((key) => {
|
||||
|
|
|
|||
|
|
@ -1,65 +1,15 @@
|
|||
import React, { useState } from 'react'
|
||||
import React from 'react'
|
||||
import Head from 'next/head'
|
||||
|
||||
import Sleep from '../components/sleep'
|
||||
import Todos from '../components/todoStuff/todos'
|
||||
import FeedbackArea from '../components/feedbackArea'
|
||||
|
||||
import constants from '../constants.json'
|
||||
import styles from './contribute.module.css'
|
||||
import repos from '../data/repos.json'
|
||||
|
||||
export default function contribute() {
|
||||
const [newTask, setNewTask] = useState('')
|
||||
|
||||
const submitNewTask = async () => {
|
||||
if (!newTask) {
|
||||
return
|
||||
}
|
||||
|
||||
fetch(constants.apiUrl + 'postfeedback', {
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
newTask: newTask,
|
||||
from: 'contribute',
|
||||
}),
|
||||
})
|
||||
.then((resp) => {
|
||||
return resp.json()
|
||||
})
|
||||
.then((resp) => {
|
||||
if (resp.success) {
|
||||
alert('Elküldve')
|
||||
setNewTask('')
|
||||
} else {
|
||||
alert('Hiba küldés közben')
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
alert('Hiba küldés közben')
|
||||
console.error(err)
|
||||
})
|
||||
}
|
||||
|
||||
const renderNewTaskArea = () => {
|
||||
return (
|
||||
<div className={styles.inputArea}>
|
||||
<textarea
|
||||
onChange={(event) => setNewTask(event.target.value)}
|
||||
value={newTask || ''}
|
||||
className={styles.feedback}
|
||||
/>
|
||||
<button className={styles.button} onClick={submitNewTask}>
|
||||
Küldés
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
|
|
@ -98,7 +48,7 @@ export default function contribute() {
|
|||
</a>
|
||||
-n és megbeszéljük.
|
||||
</div>
|
||||
{renderNewTaskArea()}
|
||||
<FeedbackArea from={'contribute'} />
|
||||
<hr />
|
||||
<Todos />
|
||||
<Sleep />
|
||||
|
|
|
|||
|
|
@ -14,28 +14,6 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.feedback {
|
||||
color: var(--text-color);
|
||||
background-color: var(--background-color);
|
||||
font-size: 14px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.button {
|
||||
background-color: var(--text-color);
|
||||
border: none;
|
||||
padding: 5px 15px;
|
||||
margin: 5px;
|
||||
color: white;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.inputArea {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: var(--text-color);
|
||||
font-size: 30px;
|
||||
|
|
|
|||
|
|
@ -1,116 +1,11 @@
|
|||
import React from 'react'
|
||||
import React, { useState } from 'react'
|
||||
|
||||
import Sleep from '../components/sleep'
|
||||
import Head from 'next/head'
|
||||
|
||||
export default function Manual() {
|
||||
return <div>{renderMaual()}</div>
|
||||
}
|
||||
|
||||
function renderMaual() {
|
||||
function PasswordSection() {
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>Manual - Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<center>
|
||||
<div className={'pageHeader'}>
|
||||
<h1>Manual</h1>
|
||||
</div>
|
||||
<h3 className={'warning'}>
|
||||
Ha az oldalt vagy a scriptet használod: akármikor észrevehetik,
|
||||
leállhat a szerver, és rossz lehet az összes válasz!
|
||||
</h3>
|
||||
<p id="manualWarn">
|
||||
Valószínűleg semmi baj nem lesz, de én szóltam. Ha emiatt aggódsz,
|
||||
olvasd el a <a href="#risk">kockázatok részt</a>.
|
||||
</p>
|
||||
</center>
|
||||
<Sleep />
|
||||
<center></center>
|
||||
<hr />
|
||||
<center>
|
||||
<h2 className={'subtitle'}>A userscript használata</h2>
|
||||
</center>
|
||||
<div className={'manualUsage manualBody'}>
|
||||
<div>
|
||||
<p>
|
||||
Ez a userscript Moodle/Elearnig/KMOOC tesztek megoldása során
|
||||
segítséget jelenít meg.
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
Tölts le egy userscript futtató kiegészítőt a böngésződhöz: pl. a{' '}
|
||||
<a
|
||||
href="https://www.tampermonkey.net/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Tampermonkey
|
||||
</a>
|
||||
-t.
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="http://qmining.frylabs.net/install?man"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Kattints ide hogy felrakd a scriptet
|
||||
</a>{' '}
|
||||
</li>
|
||||
<li>
|
||||
A script ezt követően udvariasan megkér, hogy hadd beszélgessen a
|
||||
szerverrel, mert mással nem tud, ezért ezt engedélyezd neki.
|
||||
</li>
|
||||
<li>
|
||||
A kitöltendő teszt oldalán a kérdésre a választ kell látnod felül
|
||||
egy lebegő ablakban.
|
||||
</li>
|
||||
<li>
|
||||
Teszt ellenőrzés oldalon a script beküldi a szervernek a helyes
|
||||
válaszokat, az lementi az új kérdéseket, amik ezután azonnal
|
||||
elérhetők lesznek (neked, és másoknak is)
|
||||
</li>
|
||||
</ul>
|
||||
Egyéb fontos tudnivalók:
|
||||
<ul>
|
||||
<li>
|
||||
Ezt ments sokszor akár minden nap:{' '}
|
||||
<a
|
||||
href="http://qmining.frylabs.net/allqr.txt?man"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
{' '}
|
||||
Összes kérdés TXT
|
||||
</a>{' '}
|
||||
(az összes összegyűjtött kérdés, ha elszállna a szerver)
|
||||
</li>
|
||||
<li>
|
||||
Az{' '}
|
||||
<a href="/allQuestions" rel="noreferrer">
|
||||
összes kérdés oldal
|
||||
</a>{' '}
|
||||
az oldal, ahol manuálisan tudsz keresni, ha valami gáz lenne a
|
||||
scripttel.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className={'rtfmImage'}>
|
||||
<img
|
||||
style={{ maxWidth: '100%', minWidth: '200px' }}
|
||||
src="img/rtfm.jpg"
|
||||
alt="img"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<center>
|
||||
<h2 id="pw" className={'subtitle'}>
|
||||
Jelszavak
|
||||
</h2>
|
||||
</center>
|
||||
<>
|
||||
<div className={'manualBody'}>
|
||||
<p>
|
||||
Ha ezt olvasod valszeg már neked is van. Azért lett bevezetve, hogy
|
||||
|
|
@ -161,9 +56,13 @@ function renderMaual() {
|
|||
</ul>
|
||||
</div>
|
||||
<hr />
|
||||
<center>
|
||||
<h2 className={'subtitle'}>Gyakran Ismételt Kérdések</h2>
|
||||
</center>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function FAQSection() {
|
||||
return (
|
||||
<>
|
||||
<div className={'manualBody'}>
|
||||
<ul>
|
||||
<li>
|
||||
|
|
@ -204,12 +103,13 @@ function renderMaual() {
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<hr />
|
||||
<center>
|
||||
<h2 id="risk" className={'subtitle'}>
|
||||
Kockázatok
|
||||
</h2>
|
||||
</center>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function RiskSection() {
|
||||
return (
|
||||
<>
|
||||
<ul>
|
||||
<li>
|
||||
<b>Bármikor észrevehetik hogy használod a scriptet</b>
|
||||
|
|
@ -248,9 +148,13 @@ function renderMaual() {
|
|||
</li>
|
||||
</ul>
|
||||
<hr />
|
||||
<h2 id="sitesave" className={'subtitle'}>
|
||||
Weboldal lementése
|
||||
</h2>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function WebsiteSaveSection() {
|
||||
return (
|
||||
<>
|
||||
<p>
|
||||
Ha hibát észlesz, kérlek jelents. Hogy a hibákat a saját gépemen
|
||||
reprodukálni tudjam, és könnyen ki bírjam javítani, sokszor jól jön, ha
|
||||
|
|
@ -274,10 +178,13 @@ function renderMaual() {
|
|||
hatékonyan tesztelni a scriptet. Ezért hatalmas segítség ha feltöltöd
|
||||
azt az oldalt amin hibával találkozol.
|
||||
</p>
|
||||
<hr />
|
||||
<h2 id="scriptreinstall" className={'subtitle'}>
|
||||
Script újratelepítése
|
||||
</h2>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function ScriptReinstallSection() {
|
||||
return (
|
||||
<>
|
||||
<p>
|
||||
Jelenleg két helyről lehet telepíteni a scriptet: greasyforkról és a
|
||||
weboldalról. A greasyforkos telepítési lehetőség meg fog szűnni, így ha
|
||||
|
|
@ -313,6 +220,55 @@ function renderMaual() {
|
|||
</ul>
|
||||
Ezzel semmi adat nem vész el, régi jelszó ugyanolyan jó marad (csak ne
|
||||
felejtsd azt el)
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
const pages = {
|
||||
faq: { name: 'GYIK', component: FAQSection },
|
||||
pw: { name: 'Jelszavak', component: PasswordSection },
|
||||
risk: { name: 'Kockázatok', component: RiskSection },
|
||||
websitedl: { name: 'Weboldal letöltése', component: WebsiteSaveSection },
|
||||
reinstall: {
|
||||
name: 'Script újratelepítése',
|
||||
component: ScriptReinstallSection,
|
||||
},
|
||||
}
|
||||
|
||||
export default function FAQ() {
|
||||
const [currPage, setCurrPage] = useState(pages.faq)
|
||||
|
||||
const renderCurrPage = (page) => {
|
||||
if (page) {
|
||||
return <page.component />
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>GYIK - Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<div className={'buttonContainer'}>
|
||||
{Object.keys(pages).map((key) => {
|
||||
const page = pages[key]
|
||||
return (
|
||||
<div
|
||||
className={`${page === currPage && 'activeButton'}`}
|
||||
key={key}
|
||||
onClick={() => {
|
||||
setCurrPage(page)
|
||||
}}
|
||||
>
|
||||
{page.name}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
{renderCurrPage(currPage)}
|
||||
<Sleep />
|
||||
<p className={'endofpage'} />
|
||||
</div>
|
||||
)
|
||||
|
|
@ -1,36 +1,15 @@
|
|||
import React, { useState, useEffect } from 'react'
|
||||
import fetch from 'unfetch'
|
||||
import Head from 'next/head'
|
||||
import Link from 'next/link'
|
||||
|
||||
import LoadingIndicator from '../components/LoadingIndicator'
|
||||
import Sleep from '../components/sleep'
|
||||
import NewsEntry from '../components/newsEntry'
|
||||
import Composer from '../components/composer'
|
||||
import DbSelector from '../components/dbSelector.js'
|
||||
|
||||
import styles from './index.module.css'
|
||||
import constants from '../constants.json'
|
||||
|
||||
const links = {
|
||||
install: {
|
||||
href: '/install',
|
||||
text: 'Install',
|
||||
},
|
||||
manual: {
|
||||
href: '/manual',
|
||||
text: 'A script használata',
|
||||
},
|
||||
post: {
|
||||
href: '/',
|
||||
text: 'Bejegyzés írása...',
|
||||
},
|
||||
dataeditor: {
|
||||
href: '/dataeditor',
|
||||
text: 'Kérdés szerkesztő',
|
||||
},
|
||||
}
|
||||
|
||||
function fetchNews() {
|
||||
return new Promise((resolve) => {
|
||||
fetch(`${constants.apiUrl}news.json`, {
|
||||
|
|
@ -115,7 +94,6 @@ export default function Index({ globalData }) {
|
|||
const userId = globalData.userId
|
||||
const motd = globalData.motd
|
||||
const [news, setNews] = useState(null)
|
||||
const [allQrSelector, setAllQrSelector] = useState(null)
|
||||
// const userSpecificMotd = props.globalData.userSpecificMotd
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -299,66 +277,15 @@ export default function Index({ globalData }) {
|
|||
)
|
||||
}
|
||||
|
||||
const renderDbSelector = () => {
|
||||
if (allQrSelector) {
|
||||
return (
|
||||
<DbSelector
|
||||
text={`Válaszd ki melyik adatbázist szeretnéd letölteni!`}
|
||||
showAll={allQrSelector === 'txt'}
|
||||
closeClick={() => {
|
||||
setAllQrSelector(null)
|
||||
}}
|
||||
onDbSelect={(selectedDb) => {
|
||||
if (allQrSelector === 'txt') {
|
||||
if (selectedDb === 'all') {
|
||||
window.open(`${constants.apiUrl}allqr.txt`, '_blank')
|
||||
} else {
|
||||
window.open(
|
||||
`${constants.apiUrl}allqr.txt?db=${selectedDb.name}`,
|
||||
'_blank'
|
||||
)
|
||||
}
|
||||
} else if (allQrSelector === 'json') {
|
||||
window.open(`${constants.apiUrl}${selectedDb.path}`, '_blank')
|
||||
}
|
||||
}}
|
||||
/>
|
||||
)
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<div className={styles.buttonContainer}>
|
||||
{Object.keys(links).map((key) => {
|
||||
let link = links[key]
|
||||
return (
|
||||
<Link key={key} href={link.href}>
|
||||
<a className={styles.button} target="_blank">
|
||||
{link.text}
|
||||
</a>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
<a
|
||||
onClick={() => {
|
||||
setAllQrSelector('txt')
|
||||
}}
|
||||
className={styles.button}
|
||||
>
|
||||
{'Összes kérdés TXT'}
|
||||
</a>
|
||||
</div>
|
||||
{renderMotd()}
|
||||
{/*{userSpecificMotd && renderUserSpecificMotd()} */}
|
||||
<Sleep />
|
||||
{renderNews()}
|
||||
{renderDbSelector()}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,33 +1,3 @@
|
|||
.buttonContainer {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.button {
|
||||
color: white;
|
||||
background-color: #313131;
|
||||
margin: 0px 4px;
|
||||
padding: 15px 4px;
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
word-wrap: break-word;
|
||||
text-decoration: none;
|
||||
transition: width 0.5s, height 0.5s, ease-in 0.5s;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: #555;
|
||||
color: var(--text-color);
|
||||
transition: width 0.5s, height 0.5s, ease-out 0.5s;
|
||||
text-shadow: 2px 1.5px 8px black;
|
||||
}
|
||||
|
||||
.hr {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
import React, { useState, useEffect } from 'react'
|
||||
import fetch from 'unfetch'
|
||||
import Head from 'next/head'
|
||||
import Link from 'next/link'
|
||||
|
||||
import styles from './pwRequest.module.css'
|
||||
import constants from '../constants.json'
|
||||
|
||||
export default function PwRequest(props) {
|
||||
export default function PwRequest() {
|
||||
const [result, setResult] = useState([])
|
||||
const [remaining, setRemaining] = useState('...')
|
||||
const [requestedPWS, setRequestedPWS] = useState('...')
|
||||
|
|
@ -56,7 +57,7 @@ export default function PwRequest(props) {
|
|||
setResult([...result, resp.pw])
|
||||
setRemaining(resp.remaining)
|
||||
setRequestedPWS(resp.requestedPWS)
|
||||
} else if (resp.result === 'success') {
|
||||
} else if (resp.result === 'nouser') {
|
||||
setResult(['Nem vagy bejelentkezve!']) // this should never happpen
|
||||
} else {
|
||||
setResult([
|
||||
|
|
@ -99,11 +100,11 @@ export default function PwRequest(props) {
|
|||
egyet és add oda másnak, mint hogy közösen használjatok egyet, mert
|
||||
egyszerre, egy felhasználó csak egy helyen, egy eszközön lehet
|
||||
belépve, mindenhol máshol automatikusan kijelentkeztetésre kerül. A
|
||||
jelszavakról bővebben a Script használata oldal{' '}
|
||||
<a href="/manual#pw" target="_blank">
|
||||
vonatkozó részén
|
||||
</a>{' '}
|
||||
olvashatsz.
|
||||
jelszavakról bővebben a{' '}
|
||||
<Link href="/faq">
|
||||
<a>GYIK</a>
|
||||
</Link>
|
||||
-ben olvashatsz.
|
||||
</p>
|
||||
</div>
|
||||
<div className={styles.text}>
|
||||
|
|
@ -131,10 +132,8 @@ export default function PwRequest(props) {
|
|||
<br />
|
||||
<br />
|
||||
</div>
|
||||
<div className={styles.buttonContainer}>
|
||||
<div onClick={handleSubmit} className={styles.button}>
|
||||
Jelszó kérése
|
||||
</div>
|
||||
<div className={'buttonContainer'}>
|
||||
<div onClick={handleSubmit}>Jelszó kérése</div>
|
||||
</div>
|
||||
{result ? (
|
||||
<div className={styles.pwContainer}>
|
||||
|
|
|
|||
|
|
@ -1,33 +1,3 @@
|
|||
.buttonContainer {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.button {
|
||||
background-color: #f2cb05;
|
||||
border: none;
|
||||
color: black;
|
||||
padding: 15px 30px;
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
margin: 8px 2px 2px 2px;
|
||||
cursor: pointer;
|
||||
text-shadow: 1px 1px 8px black;
|
||||
transition: width 0.5s, height 0.5s, ease-in 0.5s;
|
||||
}
|
||||
|
||||
.button:active {
|
||||
transform: translateY(2.5px);
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
text-shadow: 2px 2px 8px black;
|
||||
transition: width 0.5s, height 0.5s, ease-out 0.5s;
|
||||
background-color: #a38c1a;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
|
|
|
|||
110
src/pages/script.js
Normal file
110
src/pages/script.js
Normal file
|
|
@ -0,0 +1,110 @@
|
|||
import React from 'react'
|
||||
|
||||
import Sleep from '../components/sleep'
|
||||
import Head from 'next/head'
|
||||
|
||||
import ExternalLinkIcon from '../components/externalLinkIcon'
|
||||
|
||||
export default function Script() {
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>Manual - Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<div className={'buttonContainer'}>
|
||||
<a href="https://www.tampermonkey.net/">
|
||||
Ajánlott userscript kezelő bővítmény
|
||||
<ExternalLinkIcon size={15} />
|
||||
</a>
|
||||
<a href="/install">
|
||||
Script telepítése
|
||||
<ExternalLinkIcon size={15} />
|
||||
</a>
|
||||
</div>
|
||||
<Sleep />
|
||||
{renderManual()}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function renderManual() {
|
||||
return (
|
||||
<>
|
||||
<center>
|
||||
<h2 className={'subtitle'}>A userscript telepítése, és használata</h2>
|
||||
</center>
|
||||
<div>
|
||||
<p>
|
||||
Ez a userscript Moodle/Elearnig/KMOOC tesztek megoldása során
|
||||
segítséget jelenít meg.
|
||||
</p>
|
||||
<ol>
|
||||
<li>
|
||||
Tölts le egy userscript futtató kiegészítőt a böngésződhöz: pl. a{' '}
|
||||
<a
|
||||
href="https://www.tampermonkey.net/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Tampermonkey
|
||||
</a>
|
||||
-t.
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="http://qmining.frylabs.net/install"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Kattints ide hogy felrakd a scriptet
|
||||
</a>{' '}
|
||||
</li>
|
||||
<li>
|
||||
A script ezt követően udvariasan megkér, hogy hadd beszélgessen a
|
||||
szerverrel, ezt engedélyezd neki. (Always allow domain)
|
||||
</li>
|
||||
<li>
|
||||
A támogatott oldalakon a script egy apró menü ablakot jelenít meg a
|
||||
weboldal bal alsó részén
|
||||
</li>
|
||||
<li>
|
||||
Ezután a kitöltendő teszt oldalán a kérdésre a választ kell látnod
|
||||
felül egy lebegő ablakban.
|
||||
</li>
|
||||
<li>
|
||||
Teszt ellenőrzés oldalon a script beküldi a szervernek a helyes
|
||||
válaszokat, az lementi az új kérdéseket, amik ezután azonnal
|
||||
elérhetők lesznek (neked, és másoknak is)
|
||||
</li>
|
||||
</ol>
|
||||
Egyéb fontos tudnivalók:
|
||||
<ul>
|
||||
<li>
|
||||
Ezt ments sokszor akár minden nap:{' '}
|
||||
<a
|
||||
href="http://qmining.frylabs.net/allqr.txt"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
{' '}
|
||||
Összes kérdés TXT
|
||||
</a>{' '}
|
||||
(az összes összegyűjtött kérdés, ha elszállna a szerver)
|
||||
</li>
|
||||
<li>
|
||||
Az{' '}
|
||||
<a href="/allQuestions" rel="noreferrer">
|
||||
összes kérdés oldal
|
||||
</a>{' '}
|
||||
az oldal, ahol manuálisan tudsz keresni, ha valami gáz lenne a
|
||||
scripttel.
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
Ha útközben elakadsz, vagy hibát észlelsz, akkor oldalt a Kapcsolat
|
||||
résznél sok elérhetőséget találsz, amin segítséget kérhetsz.
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
0
src/pages/script.module.css
Normal file
0
src/pages/script.module.css
Normal file
Loading…
Add table
Add a link
Reference in a new issue