Initial commit

src/components/AllQuestions/AllQuestions.css

@@ -0,0 +1,30 @@
+.subjectSelector {
+  overflow: scroll;
+  height: 200px;
+  margin: 10px;
+}
+
+.subjItem {
+  font-size: 18px;
+  padding: 3px;
+  cursor: pointer;
+}
+
+.activeSubjItem {
+  background-color: var(--text-color);
+  color: black;
+}
+
+.searchBar {
+  margin: 10px;
+  width: 100%;
+  color: white;
+  background-color: #212127;
+  border: none;
+  font-size: 18px;
+}
+
+.subjItem:hover:not(.activeSubjItem) {
+  background-color: #555;
+  color: white;
+}

src/components/AllQuestions/AllQuestions.js

@@ -0,0 +1,100 @@
+import React, { PureComponent } from 'react'
+
+import LoadingIndicator from '../LoadingIndicator'
+import Subject from '../../components/Subject'
+
+import constants from '../../constants.json'
+import './AllQuestions.css'
+
+class AllQuestions extends PureComponent {
+  constructor (props) {
+    super(props)
+
+    this.state = {
+      loaded: false,
+      activeSubjName: '',
+      searchTerm: ''
+    }
+
+    console.info('Fetching data')
+    fetch(`${constants.serverUrl}data.json`) // eslint-disable-line
+      .then((resp) => {
+        return resp.json()
+      })
+      .then((data) => {
+        this.data = data
+        this.setState({
+          loaded: true
+        })
+      })
+  }
+
+  onSubjSelect (name) {
+    this.setState({
+      activeSubjName: name
+    })
+  }
+
+  searchBarOnChange (e) {
+    let text = e.target.value
+    this.setState({
+      searchTerm: text
+    })
+  }
+
+  render () {
+    const { loaded, activeSubjName, searchTerm } = this.state
+
+    if (loaded) {
+      let currSubj = this.data.Subjects.find((subj) => {
+        return subj.Name === activeSubjName
+      })
+
+      return (
+        <div>
+          <div>
+            <input
+              placeholder='Keresés...'
+              className='searchBar'
+              type='text'
+              value={searchTerm}
+              onChange={this.searchBarOnChange.bind(this)}
+            />
+          </div>
+          <div className='subjectSelector'>
+            {this.data.Subjects.map((subj, i) => {
+              if (!subj.Name.toLowerCase().includes(searchTerm.toLowerCase())) {
+                return null
+              }
+
+              return (
+                <div
+                  className={activeSubjName === subj.Name
+                    ? 'subjItem activeSubjItem'
+                    : 'subjItem'
+                  }
+                  key={i}
+                  onClick={() => this.onSubjSelect(subj.Name)}
+                >
+                  {subj.Name}
+                </div>
+              )
+            })}
+          </div>
+          <hr />
+          <div>
+            <Subject
+              subj={currSubj}
+            />
+          </div>
+        </div>
+      )
+    } else {
+      return (
+        <LoadingIndicator />
+      )
+    }
+  }
+}
+
+export default AllQuestions

src/components/AllQuestions/index.js

@@ -0,0 +1 @@
+export { default } from './AllQuestions'

src/components/Feedback/Feedback.js

@@ -0,0 +1,14 @@
+import React, { PureComponent } from 'react'
+import './Feedback.css'
+
+class Feedback extends PureComponent {
+  render () {
+    return (
+      <div>
+        hello Feedback
+      </div>
+    )
+  }
+}
+
+export default Feedback

src/components/Feedback/index.js

@@ -0,0 +1 @@
+export { default } from './Feedback'

src/components/HomeTab/HomeTab.css

@@ -0,0 +1,3 @@
+.link {
+  margin: 10px;
+}

src/components/HomeTab/HomeTab.js

@@ -0,0 +1,30 @@
+import React, { PureComponent } from 'react'
+import './HomeTab.css'
+
+import links from './links.json'
+
+class HomeTab extends PureComponent {
+  render () {
+    return (
+      <div>
+        {Object.keys(links).map((key) => {
+          let link = links[key]
+          return (
+            <div
+              className='link'
+              key={key}
+            >
+              <a
+                href={link.href}
+              >
+                {link.text}
+              </a>
+            </div>
+          )
+        })}
+      </div>
+    )
+  }
+}
+
+export default HomeTab

src/components/HomeTab/index.js

@@ -0,0 +1 @@
+export { default } from './HomeTab'

src/components/HomeTab/links.json

@@ -0,0 +1,18 @@
+{
+  "install": {
+    "href": "/install",
+    "text": "Install"
+  },
+  "server": {
+    "href": "/servergit",
+    "text": "Szerver repó"
+  },
+  "client": {
+    "href": "/scriptgit",
+    "text": "Script git"
+  },
+  "classes": {
+    "href": "/classesgit",
+    "text": "Classes git"
+  }
+}

src/components/LoadingIndicator/LoadingIndicator.css

@@ -0,0 +1,10 @@
+.loadingindicator {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  -webkit-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+
+  color: #fff;
+  font-size: 30px;
+}

src/components/LoadingIndicator/LoadingIndicator.js

@@ -0,0 +1,14 @@
+import React, { PureComponent } from 'react'
+import './LoadingIndicator.css'
+
+class LoadingIndicator extends PureComponent {
+  render () {
+    return (
+      <div className='loadingindicator'>
+        Loading...
+      </div>
+    )
+  }
+}
+
+export default LoadingIndicator

