{% extends "base.html" %}
{% set active_page = "admin_settings" %}
{% block title %}<title>Zone Record Settings - {{ SITE_NAME }}</title>{% endblock %}

{% block dashboard_stat %}
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">Zone Record Settings</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ url_for('dashboard.dashboard') }}">Dashboard</a></li>
                        <li class="breadcrumb-item active">Zone Record Settings</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block content %}
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 col-sm-6 col-lg-4">
                    <form role="form" method="post">
                        <input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
                        <input type="hidden" name="create" value="{{ create }}">
                        <div class="card card-outline card-primary shadow">
                            <div class="card-header">
                                <h3 class="card-title">Settings Editor</h3>
                            </div>
                            <!-- /.card-header -->
                            <div class="card-body">
                                <table class="table table-bordered">
                                    <tr>
                                        <th>#</th>
                                        <th>Record</th>
                                        <th>Forward Zone</th>
                                        <th>Reverse Zone</th>
                                    </tr>
                                    {% for record in f_records %}
                                        <tr>
                                            <td>{{ loop.index }}</td>
                                            <td>{{ record }}</td>
                                            <td>
                                                <input type="checkbox" id="fr_{{ record|lower }}"
                                                       name="fr_{{ record|lower }}"
                                                       class="checkbox" {% if f_records[record] %}checked{% endif %}>
                                            </td>
                                            <td>
                                                <input type="checkbox" id="rr_{{ record|lower }}"
                                                       name="rr_{{ record|lower }}"
                                                       class="checkbox" {% if r_records[record] %}checked{% endif %}>
                                            </td>
                                        </tr>
                                    {% endfor %}
                                </table>
                            </div>
                            <!-- /.card-body -->
                            <div class="card-footer">
                                <button type="submit" class="btn btn-primary float-right" title="Save Settings">
                                    <i class="fa-solid fa-save"></i>&nbsp;Save Settings
                                </button>
                            </div>
                            <!-- /.card-footer -->
                        </div>
                        <!-- /.card -->
                    </form>
                </div>
                <!-- /.col -->

                <div class="col-12 col-sm-6 col-lg-8">
                    <div class="card card-outline card-secondary shadow">
                        <div class="card-header">
                            <h3 class="card-title">Settings Editor Help</h3>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <p>Select record types you allow user to edit in the forward zone and reverse zone. Take a
                                look at
                                <a href="https://doc.powerdns.com/authoritative/appendices/types.html" target="_blank">PowerDNS
                                    docs</a>
                                for
                                full list of supported record types.
                            </p>
                        </div>
                        <!-- /.card-body -->
                    </div>
                    <!-- /.card -->
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </section>
{% endblock %}

{% block extrascripts %}
    <script>
        $('.checkbox').iCheck({
            checkboxClass: 'icheckbox_square-blue',
            increaseArea: '20%'
        })
    </script>
{% endblock %}