JS to make AO3 downloads nicer to read

let save_scroll = 0;
let timer_id = null
let last_scroll_time = 0
let num_chapters = 0
const scale = 1000000000

function init_book()
{
    let body = document.querySelector('body')
    let mw = `${Math.round(3*body.clientWidth/4)}px`
    let img = document.querySelectorAll('img')
    img.forEach(e => {e.style.maxWidth = mw})
    make_chapters()
    set_chapter()
    window.addEventListener('scroll', scroll_updater)
    window.addEventListener('resize', scroll_updater)
    window.addEventListener('visibilitychange', visibility_changed)
}

//{ level 1

function make_chapters()
{
    let chnum = 0

    document.querySelectorAll('#chapters > div').forEach(e => {
        e.classList.add('chapter')
        if (e.classList.contains('group')) {
            ++chnum
            e.classList.add(`ch_${chnum}_top`)
            e.id = `ch_${chnum}`
        }
        e.classList.add(`ch_${chnum}`)
    })
    num_chapters = chnum
    if (num_chapters > 0) {
        document.querySelector('#preface').classList.add('chapter')
        document.querySelector('#preface').classList.add('ch_1')
        document.querySelector('#afterword').classList.add('chapter')
        document.querySelector('#afterword').classList.add(`ch_${chnum}`)


    }

    add_chapter_nav(chnum)
}

function set_chapter()
{
    var url = new URL(window.location.href);
    var c = url.searchParams.get("c");
    c = (c !== null) ? parseInt(c) : 1
    show_chapter(c)
}

function visibility_changed(e)
{
    if (document.visibilityState === 'visible') {
        restore_position();
    }
}

function scroll_updater(e)
{
    if (timer_id === null) {
        timer_id = setInterval(check_scroll, 1000)
        timer_running = true
    }
    last_scroll_time = Date.now()
}

//}{ level 2

function add_chapter_nav(n)
{
    let b = document.querySelector('body')

    let nd = make_nav_div(n, 'top', 0)
    b.prepend(nd)

    nd = make_nav_div(n, 'bottom', 0)
    b.append(nd)

}

function show_chapter(n)
{
    if (num_chapters > 1) {
        let chclass = `ch_${n}`
        document.querySelectorAll('.chapter').forEach(e => {
            e.classList.add('ch_off')
            e.classList.remove('ch_on')
        })
        document.querySelectorAll(`.ch_${n}`).forEach(e => {
            e.classList.add('ch_on')
            e.classList.remove('ch_off')
        })

        document.querySelectorAll('.setch').forEach(e => {
            e.value = n
        })

        document.querySelectorAll('.prev_button').forEach(e => {
            e.classList.remove('bt_off')
        })
        document.querySelectorAll('.next_button').forEach(e => {
            e.classList.remove('bt_off')
        })
        if (n === 1) {
            document.querySelectorAll('.prev_button').forEach(e => {
                e.classList.add('bt_off')
            })
        } else if (n === num_chapters) {
            document.querySelectorAll('.next_button').forEach(e => {
                e.classList.add('bt_off')
            })
        }
        add_param('c', n)
    }
    restore_position()
}

function restore_position()
{
    var url = new URL(window.location.href);
    var m = url.searchParams.get("m")
    if (m === null) {
        m = localStorage.getItem("mode")
    }
    set_night_mode(m === null ? 0 : parseInt(m))

    var s = url.searchParams.get("s");
    if (s !== null) {
        window.requestAnimationFrame(() => {
            window.requestAnimationFrame(() => {
                scroll_to_pct(parseInt(s));
            });
        });
        save_scroll = s
        last_scroll_time = Date.now()
    }
}

function check_scroll()
{
    let now = Date.now()
    if (now - last_scroll_time < 1000)
        return

    let pct = get_scroll_pos()
    if (pct != save_scroll) {
        save_scroll = pct;
        add_param("s", pct);
    }
    clearInterval(timer_id)
    timer_id = null
}

