{% extends "base.html" %}
{% block left_pannel %}override{% endblock %}

{% block content %}

    {% if not current_user.is_authenticated %}
        <button class="unselected" onclick="location.href = '/login';">login</button>
    {% else %}
        <link rel="stylesheet" href="{{ url_for('static', filename='node_modules/xterm/css/xterm.css') }}"/>
        <script src="{{ url_for('static', filename='node_modules/xterm/lib/xterm.js') }}"></script>
        <script src="{{ url_for('static', filename='node_modules/xterm-addon-fit/lib/xterm-addon-fit.js') }}"></script>

        <table>
            <tr>
                <td width="20%" height="90%">
                    <div id="console"></div>
                </td>
                <td width="80%">
                    <iframe src="/novnc/vnc.html?resize=scale&path=novnc/websockify&autoconnect=true&view_only"
                            width="100%" height="100%" frameborder="0"></iframe>
                </td>
            </tr>
        </table>


        <script>


        </script>
        <script>
            var term = new Terminal();
            const fitAddon = new FitAddon.FitAddon();
            term.loadAddon(fitAddon);
            term.open(document.getElementById('console'));
            fitAddon.fit()

            document.getElementById("console").style.textAlign = "left"
            const eventSource = new EventSource('/stream');

            eventSource.onmessage = (event) => {
                term.writeln(event.data)
            };

        </script>

    {% endif %}

{% endblock %}