47 lines
1.1 KiB
JavaScript
47 lines
1.1 KiB
JavaScript
import onmount from 'onmount'
|
|
import prepend from 'dom101/prepend'
|
|
|
|
const DEFAULTS = {
|
|
// select elements to put anchor on
|
|
rule: 'h2[id]',
|
|
// class name for anchor
|
|
className: 'local-anchor anchor',
|
|
// text of anchor
|
|
text: '#',
|
|
// append before or after innerText?
|
|
shouldAppend: false
|
|
}
|
|
|
|
/*
|
|
* Behavior: Add local anchors
|
|
*/
|
|
|
|
onmount('[data-js-anchors]', function () {
|
|
const data = JSON.parse(this.getAttribute('data-js-anchors') || '{}')
|
|
const rules = Array.isArray(data)
|
|
? data.length
|
|
? data
|
|
: [DEFAULTS]
|
|
: [Object.assign({}, DEFAULTS, data)]
|
|
|
|
for (const { rule, className, text, shouldAppend } of rules) {
|
|
for (const el of this.querySelectorAll(rule)) {
|
|
if (!el.hasAttribute('id')) {
|
|
continue
|
|
}
|
|
|
|
const id = el.getAttribute('id')
|
|
const anchor = document.createElement('a')
|
|
anchor.setAttribute('href', `#${id}`)
|
|
anchor.setAttribute('class', className)
|
|
anchor.innerText = String(text || DEFAULTS.text)
|
|
|
|
if (shouldAppend) {
|
|
el.appendChild(anchor)
|
|
} else {
|
|
prepend(el, anchor)
|
|
}
|
|
}
|
|
}
|
|
})
|