//}{ level 3

function set_night_mode(m)
{
    if (m === 0) {
        document.querySelector('body').classList.remove('night')
        add_param('m', 0)
        localStorage.setItem('mode', 0)
    } else {
        document.querySelector('body').classList.add('night')
        add_param('m', 1)
        localStorage.setItem('mode', 1)
    }

    document.querySelectorAll('.mode_button').forEach(e => {
        e.value = m === 0 ? 'Night Mode' : 'Day Mode'
    })
}

function make_nav_div(n, sid, verbose)
{
    let navdiv = make_element('div', {'class':'nav_div'})
    if (n > 0) {
        let s = make_element('span', {'class':'nav_group'})

        let e = make_element('input', {'type':'button',
            'name':'prev', 'value':'previous', 'onclick':'move_ch(-1)',
            'class':'prev_button'})
        s.append(e)

        let sel = make_element('select', {'onchange':`jump_ch('${sid}')`,
            'id':sid, 'class':'setch'})
        s.append(sel)

        for (let i = 1; i <= n; ++i) {
            e = make_element('option',{'value':i})
            let title = get_chapter_title(i)
            title = `${i}: ${title}`
            e.innerText = title
            if (verbose) {
                console.log(`Found chapter ${title}`)
            }
            sel.append(e)
        }

        e = make_element('input', {'type':'button',
            'name':'next', 'value':'next', 'onclick':'move_ch(1)',
            'class':'next_button'})
        s.append(e)

        navdiv.append(s)
    }

    let nm = make_element('input', {'type':'button', 'class':'mode_button',
        'name':'mode', 'value':'mode', 'onclick':'change_mode()'})
    navdiv.append(nm)

    return navdiv
}

function add_param(name, value)
{
    let url = new URL(window.location.href);
    url.searchParams.set(name, value);
    window.history.replaceState(null, "", url.pathname + url.search);
}

function scroll_to_pct(s)
{
    let h_vis = document.documentElement.clientHeight;
    let h_all = document.documentElement.scrollHeight;
    let span = h_all - h_vis;
    let y = Math.round(span * s / scale);
    //console.log(`s=${s}, all=${h_all}, span=${span}, vis=${h_vis}, new_pos=${y}`)
    document.documentElement.scrollTo({top: y});
}

//}{ level 4

function make_element(tag, attrs)
{
    let e = document.createElement(tag)
    for (let key in attrs) {
        e.setAttribute(key, attrs[key])
    }
    return e
}

function get_scroll_pos()
{
    let h_vis = document.documentElement.clientHeight;
    let h_scroll = document.documentElement.scrollTop;
    let h_all = document.documentElement.scrollHeight;
    let span = h_all - h_vis;
    let s = span > 0 ? Math.round(scale * h_scroll / span) : 0;
    //console.log(`s=${s}, all=${h_all}, span=${span}, vis=${h_vis}, pos=${h_scroll}`);
    return s
}

function get_chapter_title(n)
{
    return document.querySelector(`div.ch_${n}_top h2`).innerText
}

function jump_ch(sid)
{
    let v = document.querySelector(`#${sid}`).value
    add_param('s', 0)
    show_chapter(parseInt(v))
    document.activeElement.blur()
}

function move_ch(dir)
{
    let e = document.querySelector('.ch_on')
    let n = 1
    while (n < 1000) {
        if (e.classList.contains(`ch_${n}`)) { break }
        ++n
    }
    let new_ch = n + dir
    if (new_ch < 1) { new_ch = 1 }
    if (new_ch > num_chapters) { new_ch = num_chapters }
    if (new_ch !== n) {
        add_param('s', 0)
        show_chapter(new_ch)
    }
}

function change_mode()
{
    let onq = document.querySelector('body.night')
    set_night_mode(onq ? 0 : 1)
}

//}

window.addEventListener('load', init_book)