klammertext/sks/document/js/resize_text.js

/* Toggling between text with the table of contents and the text without it */

function resize_text_width(toc_width) {
    const displayed = displayed_text();
    const style = window.getComputedStyle(displayed, null);
    const offset = parseInt(style.getPropertyValue("padding-left"))
          + parseInt(style.getPropertyValue("padding-right"));
    if (toc_width !== undefined) {
        K.width(displayed, K.width("#middle") - toc_width - offset);//Sec - K.width("#resizer"));
    } else {
        /*
        const style = window.getComputedStyle(displayed, null);
        const offset = parseInt(style.getPropertyValue("padding-left"))
              + parseInt(style.getPropertyValue("padding-right"));
        */
        K.width(displayed, K.width("#middle") - offset);
    }
}

function get_top_header() {
    return header_in_window("#text > p, #text > div");
}

function set_top_pos(top_header, original_top_pos) {
    const new_top_pos = top_header.getBoundingClientRect().top;
    const offset = original_top_pos - new_top_pos;
    if (offset !== 0) {
        //const text = K.get("#text");
        const text = displayed_text();
        text.scrollTo({top : text.scrollTop - offset});
    }
}

function maintain_text_position(func) {
    //const text_rect = K.get("#text").getBoundingClientRect();
    const text_rect = displayed_text().getBoundingClientRect();
    const top = text_rect.top - 10;
    let top_elt;
    let elt;
    //for (let elt of K.get("#text").children) {
    for (elt of displayed_text().children) {
        if (K.top(elt) >= top) {
            top_elt = elt;
            break;
        }
    }
    if (top_elt) {
        let current_top = top_elt.getBoundingClientRect().top;
        func.call();
        set_top_pos(top_elt, current_top);
    } else {
        func.call();
    }
}


function set_buttons(mode) {
    let button;
    for (button of ["#next", "#previous", "#fit"]) {
        K.visible(button, mode);
    }
    for (button of K.getv(".depthchoice")) {
        K.visible(button, mode);
    }
}

function textshow() {
    if (K.visible("#toc")) {
        save_position();
        K.visible("#toc", "hide");
        K.visible("#resizer", "hide");
        K.text("#textshow", "Table of contents");
        set_buttons("hide");
        resize_text_width();
        //resize_toc();
        resize_images();
    } else {
        K.visible("#toc", "show");
        K.visible("#resizer", "show");
        K.text("#textshow", "Text only");

        /*
        let fit_active = K.attr("#fit_check", "active");
        if (fit_active === "false") {
            K.get("#fit_check").click();
        }
        */
        //resize_images();
        restore_position();
        set_buttons("show");
        resize_toc();
        resize_images();

        // Restore previous state:
        /*
        if (fit_active === "false") {
            K.get("#fit_check").click();
        }
        */
    }
    //resize_images();
    //adjust_widths();
    //center_elements();
    //set_code_comment_width();
    //set_imagecode_width();
    // adjust_footnotes();
}

window.addEventListener("load", function (event) {

    K.get("#textshow").addEventListener(
        "click",
        function (event) {
            event.preventDefault();
            maintain_text_position(textshow);
        });

    window.addEventListener(
        "resize",
        function (event) {
            maintain_text_position(
                function () {
                    resize_text_width();
                    resize_toc();
                    //resize_images();
                });
        });
    define_keypress("T", "#textshow");
});