diff --git a/client/src/router/index.js b/client/src/router/index.js index 027ce82..a926050 100644 --- a/client/src/router/index.js +++ b/client/src/router/index.js @@ -1,11 +1,20 @@ import { createRouter, createWebHistory } from 'vue-router' -import { mdiAccountGroupOutline, mdiAccountQuestion, mdiCodeTags, mdiHandCoin, mdiHome, mdiInformation } from '@mdi/js' +import { mdiAccountBoxMultiple, mdiAccountGroupOutline, mdiAccountQuestion, mdiChartBox, mdiCodeTags, mdiCounter, mdiEarth, mdiHandCoin, mdiHome, mdiInformation, mdiWeb } from '@mdi/js' import About from '@/views/about/Index.vue' import AboutPage from '@/views/about/About.vue' import Acknowledgements from '@/views/about/Acknowledgements.vue' import Wanderhome from '@/views/about/Wanderhome.vue' import Home from '@/views/Home.vue' -import Quiz from '@/views/Quiz.vue' +import Quiz from '@/views/quiz/Index.vue' +import QuizPage from '@/views/quiz/Quiz.vue' +import Question from '@/views/quiz/Question.vue' +import Error404 from '@/views/errors/Error404.vue' +import Refused from '@/views/errors/Refused.vue' +import Results from '@/views/results/Index.vue' +import ResultsPage from '@/views/results/Results.vue' +import Scores from '@/views/results/Scores.vue' +import Answers from '@/views/results/Answers.vue' +import Statistics from '@/views/results/Statistics.vue' const routes = [ { @@ -26,7 +35,32 @@ const routes = [ index: 1, svgPath: mdiAccountQuestion, title: 'Take the Quiz' - } + }, + children: [ + { + path: '', + name: 'Quiz', + component: QuizPage, + meta: { + index: 0, + parentIndex: 1, + title: 'Take the Quiz' + } + }, + { + path: 'question/:id', + name: 'Question', + component: Question, + props: route => ({ + id: parseInt(route.params.id) + }), + meta: { + index: 1, + parentIndex: 1, + title: 'Take the Quiz' + } + } + ] }, { path: '/about', @@ -82,6 +116,92 @@ const routes = [ } } ] + }, + { + path: '/results', + name: 'Results', + component: Results, + meta: { + index: -1, + title: 'Results', + svgPath: mdiAccountBoxMultiple + }, + children: [ + { + path: '', + name: 'Result', + component: ResultsPage, + meta: { + index: 0, + title: 'Your Results', + svgPath: mdiAccountBoxMultiple, + parentIndex: -1 + } + }, + { + path: 'all', + name: 'Scores', + component: Scores, + meta: { + index: 1, + title: 'All Scores', + svgPath: mdiCounter, + parentIndex: -1 + } + }, + { + path: 'statistics', + name: 'Statistics', + component: Statistics, + meta: { + index: 2, + title: 'Statistics', + svgPath: mdiChartBox, + parentIndex: -1 + } + }, + { + path: 'answers', + name: 'Answers', + component: Answers, + meta: { + index: 3, + title: 'Global Answers', + svgPath: mdiEarth, + parentIndex: -1 + } + } + ] + }, + { + path: '/404', + name: 'Error404', + component: Error404, + meta: { + index: -1, + title: 'Error 404: Not Found', + svgPath: mdiWeb + } + }, + { + path: "/:catchAll(.*)", + name: 'NotFound', + redirect: '/404', + meta: { + index: -1, + title: 'Error 404: Not Found', + svgPath: mdiWeb + } + }, + { + path: "/err_refused", + name: 'Refused', + component: Refused, + meta: { + index: -1, + title: 'Error: Connection Refused', + svgPath: mdiWeb + } } ] @@ -100,8 +220,8 @@ Router.beforeEach((to, from, next) => { }) Router.afterEach( (to, from) => { - const enterActiveClass = 'transition-all duration-300 ease-in' - const leaveActiveClass = 'transition-all duration-300 ease-out' + const enterActiveClass = 'transition-all duration-300 origin-top ease-in' + const leaveActiveClass = 'transition-all duration-300 origin-top ease-out' const baseFromClass = 'transform opacity-0 md:scale-75' if ( to.fullPath.split('/')[1] !== from.fullPath.split('/')[1] || !from.matched.length ) { const fromIndex = from.meta.parentIndex ? from.meta.parentIndex : from.meta.index diff --git a/client/src/views/Home.vue b/client/src/views/Home.vue index 8fa377c..d81c0e9 100644 --- a/client/src/views/Home.vue +++ b/client/src/views/Home.vue @@ -1,19 +1,24 @@ \ No newline at end of file diff --git a/client/src/views/about/About.vue b/client/src/views/about/About.vue index 16c1a8c..5e931e0 100644 --- a/client/src/views/about/About.vue +++ b/client/src/views/about/About.vue @@ -1,95 +1,98 @@ \ No newline at end of file diff --git a/client/src/views/about/Acknowledgements.vue b/client/src/views/about/Acknowledgements.vue index 16fb362..6bfb45f 100644 --- a/client/src/views/about/Acknowledgements.vue +++ b/client/src/views/about/Acknowledgements.vue @@ -1,18 +1,23 @@ \ No newline at end of file diff --git a/client/src/views/about/Index.vue b/client/src/views/about/Index.vue index 0b168d3..4343ccd 100644 --- a/client/src/views/about/Index.vue +++ b/client/src/views/about/Index.vue @@ -1,9 +1,8 @@ \ No newline at end of file diff --git a/client/src/views/errors/Error404.vue b/client/src/views/errors/Error404.vue new file mode 100644 index 0000000..040bad0 --- /dev/null +++ b/client/src/views/errors/Error404.vue @@ -0,0 +1,38 @@ + + + \ No newline at end of file diff --git a/client/src/views/errors/Refused.vue b/client/src/views/errors/Refused.vue new file mode 100644 index 0000000..11ca413 --- /dev/null +++ b/client/src/views/errors/Refused.vue @@ -0,0 +1,34 @@ + + + \ No newline at end of file diff --git a/client/src/views/quiz/Index.vue b/client/src/views/quiz/Index.vue new file mode 100644 index 0000000..51a9c9b --- /dev/null +++ b/client/src/views/quiz/Index.vue @@ -0,0 +1,63 @@ + + \ No newline at end of file diff --git a/client/src/views/quiz/Question.vue b/client/src/views/quiz/Question.vue new file mode 100644 index 0000000..1585d55 --- /dev/null +++ b/client/src/views/quiz/Question.vue @@ -0,0 +1,219 @@ + + + + + \ No newline at end of file diff --git a/client/src/views/quiz/Quiz.vue b/client/src/views/quiz/Quiz.vue new file mode 100644 index 0000000..01bee3e --- /dev/null +++ b/client/src/views/quiz/Quiz.vue @@ -0,0 +1,61 @@ + + + \ No newline at end of file diff --git a/client/src/views/results/Answers.vue b/client/src/views/results/Answers.vue new file mode 100644 index 0000000..8a2dac0 --- /dev/null +++ b/client/src/views/results/Answers.vue @@ -0,0 +1,23 @@ + + \ No newline at end of file diff --git a/client/src/views/results/Index.vue b/client/src/views/results/Index.vue new file mode 100644 index 0000000..1ef543a --- /dev/null +++ b/client/src/views/results/Index.vue @@ -0,0 +1,34 @@ + + \ No newline at end of file diff --git a/client/src/views/results/Results.vue b/client/src/views/results/Results.vue new file mode 100644 index 0000000..d28e55b --- /dev/null +++ b/client/src/views/results/Results.vue @@ -0,0 +1,78 @@ + + \ No newline at end of file diff --git a/client/src/views/results/Scores.vue b/client/src/views/results/Scores.vue new file mode 100644 index 0000000..0d2adf9 --- /dev/null +++ b/client/src/views/results/Scores.vue @@ -0,0 +1,56 @@ + + \ No newline at end of file diff --git a/client/src/views/results/Statistics.vue b/client/src/views/results/Statistics.vue new file mode 100644 index 0000000..dc7f8ec --- /dev/null +++ b/client/src/views/results/Statistics.vue @@ -0,0 +1,23 @@ + + \ No newline at end of file