Skip to content

Commit d3170c7

Browse files
SocketlikeSocketlike
committed
make them run in order!! concurrency bugs begone!!!!!
1 parent e22ac5b commit d3170c7

4 files changed

Lines changed: 145 additions & 135 deletions

File tree

‎src/changelog.js‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
const changelogContainer = document.getElementById('changelog-container')
2+
3+
export default async () => {
4+
const changelog = await fetch('/content/changelog.json')
5+
.then((r) => r.json())
6+
.catch(console.error)
7+
8+
if (changelog)
9+
changelogContainer.replaceChildren(
10+
...changelog.map(([hash, title]) => {
11+
const line = document.createElement('div')
12+
line.className = 'line'
13+
14+
const hashLabel = document.createElement('code')
15+
hashLabel.className = 'hash'
16+
hashLabel.classList.toggle('latest', title.includes('origin/main'))
17+
hashLabel.classList.toggle('local-latest', title.includes('HEAD ->'))
18+
hashLabel.textContent = hash.substring(0, 7)
19+
hashLabel.title = hash
20+
21+
const titleLabel = document.createElement('div')
22+
titleLabel.className = 'changelog-title'
23+
titleLabel.textContent = title.includes('origin/HEAD') || title.includes('HEAD ->')
24+
? title.replace(/^\(.+\)/, '')
25+
: title
26+
titleLabel.title = title
27+
28+
line.append(hashLabel, titleLabel)
29+
30+
return line
31+
})
32+
)
33+
}

‎src/content.js‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { marked } from 'https://unpkg.com/marked@17.0.1/lib/marked.esm.js'
2+
3+
import preprocess from '/src/preprocessor.js'
4+
import postprocess from '/src/postprocessor.js'
5+
6+
const main = document.querySelector('main')
7+
8+
const navContainer = document.getElementById('nav-container')
9+
10+
export default async () => {
11+
const contents = {
12+
...await fetch('/content/index.json')
13+
.then((r) => r.json())
14+
.catch(console.error)
15+
}
16+
17+
const path = location.pathname.slice(1)
18+
const content = path ? contents[path]?.path || '/content/not-found.md' : '/content/index.md'
19+
20+
navContainer.replaceChildren(
21+
...Object
22+
.entries(contents)
23+
.filter(([_, { metadata }]) => !metadata?.delisted)
24+
.flatMap(([name, { metadata }]) => {
25+
const e = document.createElement('a')
26+
e.innerText = metadata?.name || name
27+
28+
const path = metadata?.path || name
29+
e.href = path.startsWith('/') ? path : '/' + path
30+
31+
return [e, ' ']
32+
})
33+
)
34+
35+
if (content)
36+
await fetch(content)
37+
.then((r) => r.text())
38+
.then((text) => text.replace(/---[\r\n].*?[\r\n]---/s, ''))
39+
.then((text) => main.replaceChildren(
40+
...postprocess(marked.parse(
41+
preprocess(text)
42+
))
43+
)
44+
)
45+
.catch(console.error)
46+
}

‎src/index.js‎

Lines changed: 7 additions & 135 deletions
Original file line numberDiff line numberDiff line change
@@ -1,143 +1,15 @@
1-
import { marked } from 'https://unpkg.com/marked@17.0.1/lib/marked.esm.js'
21
import hljs from 'https://unpkg.com/@highlightjs/cdn-assets@11.11.1/es/core.min.js'
32

43
import hljsXML from 'https://unpkg.com/@highlightjs/cdn-assets@11.11.1/es/languages/xml.min.js'
54
import hljsMarkdown from 'https://unpkg.com/@highlightjs/cdn-assets@11.11.1/es/languages/markdown.min.js'
65

6+
import loadContent from './content.js'
7+
import loadResponsivity from './responsivity.js'
8+
import loadChangelog from './changelog.js'
9+
710
hljs.registerLanguage('html', hljsXML)
811
hljs.registerLanguage('md', hljsMarkdown)
912

