mirror of
https://github.com/JonnyBro/JaBa.git
synced 2024-12-05 03:16:24 +05:00
79 lines
2.4 KiB
JavaScript
79 lines
2.4 KiB
JavaScript
|
/* global matchMedia, navaid, gtag */
|
||
|
|
||
|
const dev = location.protocol === 'http:'
|
||
|
const urls = ['https://zerodevx.github.io/zero-md/', 'http://127.0.0.1:5000/docs/']
|
||
|
const base = dev ? urls[1] : urls[0]
|
||
|
const app = document.querySelector('.app')
|
||
|
const nav = document.querySelector('.nav')
|
||
|
const offset = document.querySelector('.offset')
|
||
|
let links
|
||
|
let height
|
||
|
let router
|
||
|
let firstRun = true
|
||
|
|
||
|
const tick = () => new Promise(resolve => requestAnimationFrame(resolve))
|
||
|
const getTail = path => path.split('/').filter(i => i).pop()
|
||
|
const getTitle = name => name.split('-').map(i => i.charAt(0).toUpperCase() + i.slice(1)).join(' ')
|
||
|
const setTitle = title => { document.head.querySelector('title').innerText = title }
|
||
|
|
||
|
const createMenu = async () => {
|
||
|
const makeLinks = links => `<ul>${links.reduce((a, c) => `${a}<li><a href="${c[1]}">${c[0]}</a></li>`, '')}</ul>`
|
||
|
const resp = await fetch(`${base}sitemap.txt`)
|
||
|
const text = await resp.text()
|
||
|
links = text.split('\n').filter(i => i && !i.endsWith('/v1/')).map(i => [getTitle(getTail(i)), dev ? i.replace(urls[0], urls[1]) : i])
|
||
|
links[0][0] = 'Overview'
|
||
|
nav.insertAdjacentHTML('afterbegin', makeLinks(links))
|
||
|
await tick()
|
||
|
height = nav.offsetHeight
|
||
|
}
|
||
|
|
||
|
const listenMedia = () => {
|
||
|
const mql = matchMedia('(min-width: 768px)')
|
||
|
const resize = ev => { offset.style.marginTop = ev.matches ? `-${height}px` : '' }
|
||
|
resize({ matches: mql.matches })
|
||
|
mql.addEventListener('change', resize)
|
||
|
}
|
||
|
|
||
|
const setActive = () => {
|
||
|
const nodes = nav.querySelectorAll('a')
|
||
|
nodes.forEach(a => {
|
||
|
const isActive = a.pathname === location.pathname
|
||
|
a.classList.toggle('active', isActive)
|
||
|
if (isActive && !firstRun) {
|
||
|
setTitle(a.innerText)
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
|
||
|
const setRoutes = () => {
|
||
|
const run = url => {
|
||
|
app.src = url ? `${url}readme.md` : ''
|
||
|
if (firstRun) {
|
||
|
app.render().then(() => setTimeout(() => app.goto(location.hash), 250))
|
||
|
} else {
|
||
|
app.render()
|
||
|
}
|
||
|
setActive()
|
||
|
firstRun = false
|
||
|
gtag('event', 'page_view', {
|
||
|
page_location: location.pathname
|
||
|
})
|
||
|
}
|
||
|
router = navaid(`${getTail(base)}`)
|
||
|
router.on('/', () => run(base))
|
||
|
for (let a = 1; a < links.length; a++) {
|
||
|
const tail = getTail(links[a][1])
|
||
|
router.on(`${tail}/`, () => run(`${base}${tail}/`))
|
||
|
}
|
||
|
router.on('*', () => run())
|
||
|
router.listen()
|
||
|
}
|
||
|
|
||
|
const init = async () => {
|
||
|
await createMenu()
|
||
|
listenMedia()
|
||
|
setRoutes()
|
||
|
}
|
||
|
|
||
|
init()
|