let term = null;
    let socket=null;
    document.addEventListener('DOMContentLoaded', () => {
        Terminal.applyAddon(fullscreen)
        Terminal.applyAddon(fit)
        Terminal.applyAddon(webLinks)
        Terminal.applyAddon(search)
        term = new Terminal({
                col:80,
                row:20,
                cursorBlink: 5,
                macOptionIsMeta: true,
            });
        term.open(document.getElementById('terminal'));
        term.fit()
        term.resize(term.cols, term.rows-5)
        console.log(`size: ${term.cols} columns, ${term.rows} rows`)
        // term.toggleFullScreen(true)
        term.fit()
        term.write("Welcome to AQ web remote-only terminal!\r\n")
        term.on('key', (key, ev) => {
            socket.emit("pty_input", {"input": key}, function(response) {
            });
        });

        const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
        const host = window.location.host;
        socket = io(`${protocol}//${host}/vsc-like`, { path: '/vsc-like-ws' });
        const status = document.getElementById("status")

        socket.on("pty_output", function(data){
            console.log("new output", data)
            term.write(data.output)
        })

        socket.on("connect", () => {
            // fitToscreen()
            status.innerHTML = '<span style="background-color: lightgreen;">connected</span>'
            
            socket.emit("pty_input",{"input":"cd "+window.lesson_data.course_id+"/"+window.lesson_data.chapter_name+'/'+window.lesson_data.lesson_name+"\r"})
            }
        )

        socket.on("disconnect", () => {
            status.innerHTML = '<span style="background-color: #ff8383;">disconnected</span>'
        })

        function fitToscreen(){
            term.fit()
            socket.emit("resize", {"cols": term.cols, "rows": term.rows})
        }

        function debounce(func, wait_ms) {
            let timeout
            return function(...args) {
            const context = this
            clearTimeout(timeout)
            timeout = setTimeout(() => func.apply(context, args), wait_ms)
            }
        }

        const wait_ms = 500;
        window.onresize = debounce(fitToscreen, wait_ms)


    });