diff --git a/lib/docs-viewer.js b/lib/docs-viewer.js index fa54ac3..69134e4 100644 --- a/lib/docs-viewer.js +++ b/lib/docs-viewer.js @@ -54,6 +54,8 @@ customElements.define('docs-viewer', class extends HTMLElement { this.home = document.querySelector('#home') + this.status = document.querySelector('#status') + this.page = '/readme.md' this.home.style.display = 'none' @@ -64,59 +66,60 @@ customElements.define('docs-viewer', class extends HTMLElement { }) observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] }) - this.panel.addEventListener('click', (evt) => { + this.panel.addEventListener('click', async (evt) => { + evt.preventDefault() if (evt.target?.tagName !== 'A') return + const targetUrl = new URL(evt.target.href) + if (targetUrl.hash === '#documentation') { + await this.load('/readme.md') + return + } const href = evt.target.href const { origin } = new URL(location.href) const url = new URL(href, location.href) if (url.origin !== origin) return window.open(href) - evt.preventDefault() this.load(evt.target.pathname) }) - window.addEventListener('hashchange', () => { - if (location.hash === '#documentation' && this.page === '/readme.md') this.home.style.display = 'none' - else this.home.style.display = '' - }) - window.addEventListener('popstate', (evt) => { - if (location.hash.startsWith('#documentation')) { - const home = location.hash.endsWith('-home') - if (home) { - this.page = '/readme.md' - history.replaceState(null, null, this.page + location.hash) - location.href = '/pulse.html#documentation' - return - } - - if (location.pathname.endsWith('.md') === false) { - history.replaceState(null, null, this.page + location.hash) - return - } - - evt.preventDefault() - this.page = location.pathname - this.#load().catch((err) => this.#error(err)) + window.addEventListener('click', async (evt) => { + evt.preventDefault() + if (evt.target?.tagName !== 'A') return + const targetUrl = new URL(evt.target.href) + if (targetUrl.hash === '#documentation') { + const docsViewer = document.querySelector('docs-viewer') + await docsViewer.load('/readme.md') } }) - this.#load().catch((err) => this.#error(err)) + window.addEventListener('popstate', async (evt) => { + console.log(evt) + if (evt.state === null) { + this.home.style.display = 'none' + this.panel.style.display = 'none' + this.status.style.display = '' + return + } + const docsViewer = document.querySelector('docs-viewer') + await docsViewer.load(evt.state.page, { back: true }) + return + }) + + const config = global[Symbol.for('pear.config')] || {} + if (config.link && config.link !== 'pear:dev') { + window.addEventListener('load', async () => { + await this.load(config.link.slice(5)) + }) + } } - #error (err) { - try { this.panel.querySelector('slot').innerHTML = err.stack } catch (e) { console.error(err, e) } - } - - load (page) { - document.documentElement.scrollTo(0, 0) - this.page = page - history.pushState(null, null, page + location.hash) - return this.#load().catch((err) => this.#error(err)) - } - - async #load () { - this.panel.querySelector('slot').innerHTML = marked.parse(await (await fetch(this.page)).text(), { headerIds: false, mangle: false }) - if (location.hash === '#documentation' && this.page === '/readme.md') this.home.style.display = 'none' - else this.home.style.display = '' + async load (page, opts = {}) { + const html = await fetch(page) + const text = await marked.parse(await html.text()) + this.panel.querySelector('slot').innerHTML = text, { headerIds: false, mangle: false } + this.home.style.display = '' + this.panel.style.display = '' + this.status.style.display = 'none' + if (!opts.back) history.pushState({ page }, null) } }) diff --git a/pulse.html b/pulse.html index 08ad979..cedcf28 100644 --- a/pulse.html +++ b/pulse.html @@ -64,11 +64,6 @@ } section { - display: none; - } - - - section:target { display: block; padding-top: 156px; } @@ -209,12 +204,6 @@ System Status Documentation -
                             
-        __ \    _ \   _` |   __| 
-        |   |   __/  (   |  |    
-        .__/  \___| \__,_| _|    
-      _|                                 
-