{% extends 'layout.html' %}
{% load i18n %}
{% load static %}


{% block wrap %}
    {% url 'tickets:new' as new_ticket %}
    <div id="livechat-info">
        <p>{% blocktrans trimmed with new_ticket as new_ticket %}
            We're not able to chat all the time for now.
            If we don't reply, please <a href="{{new_ticket}}">open a support ticket</a>
            and we will get back to you as soon as possible!
            {% endblocktrans %}
        </p>
    </div>

    <iframe id="livechat-iframe" src="https://vpn.ccrypto.org/kiwi/?nick={{username}}&theme=ccrelaxed#ccrypto"></iframe>

    <script type="text/javascript">
        (function() {
            function resize() {
                var h = (document.body.offsetHeight
                         - document.getElementById("topbar").offsetHeight
                         - document.getElementById("header").offsetHeight
                         - document.getElementById("footer").offsetHeight
                         - document.getElementById("livechat-info").offsetHeight
                         - 10);
                console.log(h);
                document.getElementById("livechat-iframe").style.height = h + "px";
            }
            window.addEventListener("load", resize);
            window.addEventListener("resize", resize);
        })();
    </script>
{% endblock %}

{# Remove the blue live chat link in the corner #}
{% block livechat_thing %}
{% endblock %}