10-
import preprocess from '/src/preprocessor.js'
11-
import postprocess from '/src/postprocessor.js'
12-
13-
const contents = {
14-
...await fetch('/content/index.json')
15-
.then((r) => r.json())
16-
.catch(console.error)
17-
}
18-
19-
const main = document.querySelector('main')
20-
21-
const path = location.pathname.slice(1)
22-
const content = path ? contents[path]?.path || '/content/not-found.md' : '/content/index.md'
23-
24-
const nav = document.querySelector('nav')
25-
const navContainer = document.getElementById('nav-container')
26-
const navButton = document.getElementById('nav-button')
27-
const navCloseButton = document.getElementById('nav-close-button')
28-
const navOverlay = document.getElementById('nav-overlay')
29-
30-
const changelogRoot = document.getElementById('changelog')
31-
const changelogContainer = document.getElementById('changelog-container')
32-
33-
const responsiveEvent = window.matchMedia("only screen and (max-width: 768px)")
34-
35-
let navHidden = responsiveEvent.matches
36-
nav.classList.toggle('hidden', navHidden)
37-
38-
const recalcResponsiveSize = () => {
39-
const sideWidth = `calc(${main.getBoundingClientRect().x}px - 32px)`
40-
41-
nav.style.width = sideWidth
42-
changelogRoot.style.width = sideWidth
43-
}
44-
45-
const recalcNavRight = (immediate = false) => {
46-
const outside = responsiveEvent.matches
47-
? '-100%'
48-
: `calc(-${main.getBoundingClientRect().x}px - 32px - 2px)`
49-
50-
const inside = responsiveEvent.matches
51-
? '0'
52-
: '16px'
53-
54-
if (immediate)
55-
nav.classList.toggle('no-transition', true)
56-
57-
nav.style.right = navHidden ? outside : inside
58-
59-
if (immediate)
60-
setTimeout(
61-
() => nav.classList.toggle('no-transition', false),
62-
100
63-
)
64-
}
65-
66-
const toggleNav = (force = undefined) => {
67-
navHidden = (force !== undefined && !force) || !navHidden
68-
nav.classList.toggle('hidden', navHidden)
69-
recalcNavRight()
70-
}
71-
72-
const recalcResponsive = (immediate = false) => {
73-
recalcResponsiveSize()
74-
recalcNavRight(immediate)
75-
}
76-
77-
recalcResponsive(true)
78-
79-
navContainer.replaceChildren(
80-
...Object
81-
.entries(contents)
82-
.filter(([_, { metadata }]) => !metadata?.delisted)
83-
.flatMap(([name, { metadata }]) => {
84-
const e = document.createElement('a')
85-
e.innerText = metadata?.name || name
86-
87-
const path = metadata?.path || name
88-
e.href = path.startsWith('/') ? path : '/' + path
89-
90-
return [e, ' ']
91-
})
92-
)
93-
94-
navButton.addEventListener('click', toggleNav)
95-
navCloseButton.addEventListener('click', () => toggleNav(false))
96-
responsiveEvent.addEventListener('change', recalcResponsive)
97-
navOverlay.addEventListener('click', () => toggleNav(false))
98-
99-
if (content)
100-
fetch(content)
101-
.then((r) => r.text())
102-
.then((text) => text.replace(/---[\r\n].*?[\r\n]---/s, ''))
103-
.then((text) => main.replaceChildren(
104-
...postprocess(marked.parse(
105-
preprocess(text)
106-
))
107-
)
108-
)
109-
.catch(console.error)
110-
111-
const changelog = await fetch('/content/changelog.json')
112-
.then((r) => r.json())
113-
.catch(console.error)
114-
115-
if (changelog)
116-
changelogContainer.replaceChildren(
117-
...changelog.map(([hash, title]) => {
118-
const line = document.createElement('div')
119-
line.className = 'line'
120-
121-
const hashLabel = document.createElement('code')
122-
hashLabel.className = 'hash'
123-
hashLabel.classList.toggle('latest', title.includes('origin/main'))
124-
hashLabel.classList.toggle('local-latest', title.includes('HEAD ->'))
125-
hashLabel.textContent = hash.substring(0, 7)
126-
hashLabel.title = hash
127-
128-
const titleLabel = document.createElement('div')
129-
titleLabel.className = 'changelog-title'
130-
titleLabel.textContent = title.includes('origin/HEAD') || title.includes('HEAD ->')
131-
? title.replace(/^\(.+\)/, '')
132-
: title
133-
titleLabel.title = title
134-
135-
line.append(hashLabel, titleLabel)
136-
137-
return line
138-
})
139-
)
140-
141-
// okay since it's not rendering sometimes let's just make it wait a bit...
142-
await new Promise((r) => setTimeout(r, 500))
143-
.then(() => hljs.highlightAll())
13+
await loadResponsivity()
14+
await loadContent().then(() => hljs.highlightAll())
15+
await loadChangelog()

‎src/responsivity.js‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
const nav = document.querySelector('nav')
2+
const navButton = document.getElementById('nav-button')
3+
const navCloseButton = document.getElementById('nav-close-button')
4+
const navOverlay = document.getElementById('nav-overlay')
5+
6+
const changelogRoot = document.getElementById('changelog')
7+
8+
const responsiveEvent = window.matchMedia("only screen and (max-width: 768px)")
9+
10+
let navHidden = responsiveEvent.matches
11+
nav.classList.toggle('hidden', navHidden)
12+
13+
const recalcResponsiveSize = () => {
14+
const sideWidth = `calc(${main.getBoundingClientRect().x}px - 32px)`
15+
16+
nav.style.width = sideWidth
17+
changelogRoot.style.width = sideWidth
18+
}
19+
20+
const recalcNavRight = (immediate = false) => {
21+
const outside = responsiveEvent.matches
22+
? '-100%'
23+
: `calc(-${main.getBoundingClientRect().x}px - 32px - 2px)`
24+
25+
const inside = responsiveEvent.matches
26+
? '0'
27+
: '16px'
28+
29+
if (immediate)
30+
nav.classList.toggle('no-transition', true)
31+
32+
nav.style.right = navHidden ? outside : inside
33+
34+
if (immediate)
35+
setTimeout(
36+
() => nav.classList.toggle('no-transition', false),
37+
100
38+
)
39+
}
40+
41+
const toggleNav = (force = undefined) => {
42+
navHidden = (force !== undefined && !force) || !navHidden
43+
nav.classList.toggle('hidden', navHidden)
44+
recalcNavRight()
45+
}
46+
47+
const recalcResponsive = (immediate = false) => {
48+
recalcResponsiveSize()
49+
recalcNavRight(immediate)
50+
}
51+
52+
export default () => {
53+
recalcResponsive(true)
54+
55+
navButton.addEventListener('click', toggleNav)
56+
navCloseButton.addEventListener('click', () => toggleNav(false))
57+
responsiveEvent.addEventListener('change', recalcResponsive)
58+
navOverlay.addEventListener('click', () => toggleNav(false))
59+
}

0 commit comments

Comments
 (0)