Skip to content
Snippets Groups Projects
Commit 19247ac3 authored by Cliff Li's avatar Cliff Li
Browse files

Working navbar using Tabs

parent b9a9d930
No related branches found
No related tags found
1 merge request!40Components
......@@ -2,43 +2,75 @@ import m from 'mithril';
import { checkLogin, isLoggedIn, logout } from '../models/auth';
import { Tabs } from '../components';
const defaultTabs = [
{ label: 'AMIV', href: '/', oncreate: m.route.link },
{ label: 'Events', href: '/events', oncreate: m.route.link },
{ label: 'Studienunterlagen', href: '/studydocuments', oncreate: m.route.link },
{ label: 'Jobs', href: '/jobs', oncreate: m.route.link },
];
const defaultTabs = ['AMIV', 'Events', 'Studienunterlagen', 'Jobs'];
const tabsLoggedOut = ['Login'];
const tabsLoggedIn = ['Profil', 'Logout'];
const tabsLoggedOut = () => [
{
label: 'Login',
href: '/login',
oncreate: m.route.link,
},
];
const gotoRoute = route => {
const current = m.route.get();
if (current !== route) m.route.set(route);
};
export default class Layout {
constructor() {
checkLogin();
this.setTabs();
this.selectedTabIndex = 0;
this.wasLoggedIn = isLoggedIn();
}
setTabs() {
const tabOptions = isLoggedIn() ? tabsLoggedIn : tabsLoggedOut;
this.tabs = [...defaultTabs, ...tabOptions];
}
const tabsLoggedIn = () => [
{ label: 'Profil', href: '/profile', oncreate: m.route.link },
{
label: 'Logout',
events: {
onclick: () => {
logout().then(() => {
m.route.set('/');
});
return false;
},
},
},
];
selectTab(tabIndex) {
const tabString = this.tabs[tabIndex];
switch (tabString) {
case 'AMIV':
gotoRoute('/');
break;
case 'Events':
gotoRoute('/events');
break;
case 'Studienunterlagen':
gotoRoute('/studydocuments');
break;
case 'Jobs':
gotoRoute('/jobs');
break;
case 'Profil':
gotoRoute('/profile');
break;
case 'Logout':
gotoRoute('/');
logout();
break;
case 'Login':
gotoRoute('/login');
break;
default:
console.log('Tab not known!');
}
}
onupdate() {
if (this.wasLoggedIn !== isLoggedIn()) this.selectedTabIndex = 0;
this.wasLoggedIn = isLoggedIn();
this.setTabs();
this.selectTab(this.selectedTabIndex);
}
module.exports = {
oninit: checkLogin,
view(vnode) {
const tabOptions = isLoggedIn() ? tabsLoggedIn(vnode) : tabsLoggedOut(vnode);
return m('div', [
m(Tabs, { tabs: [...defaultTabs, ...tabOptions] }),
m(Tabs, {
onChange: ({ index }) => {
this.selectedTabIndex = index;
},
tabs: this.tabs.map(tab => ({ label: tab })),
selectedTab: this.selectedTabIndex,
}),
m('main', vnode.children),
]);
},
};
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment