From c34e2ba2c194c418979df5de18e9bd1c3f2f637b Mon Sep 17 00:00:00 2001 From: mrfry Date: Tue, 4 May 2021 10:31:35 +0200 Subject: [PATCH] User files changes --- src/data/tabs.json | 4 + src/defaultStyles.css | 5 +- src/pages/allQuestions.js | 58 ++---- src/pages/allQuestions.module.css | 19 -- src/pages/script.js | 6 +- src/pages/userFiles.js | 285 ++++++++++++++++++++---------- src/pages/userFiles.module.css | 30 +++- 7 files changed, 245 insertions(+), 162 deletions(-) diff --git a/src/data/tabs.json b/src/data/tabs.json index 4c0077f..d57ebe9 100644 --- a/src/data/tabs.json +++ b/src/data/tabs.json @@ -11,6 +11,10 @@ "href": "/allQuestions", "text": "Kérdések és tárgyak" }, + "userFiles": { + "href": "/userFiles", + "text": "Tanulás segédanyagok" + }, "contribute": { "href": "/contribute", "text": "Teendők" diff --git a/src/defaultStyles.css b/src/defaultStyles.css index a8ac185..81022af 100644 --- a/src/defaultStyles.css +++ b/src/defaultStyles.css @@ -46,12 +46,11 @@ textarea { input { color: var(--text-color); background-color: var(--background-color); - border: 1px solid #666; - border-radius: 5px; + border: 0px solid #444; width: 80%; font-family: inherit; - border: 1px solid #444; width: 98%; + padding: 4px; } input:focus { diff --git a/src/pages/allQuestions.js b/src/pages/allQuestions.js index fcceeab..e3f99c4 100644 --- a/src/pages/allQuestions.js +++ b/src/pages/allQuestions.js @@ -7,6 +7,7 @@ import Subject from '../components/Subject.js' import SubjectSelector from '../components/SubjectSelector.js' import Sleep from '../components/sleep' import ExternalLinkIcon from '../components/externalLinkIcon' +import SearchBar from '../components/searchBar' import styles from './allQuestions.module.css' @@ -210,26 +211,12 @@ export default function AllQuestions({ router }) {
{data ? ( <> -
-
- { - setSearchTerm(event.target.value) - }} - /> - -
-
+ { + setSearchTerm(e) + }} + />
{data ? ( <> -
- { - setSearchTerm(event.target.value) - router.replace( - `${router.pathname}?question=${encodeURIComponent( - event.target.value - )}&db=${selectedDb}`, - undefined, - { shallow: true } - ) - }} - /> - -
+ { + setSearchTerm(e) + }} + />
diff --git a/src/pages/allQuestions.module.css b/src/pages/allQuestions.module.css index 6e3c780..ef21745 100644 --- a/src/pages/allQuestions.module.css +++ b/src/pages/allQuestions.module.css @@ -1,22 +1,3 @@ -.searchContainer { - width: 100%; - display: flex; - justify-content: center; - margin-left: 10px; - padding-top: 10px; - padding-bottom: 2px; -} - -.clearButton { - width: 50px; - background-color: var(--background-color); - color: white; - font-size: 18px; - cursor: pointer; - border: none; - margin-left: 10px; -} - .info { text-align: center; font-style: italic; diff --git a/src/pages/script.js b/src/pages/script.js index 03ed04b..d2fd852 100644 --- a/src/pages/script.js +++ b/src/pages/script.js @@ -15,7 +15,11 @@ export default function Script() {

Script

- + Ajánlott userscript kezelő bővítmény diff --git a/src/pages/userFiles.js b/src/pages/userFiles.js index c49c249..47b11b8 100644 --- a/src/pages/userFiles.js +++ b/src/pages/userFiles.js @@ -3,6 +3,7 @@ import Head from 'next/head' import LoadingIndicator from '../components/LoadingIndicator' import Modal from '../components/modal' +import SearchBar from '../components/searchBar' import styles from './userFiles.module.css' import constants from '../constants.json' @@ -28,15 +29,55 @@ function listUserDir(subdir) { }) } -function FileUploader({ onChange }) { +function FileUploader({ onChange, uploading }) { return (
-
Fájl csatolása
- +
+ + Fontos a névtelenség, ezért figyelj rá milyen személyes adatokat + tartalmaz a feltöltött dokumentum! + +

+ Amit feltöltesz minden felhasználó lát. Csak ide illő tartalmat ossz + meg. +

+

+ {uploading ? ( + + ) : ( + + )}
) } +function SubjNameInput({ onChange, uploading }) { + return ( + <> +
+ Tárgyat kérlek úgy nevezd el, hogy: [tárgy neve] - [egyetem rövid + azonosító], szóval pl: Elektronika - OE. +

+ Üres mappák időnként törölve lesznek. +

+

+ {uploading ? ( + + ) : ( +

+ { + onChange(e.target.value) + }} + /> +
+ )} + + ) +} + function deleteFile(currDir, name) { return new Promise((resolve) => { fetch(constants.apiUrl + 'deleteUserFile', { @@ -121,12 +162,16 @@ export default function UserFiles({ router, globalData }) { const [addingNew, setAddingNew] = useState() const [newSubjName, setNewSubjName] = useState() const [file, setFile] = useState() + const [usageShowing, setUsageShowing] = useState(false) + const [searchTerm, setSearchTerm] = useState() + const [uploading, setUploading] = useState(false) const currDir = router.query.dir ? decodeURIComponent(router.query.dir) : '' useEffect(() => { const dir = router.query.dir ? decodeURIComponent(router.query.dir) : '' setDirs(null) + setSearchTerm() if (router.query.dir) { listUserDir(dir).then((res) => { @@ -153,21 +198,33 @@ export default function UserFiles({ router, globalData }) { return (
{currDir && ( -
-
{ - router.back() - // FIXME: consistend going back with browser back button - // back button works like broser back button, unless it would result in site leave - // history: nothing > opened site/usrFiles?dir=... - // history: site > site/userFiles > site/usrFiles?dir=... - router.push(`${router.pathname}`, undefined, { shallow: true }) - }} - > - Vissza +
+
+
{ + router.back() + // FIXME: consistend going back with browser back button + // back button works like broser back button, unless it would result in site leave + // history: nothing > opened site/usrFiles?dir=... + // history: site > site/userFiles > site/usrFiles?dir=... + router.push(`${router.pathname}`, undefined, { + shallow: true, + }) + }} + > + Vissza +
+ {currDir &&
{currDir}
} +
)} + { + setSearchTerm(e) + }} + />
{ @@ -188,70 +245,83 @@ export default function UserFiles({ router, globalData }) {
Feltöltő user
-
-
{ - setAddingNew(currDir ? 'file' : 'dir') - }} - > -
{currDir ? 'Új fájl feltöltése...' : 'Új tárgy...'}
-
- {dirs.length !== 0 && ( - <> - {dirs.sort(dirSorter).map((dir) => { - const { name, date, path, size, user } = dir - return ( -
{ - if (path) { - window.open(`${constants.apiUrl}${path}`, '_blank') - } else { - router.push( - `${router.pathname}?dir=${encodeURIComponent(name)}`, - undefined, - { shallow: true } - ) - } - }} - > -
{name}
-
{new Date(date).toDateString()}
-
- {currDir - ? (size / 1000000).toFixed(2).toString() + ' MB' - : size + ' fájl'} -
-
- {user && - user !== -1 && - (userId === user ? ( -
{ - e.stopPropagation() - if (confirm(`Biztos törlöd '${name}'-t ?`)) { - deleteFile(currDir, name).then(() => { - listUserDir(currDir).then((res) => { - setDirs(res.files) + {dirs ? ( +
+
{ + setAddingNew(currDir ? 'file' : 'dir') + }} + > +
{currDir ? 'Új fájl feltöltése...' : 'Új tárgy...'}
+
+ {dirs.length !== 0 && ( + <> + {dirs.sort(dirSorter).map((dir) => { + const { name, date, path, size, user } = dir + if ( + searchTerm && + !name.toLowerCase().includes(searchTerm.toLowerCase()) + ) { + return null + } + return ( +
{ + if (path) { + window.open(`${constants.siteUrl}${path}`, '_blank') + } else { + setDirs(undefined) + router.push( + `${router.pathname}?dir=${encodeURIComponent( + name + )}`, + undefined, + { shallow: true } + ) + } + }} + > +
{name}
+
{new Date(date).toDateString()}
+
+ {currDir + ? (size / 1000000).toFixed(2).toString() + ' MB' + : size + ' fájl'} +
+
+ {user && + user !== -1 && + (userId === user ? ( +
{ + e.stopPropagation() + if (confirm(`Biztos törlöd '${name}'-t ?`)) { + deleteFile(currDir, name).then(() => { + listUserDir(currDir).then((res) => { + setDirs(res.files) + }) }) - }) - } - }} - > - Törlés -
- ) : ( - `#${user}` - ))} + } + }} + > + Törlés +
+ ) : ( + `#${user}` + ))} +
-
- ) - })} - - )} -
+ ) + })} + + )} +
+ ) : ( + + )}
) } @@ -259,15 +329,44 @@ export default function UserFiles({ router, globalData }) { return (
- Study Docs - Qmining | Frylabs.net + Tanulás segédanyagok - Qmining | Frylabs.net
-

Study Docs

+

Tanulás segédanyagok

-
- Ide tárgyanként lehet feltölteni -
- {dirs ? renderDirList(dirs) : } + {!currDir && ( +
{ + setUsageShowing(true) + }} + className={styles.description} + > + Itt lehet megosztani mindenféle tanulást segítő doksit (kidolgozott + tételektől puskáig mindent).{' '} + Használati útmutatóért és egyéb infókért kattints ide! +
+ )} + {usageShowing && ( + { + setUsageShowing(false) + }} + > +
+ Ez gyakorlatilag egy fájl böngésző, a tárgyak a mappák, és azon + belül lehet fájlokat feltölteni. +

A feltöltött fájlok ellenőrizve vannak, hogy ide valóak-e, de{' '} + + hibás információért, vírusokért és hasonlókért semmi felelősség + vállalás nincs. + {' '} + Ha valami nem idevalót látsz, azt a Kapcsolat oldalon jelezd kérlek. + Tudatos károkozásért ban jár. +

+

+ + )} + {renderDirList(dirs)} {addingNew && ( { @@ -278,6 +377,7 @@ export default function UserFiles({ router, globalData }) { {addingNew === 'file' ? ( <> { setFile(e.target.files[0]) }} @@ -285,7 +385,9 @@ export default function UserFiles({ router, globalData }) {
{ + setUploading(true) uploadFile(currDir, file).then(() => { + setUploading(false) listUserDir(currDir).then((res) => { setDirs(res.files) setAddingNew(null) @@ -298,19 +400,18 @@ export default function UserFiles({ router, globalData }) { ) : ( <> -
Új tárgy neve
-
- { - setNewSubjName(e.target.value) - }} - /> -
+ { + setNewSubjName(e) + }} + />
{ + setUploading(true) newSubj(newSubjName).then(() => { + setUploading(false) listUserDir().then((res) => { setDirs(res.dirs) setAddingNew(null) diff --git a/src/pages/userFiles.module.css b/src/pages/userFiles.module.css index 1abb5a0..9faddf4 100644 --- a/src/pages/userFiles.module.css +++ b/src/pages/userFiles.module.css @@ -5,7 +5,7 @@ } .tableContainer > div { - padding: 15px 5px; + padding: 5px 5px; display: flex; align-items: stretch; } @@ -42,9 +42,11 @@ } .header > div > div { + color: var(--text-color); display: flex; align-items: center; cursor: pointer; + background-color: var(--background-color); } .header > div > div:hover { @@ -69,10 +71,34 @@ } .backButton { - width: 30%; + width: 15%; } .description { padding: 5px; text-align: center; + cursor: pointer; +} + +.text { +} + +.text > b { + color: red; +} + +.currDir { + color: var(--text-color); + text-align: center; + font-size: 20px; +} + +.title { + display: flex; + justify-content: center; + align-items: center; +} + +.title > div:nth-child(2) { + flex: 1; }