viveksantayana/wanderhome-quiz-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Built skeleton for the web site.

Browse Source 
Need to write the text and make the quiz console.
This commit is contained in:
Vivek Santayana
2022-08-28 07:07:52 +01:00
parent d15a4efbc8
commit fd1c4ee14d
27 changed files with 737 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
client/src/router/index.js
View File

@ -1,30 +1,127 @@
import { createRouter, createWebHistory } from 'vue-router'
import { mdiAccountGroupOutline, mdiAccountQuestion, mdiCodeTags, mdiHandCoin, mdiHome, mdiInformation } 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 About from '@/views/About.vue'
import Quiz from '@/views/Quiz.vue'
const routes = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
component: About
component: Home,
meta: {
index: 0,
svgPath: mdiHome,
title: 'Home'
}
},
{
path: '/quiz',
name: 'Quiz',
component: Quiz
component: Quiz,
meta: {
index: 1,
svgPath: mdiAccountQuestion,
title: 'Take the Quiz'
}
},
{
path: '/about',
name: 'About',
component: About,
meta: {
index: 2,
svgPath: mdiInformation,
title: 'About'
},
children: [
{
path: '',
name: 'About',
component: AboutPage,
meta: {
index: 0,
parentIndex: 2,
svgPath: mdiInformation,
title: 'Background'
}
},
{
path: 'wanderhome',
name: 'Wanderhome',
component: Wanderhome,
meta: {
index: 1,
parentIndex: 2,
svgPath: mdiHandCoin,
title: 'About Wanderhome'
}
},
{
path: 'acknowledgements',
name: 'Acknowledgements',
component: Acknowledgements,
meta: {
index: 2,
parentIndex: 2,
svgPath: mdiAccountGroupOutline,
title: 'Acknowledgements'
}
},
{
path: 'https://git.vsnt.uk/',
name: 'SourceCode',
meta: {
index: 3,
parentIndex: 2,
svgPath: mdiCodeTags,
title: 'View Source Code'
}
}
]
}
]
const router = createRouter({
const Router = createRouter({
history: createWebHistory(),
routes
})
export default router
Router.beforeEach((to, from, next) => {
if (to.meta.title != 'Home') {
document.title = `Wanderhome Quiz | V.S. - ${to.meta.title}`
} else {
document.title = `Wanderhome Quiz | V.S.`
}
next()
})
Router.afterEach( (to, from) => {
const enterActiveClass = 'transition-all duration-300 ease-in'
const leaveActiveClass = 'transition-all duration-300 ease-out'
const baseFromClass = 'transform opacity-0 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
const toIndex = to.meta.parentIndex ? to.meta.parentIndex : to.meta.index
const slideInDirection = toIndex < fromIndex ? '-translate-x-1/3' : 'translate-x-1/3'
const slideOutDirection = toIndex < fromIndex ? 'translate-x-1/3' : '-translate-x-1/3'
to.meta.mainEnterActiveClass = enterActiveClass
to.meta.mainLeaveActiveClass = leaveActiveClass
to.meta.mainEnterFromClass = baseFromClass + ' ' + slideInDirection
to.meta.mainLeaveToClass = baseFromClass + ' ' + slideOutDirection
} else if ( to.fullPath.split('/')[1] == from.fullPath.split('/')[1] && from.matched.length ) {
const fromIndex = from.meta.index
const toIndex = to.meta.index
const slideInDirection = toIndex < fromIndex ? '-translate-y-1/3' : 'translate-y-1/3'
const slideOutDirection = toIndex < fromIndex ? 'translate-y-1/3' : '-translate-y-1/3'
to.meta.panelEnterActiveClass = enterActiveClass
to.meta.panelLeaveActiveClass = leaveActiveClass
to.meta.panelEnterFromClass = baseFromClass + ' ' + slideInDirection
to.meta.panelLeaveToClass = baseFromClass + ' ' + slideOutDirection
}
})
export default Router