{% extends "base.html" %}

{% set active_page = "new_domain" %}

{% block title %}
  <title>
    Add Domain - {{ 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">
            Domain
            <small>New Domain</small>
          </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">Domain - New Domain</li>
          </ol>
        </div>
      </div>
    </div>
  </div>
{% endblock %}

{% block content %}
<section class="content">
  <div class="container-fluid">
    <div class="row">
      <div class="col-4">
        <div class="card shadow card-outline card-secondary">
          <div class="card-header with-border">
            <h3 class="card-title">Create new domain</h3>
          </div>
          <form role="form" method="post" action="{{ url_for('domain.add') }}">
            <input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
            <div class="card-body">
              <div class="form-group">
                <input type="text" class="form-control" name="domain_name" id="domain_name" placeholder="Enter a valid domain name (required)">
              </div>
              {% if domain_override_toggle == True %}
                <div class="form-group">
                  <label>Domain Override Record</label>
                  <input type="checkbox" id="domain_override" name="domain_override" class="checkbox">
                </div>
              {% endif %}
              <select name="accountid" class="form-control" style="width:15em;">
                <option value="0">- No Account -</option>
                {% for account in accounts %}
                  <option value="{{ account.id }}">{{ account.name }}</option>
                {% endfor %}
              </select>
              <br />
              <div class="form-group">
                <label>Type</label>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type" id="radio_type_native" value="native" checked>
                    Native
                  </label>
                </div>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type" id="radio_type_primary" value="primary">
                    Primary
                  </label>
                </div>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type" id="radio_type_secondary" value="secondary">
                    Secondary
                  </label>
                </div>
              </div>
              <div class="form-group">
                <label>Select a template</label>
                <select class="form-control" id="domain_template" name="domain_template">
                  <option value="0">No template</option>
                  {% for template in templates %}
                    <option value="{{ template.id }}">{{ template.name }}</option>
                  {% endfor %}
                </select>
              </div>
              <div class="form-group" style="display: none;" id="domain_primary_address_div">
                <input type="text" class="form-control" name="domain_primary_address" id="domain_primary_address" placeholder="Enter valid Primary Server IP addresses (separated by commas)">
              </div>
              <div class="form-group">
                <label>SOA-EDIT-API</label>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type_soa_edit_api" id="radio_default" value="DEFAULT" checked>
                    DEFAULT
                  </label>
                </div>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type_soa_edit_api" id="radio_increase" value="INCREASE">
                    INCREASE
                  </label>
                </div>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type_soa_edit_api" id="radio_epoch" value="EPOCH">
                    EPOCH
                  </label>
                </div>
                <div class="radio">
                  <label>
                    <input type="radio" name="radio_type_soa_edit_api" id="radio_off" value="OFF"> OFF
                  </label>
                </div>
              </div>
            </div>
            <div class="card-footer">
              <button type="submit" class="btn btn-primary">
                Submit
              </button>
              <button type="button" class="btn btn-default" onclick="window.location.href='{{ url_for('dashboard.dashboard') }}'">
                Cancel
              </button>
            </div>
          </form>
        </div>
      </div>
      <div class="col-8">
        <div class="card shadow card-outline card-secondary">
          <div class="card-header with-border">
            <h3 class="card-title">Help with creating a new domain</h3>
          </div>
          <div class="card-body">
            <dl class="dl-horizontal">
              <dt>Domain name</dt>
                <dd>Enter your domain name in the format of name.tld (eg. powerdns-admin.com). You can also
                    enter sub-domains to create a sub-root zone (eg. sub.powerdns-admin.com) in case you want to
                    delegate sub-domain management to specific users.
                </dd>
              <dt>Type</dt>
                <dd>The type decides how the domain will be replicated across multiple DNS servers.
                  <ul>
                    <li>
                      <b>Native - </b>{{ SITE_NAME }} will not perform any Primary or Secondary zone functions.
                    </li>
                    <li>
                      <b>Primary - </b>{{ SITE_NAME }} will serve as the Primary and will send zone transfers
                      (AXFRs) to other servers configured as secondaries.
                    </li>
                    <li>
                      <b>Secondary - </b>{{ SITE_NAME }} will serve as the Secondary and will request and receive
                      zone transfers (AXFRs) from other servers configured as Primaries.
                    </li>
                  </ul>
                </dd>
                <dt>SOA-EDIT-API</dt>
                  <dd>The SOA-EDIT-API setting defines how the SOA serial number will be updated after a change is
                      made to the domain.
                    <ul>
                      <li>
                        <b>DEFAULT - </b>Generate a soa serial of YYYYMMDD01. If the current serial is lower than
                          the generated serial, use the generated serial. If the current serial is higher or
                          equal to the generated serial, increase the current serial by 1.
                      </li>
                      <li>
                        <b>INCREASE - </b>Increase the current serial by 1.
                      </li>
                      <li>
                        <b>EPOCH - </b>Change the serial to the number of seconds since the EPOCH, aka unixtime.
                      </li>
                      <li>
                        <b>OFF - </b>Disable automatic updates of the SOA serial.
                      </li>
                    </ul>
                  </dd>
                </dl>
                <p>
                  Find more details at <a href="https://docs.powerdns.com/md/">https://docs.powerdns.com/md/</a>
                </p>
              </div>
            </div>
          </div>
      </div>
    </div>
</section>

{% endblock %}

{% block extrascripts %}
  <script>
    $("input[name=radio_type]").change(function () {
      var type = $(this).val();
      if (type == "secondary") {
        $("#domain_primary_address_div").show();
      } else {
        $("#domain_primary_address_div").hide();
      }
    });
  </script>
{% endblock %}

{% block modals %}
  <script>
    {% if domain_override_message %}
      $(document.body).ready(function () {
          var modal = $("#modal_warning");
          var info = "{{ domain_override_message }}";
          modal.find('.modal-body p').text(info);
          modal.modal('show');
      });
    {% endif %}
  </script>

  <div class="modal fade" id="modal_warning">
    <div class="modal-dialog">
      <div class="modal-content modal-sm">
        <div class="modal-header alert-danger">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close" id="button_close_warn_modal">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">
            WARNING
          </h4>
        </div>
        <div class="modal-body">
          <p></p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-flat btn-primary center-block" data-dismiss="modal" id="button_confirm_warn_modal">
            CLOSE
          </button>
        </div>
      </div>
    </div>
  </div>
{% endblock %}