src/components/LoadingIndicator/index.js

@@ -0,0 +1 @@
+export { default } from './LoadingIndicator'

src/components/Manual/Manual.js

@@ -0,0 +1,49 @@
+import React, { PureComponent } from 'react'
+
+import LoadingIndicator from '../LoadingIndicator'
+
+import constants from '../../constants.json'
+import './Manual.css'
+
+class Manual extends PureComponent {
+  constructor (props) {
+    super(props)
+
+    this.state = {
+      loaded: false
+    }
+
+    console.info('Fetching manual')
+    fetch(`${constants.serverUrl}manual`) // eslint-disable-line
+      .then((resp) => {
+        return resp.text()
+      })
+      .then((data) => {
+        this.manual = {
+          __html: data
+        }
+
+        this.setState({
+          loaded: true
+        })
+      })
+  }
+
+  render () {
+    const { loaded } = this.state
+
+    if (loaded) {
+      return (
+        <div>
+          <div dangerouslySetInnerHTML={this.manual} />
+        </div>
+      )
+    } else {
+      return (
+        <LoadingIndicator />
+      )
+    }
+  }
+}
+
+export default Manual

src/components/Manual/index.js

@@ -0,0 +1 @@
+export { default } from './Manual'

src/components/Question/Question.css

@@ -0,0 +1,22 @@
+.questionContainer {
+  margin: 10px;
+}
+
+.questionContainer:hover {
+  background-color: var(--hoover-color);
+}
+
+.question {
+  font-weight: bold;
+  font-size: 17px;
+  color: #ffffff;
+}
+
+.answer {
+  font-size: 15px;
+}
+
+.data {
+  font-size: 13px;
+  color: #a1a1a1;
+}

src/components/Question/Question.js

@@ -0,0 +1,34 @@
+import React, { PureComponent } from 'react'
+import './Question.css'
+
+class Question extends PureComponent {
+  render () {
+    const { question } = this.props
+
+    let qdata = question.data
+    if (typeof qdata === 'object' && qdata.type === 'simple') {
+      qdata = ''
+    }
+    if (qdata) {
+      try {
+        qdata = JSON.stringify(qdata)
+      } catch (e) {}
+    }
+
+    return (
+      <div className='questionContainer'>
+        <div className='question'>
+          {question.Q}
+        </div>
+        <div className='answer'>
+          {question.A}
+        </div>
+        <div className='data'>
+          {qdata || null}
+        </div>
+      </div>
+    )
+  }
+}
+
+export default Question

src/components/Question/index.js

@@ -0,0 +1 @@
+export { default } from './Question'

src/components/Subject/Subject.js

@@ -0,0 +1,31 @@
+import React, { PureComponent } from 'react'
+
+import Question from '../Question'
+import './Subject.css'
+
+class Subject extends PureComponent {
+  render () {
+    const { subj } = this.props
+
+    if (subj) {
+      return (
+        <div >
+          {subj.Questions.map((question, i) => {
+            return (
+              <Question
+                key={i}
+                question={question}
+              />
+            )
+          })}
+        </div>
+      )
+    } else {
+      return (
+        <div />
+      )
+    }
+  }
+}
+
+export default Subject

src/components/Subject/index.js

@@ -0,0 +1 @@
+export { default } from './Subject'

src/components/UserQuestions/UserQuestions.css

@@ -0,0 +1,28 @@
+.uquestioncontainer {
+  margin: 5px;
+}
+
+.uquestioncontainer:hover {
+  background-color: var(--hoover-color);
+}
+
+.uquestionscontainer {
+  margin: 10px;
+}
+
+.uquestion {
+  font-weight: 'bold';
+  font-size: 16px;
+  color: #fff;
+  margin: 5px;
+}
+
+.uanswer {
+  margin: 5px;
+}
+
+.uquestionnumber {
+  color: #fff;
+  margin: 5px;
+  font-size: 20px;
+}

src/components/UserQuestions/UserQuestions.js

@@ -0,0 +1,66 @@
+import React, { PureComponent } from 'react'
+
+import LoadingIndicator from '../LoadingIndicator'
+
+import constants from '../../constants.json'
+import './UserQuestions.css'
+
+class UserQuestions extends PureComponent {
+  constructor (props) {
+    super(props)
+
+    this.state = {
+      loaded: false
+    }
+
+    console.info('Fetching qa.json')
+    fetch(`${constants.serverUrl}qa.json`) // eslint-disable-line
+      .then((resp) => {
+        return resp.json()
+      })
+      .then((data) => {
+        this.qa = data
+
+        this.setState({
+          loaded: true
+        })
+      })
+  }
+
+  render () {
+    const { loaded } = this.state
+
+    if (loaded) {
+      let questions = Object.keys(this.qa).map((key, i) => {
+        let q = this.qa[key]
+        return (
+          <div key={key} className='uquestioncontainer'>
+            <div >
+              <div className='uquestionnumber'>
+                {key}:
+              </div>
+              <div className='uquestion'>
+                {q.q}
+              </div>
+            </div>
+            <div className='uanswer'>
+              {q.a}
+            </div>
+          </div>
+        )
+      }).reverse()
+
+      return (
+        <div className='uquestionscontainer'>
+          {questions}
+        </div>
+      )
+    } else {
+      return (
+        <LoadingIndicator />
+      )
+    }
+  }
+}
+
+export default UserQuestions

src/components/UserQuestions/index.js

@@ -0,0 +1 @@
+export { default } from './UserQuestions'