nfp_sites/nfp_moe/app/header.js
Jonatan Nilsson c949cde0df
Some checks failed
/ deploy (push) Failing after 2m43s
nfp.moe: Replace footer with day/night asuna chibi
2024-12-14 07:06:11 +00:00

102 lines
2.9 KiB
JavaScript

const m = require('mithril')
const Authentication = require('./authentication')
const PageTree = require('./page_tree')
const common = require('./common')
const Menu = {
oninit: function(vnode) {
this.currentActive = 'home'
this.error = ''
this.loading = false
this.onbeforeupdate()
if (!PageTree.Tree.length) {
this.refreshTree()
}
},
onbeforeupdate: function() {
let currentPath = m.route.get()
if (currentPath === '/') this.currentActive = 'home'
else if (currentPath === '/login') this.currentActive = 'login'
else if (currentPath && currentPath.startsWith('/page')) this.currentActive = currentPath.slice(currentPath.lastIndexOf('/') + 1)
},
refreshTree: function(vnode) {
this.loading = true
this.error = ''
PageTree.refreshTree()
.catch((err) => {
this.error = 'Error while getting menu tree: ' + err.message + '. Click here to try again.'
})
.then(() => {
this.loading = false
m.redraw()
})
},
logOut: function() {
Authentication.clearToken()
m.route.set('/')
},
view: function() {
return [
m('header', [
m('div.inside', [
m(m.route.Link,
{ href: '/', class: 'title' },
[
m('div.logo.spritesheet'),
m('h1', 'NFP Moe'),
]
),
m('aside', [
Authentication.currentUser
? [
m('p', [
'Welcome ' + Authentication.currentUser.name + '. ',
m('button', { onclick: this.logOut }, '(Log out)'),
]),
m('div', [
m(m.route.Link, { href: '/admin/articles/add' }, 'Create article'),
m(m.route.Link, { href: '/admin/articles' }, 'Articles'),
m(m.route.Link, { href: '/admin/pages' }, 'Pages'),
// m(m.route.Link, { hidden: Authentication.currentUser.rank < 100, href: '/admin/staff' }, 'Staff'),
])
]
: null,
m('button',
{ onclick: common.toggleDarkMode.bind(this) },
common.darkIsOn ? 'Day mode' : 'Night mode'
),
])
]),
]),
m('nav', [
m('div.inside', [
m(m.route.Link, {
href: '/',
class: this.currentActive === 'home' ? 'active' : '',
}, 'Home'),
this.loading ? m('div.loading-spinner') : null,
PageTree.Tree.map((page) => {
let className = ''
if (this.currentActive === page.path) {
className += 'active '
}
return m(m.route.Link, {
href: '/page/' + page.path,
class: className,
}, page.name)
}),
])
]),
this.error ? m('div.error', { onclick: this.refreshTree.bind(this) }, this.error) : null,
]
},
}
module.exports = Menu