{% extends 'base.html.twig' %}

{% block title %}{{ 'dns.server.title'|trans }}{% endblock %}

{% block body -%}

    <button class="btn btn-default" onclick="location.reload(true)"><i class="fa fa-refresh"></i> {{ 'dns.refresh'|trans }}</button>
    <br /><br />

    <table class="table arecord">
        <thead>
        <tr>
            <th></th>
            <th>{{ 'dns.suggested'|trans }}</th>
            <th>{{ 'dns.actual'|trans }}</th>
        </tr>
        </thead>
        <tr class="record">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td><pre>{{ hostname }}. A <strong class="ip">...</strong></pre></td>
            <td class="result"></td>
        </tr>
    </table>

    <p class="info">
        {{ 'dns.ptr'|trans }}
    </p>

    <table class="table ptrt">
        <thead>
        <tr>
            <th></th>
            <th>{{ 'dns.suggested'|trans }}</th>
            <th>{{ 'dns.actual'|trans }}</th>
        </tr>
        </thead>
        <tr class="ptr">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td><pre><strong class="ip">...</strong> PTR {{ hostname }}</pre></td>
            <td class="result"></td>
        </tr>
        <tr class="ptra">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td>
                <pre>{{ hostname }}. A <strong class="ip">...</strong></pre>
            </td>
            <td class="result">

            </td>
        </tr>
        <tr class="spf">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td>
                <pre><strong>{{ hostname }}</strong>. IN TXT "v=spf1 a -all"</pre>
            </td>
            <td class="result">

            </td>
        </tr>
    </table>

    <p class="warning" style="display: none;"></p>

    <p class="info">{{ 'dns.cert'|trans|raw }}
    </p>

    <table class="table aliases">
        <thead>
        <tr>
            <th></th>
            <th>{{ 'dns.suggested'|trans }}</th>
            <th>{{ 'dns.actual'|trans }}</th>
        </tr>
        </thead>
        <tbody>
        <tr class="smtp">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td><pre>smtp CNAME <strong>{{ hostname }}</strong>.</pre></td>
            <td class="result"></td>
        </tr>
        <tr class="pop">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td><pre>pop CNAME <strong>{{ hostname }}</strong>.</pre></td>
            <td class="result"></td>
        </tr>
        <tr class="imap">
            <td class="status">
                <span class="label-wating glyphicon glyphicon-time"></span>
            </td>
            <td><pre>imap CNAME <strong>{{ hostname }}</strong>.</pre></td>
            <td class="result"></td>
        </tr>
        </tbody>
    </table>

{% endblock %}

{% block javascripts %}
    <script>
        get("{{ path('server_test_dns_aliases') }}", "aliases");
        get("{{ path('server_test_dns_a') }}", "arecord");
        get("{{ path('server_test_dns_ptr') }}", "ptrt");

        {#
                get("{{  path('domain_test_dns_base', {id: entity.id}) }}", "base");
                get("{{ path('domain_test_dns_spam', {id: entity.id}) }}", "spam");
                get("{{ path('domain_test_dns_autoconfig', {id: entity.id}) }}", "xmlautoconfig");
                get("{{ path('domain_test_xml_autoconfig', {id: entity.id}) }}", "config");
        #}
        function get(url, selector) {

            var xhr = new XMLHttpRequest();
            var element = document.querySelector('.' + selector);

            xhr.onreadystatechange = function()
            {
                if (xhr.readyState==4 && xhr.status==200) {
                    var result = JSON.parse(xhr.responseText);

                    for (var i in result) {
                        if(i[0] == '_') continue;
                        var row = element.querySelector('.' + i);
                        for (var x in result[i]) {
                            var item = row.querySelector("." + x);

                            if(x == "status") {
                                if(result[i][x] == "ok")
                                    item.innerHTML = "<span class='label-ok glyphicon glyphicon-ok'></span>";
                                if(result[i][x] == "error")
                                    item.innerHTML = "<span class='label-warning glyphicon glyphicon-remove'></span>";
                                if(result[i][x] == "custom")
                                    item.innerHTML = "<span class='label-skipped glyphicon glyphicon-minus'></span>";
                            } else {
                                var el = document.createElement('pre');
                                el.textContent = el.innerText = result[i][x].isArray ? result[i][x].join(', ') : result[i][x];
                                console.log('x ' + x);
                                item.appendChild(el);
                            }
                        }
                    }

                    if(result["_ip"]) {
                        var ipea = document.querySelectorAll('.ip');
                        for (var a = 0; a < ipea.length; a++){
                            ipea[a].innerText = ipea[a].textContent = result["_ip"];
                        }
                    }

                    if(result["_ptr"]) {
                        var ipeb = document.querySelectorAll('.ptrv');
                        for (var b = 0; b < ipeb.length; b++){
                            ipeb[b].innerText = ipeb[b].textContent = result["_ptr"];
                        }
                    }

                    if(result["_warning"]) {
                        var ipec = document.querySelectorAll('.warning');
                        for (var c = 0; c < ipec.length; c++){
                            ipec[c].style.display = 'block';
                            ipec[c].innerText = ipec[c].textContent = result["_warning"];
                        }
                    }
                }
            };

            xhr.open("GET", url, true);
            xhr.send();
        }
    </script>
{% endblock %}