{% extends "layout2.html" %}
{% load i18n %}
{% load static %}

{% block css_include %}


{% endblock %}

{% block js_include %}

{% endblock %}


{% block content %}

  <section class="content">
    <div class="row">
      <div class="col-md-12">
        <form id="frontend_edit_form" class="form-horizontal bootstrap-validator-form" action="" method="post" novalidate="novalidate">
          {% csrf_token %}
          {% if save_error or form.non_field_errors %}
          <div class="panel panel-danger">
            <div class="panel-heading">
              {# If there is save/configuration errors #}
              {% if save_error %}
                <ul class="nav nav-tabs pull-right ui-sortable-handle">
                  <li class="active"><a href="#tab_1" data-toggle="tab">{% translate "Message" %}</a></li>
                  <li><a href="#tab_2" data-toggle="tab">{% translate "Advanced informations" %}</a></li>
                </ul>
                <h4 class="panel-title">{% translate "Configuration error" %}</h4>
              {% endif %}
              {% if form.non_field_errors %}
                <h4 class="panel-title"><i class="icon fa fa-ban"></i> {% translate "Form errors" %} </h4>
              {% endif %}
            </div>
            <div class="panel-body">
              {# Print form errors correctly #}
              {% if form.non_field_errors %}
                <div>
                  {{ form.non_field_errors|safe }}
                </div>
              {% endif %}
              {# If there is save/configuration errors #}
              {% if save_error %}
                <div>
                  <div class="tab-content no-padding">
                    <div class="tab-pane active" id="tab_1">
                      <pre class="console-type">{{ save_error.0 }}</pre>
                    </div>
                    <div class="tab-pane" id="tab_2">
                      <pre class="console-type">{{ save_error.1 }}</pre>
                    </div>
                  </div>
                </div>
              {% endif %}
            </div>
          </div>
          {% endif %}
          <div class="panel">
            <div class="panel-heading">
                <h1 class="panel-title"><i class="fa fa-sitemap">&nbsp;</i>{% translate "Local File log forwarder" %}</h1>
            </div>
            <div class="panel-body">
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "Enable forwarder" %}</label>
                    <div class="col-sm-5">
                      {{form.enabled}}
                      {{form.enabled.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "Friendly name" %}</label>
                    <div class="col-sm-5">
                      {{form.name}}
                      {{form.name.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "Local File path" %}</label>
                    <div class="col-sm-5">
                      {{form.file}}
                      {{form.file.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "Flush interval, in seconds" %}</label>
                    <div class="col-sm-5">
                      {{form.flush_interval}}
                      {{form.flush_interval.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "Asynchronous writing" %}</label>
                    <div class="col-sm-5">
                      {{form.async_writing}}
                      {{form.async_writing.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{{form.send_as_raw.label}}</label>
                    <div class="col-sm-5">
                      {{form.send_as_raw}}
                      {{form.send_as_raw.errors|safe}}
                    </div>
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <div class="form-group">
                    <label class="col-sm-4 control-label">{% translate "File(s) retention time, in days" %}</label>
                    <div class="col-sm-5">
                      {{form.retention_time}}
                      {{form.retention_time.errors|safe}}
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{% translate "Execute rotation every" %}</label>
                      <div class="col-sm-5">
                        {{form.rotation_period}}
                        {{form.rotation_period.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <!-- Advanced tab -->
              <div class="row log-mode">
                <div class="col-sm-4 pull-right">
                  <div class="form-group">
                    <button class="btn btn-box-tool" type="button" data-toggle="collapse" data-target=".advanced_options">
                      <i class="fa fa-plus"></i> {% trans "Advanced" %}
                    </button>
                  </div>
                </div>
              </div>
              <div class="form-group collapse advanced_options">
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.queue_size.label}}</label>
                      <div class="col-sm-5">
                        {{form.queue_size}}
                        {{form.queue_size.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.dequeue_size.label}}</label>
                      <div class="col-sm-5">
                        {{form.dequeue_size}}
                        {{form.dequeue_size.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.max_workers.label}}</label>
                      <div class="col-sm-5">
                        {{form.max_workers}}
                        {{form.max_workers.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.queue_timeout_shutdown.label}}</label>
                      <div class="col-sm-5">
                        {{form.queue_timeout_shutdown}}
                        {{form.queue_timeout_shutdown.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.new_worker_minimum_messages.label}}</label>
                      <div class="col-sm-5">
                        {{form.new_worker_minimum_messages}}
                        {{form.new_worker_minimum_messages.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.worker_timeout_shutdown.label}}</label>
                      <div class="col-sm-5">
                        {{form.worker_timeout_shutdown}}
                        {{form.worker_timeout_shutdown.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="col-sm-4 control-label">{{form.enable_retry.label}}</label>
                      <div class="col-sm-5">
                        {{form.enable_retry}}
                        {{form.enable_retry.errors|safe}}
                      </div>
                    </div>
                  </div>
                </div>
                <div id="tab-queue">
                  <div class="row">
                    <div class="col-md-12">
                      <div class="form-group">
                        <label class="col-sm-4 control-label">{{form.enable_disk_assist.label}}</label>
                        <div class="col-sm-5">
                          {{form.enable_disk_assist}}
                          {{form.enable_disk_assist.errors|safe}}
                        </div>
                      </div>
                    </div>
                  </div>
                  <div id="tab-disk">
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <label class="col-sm-4 control-label">{{form.high_watermark.label}}</label>
                          <div class="col-sm-5">
                            {{form.high_watermark}}
                            {{form.high_watermark.errors|safe}}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <label class="col-sm-4 control-label">{{form.low_watermark.label}}</label>
                          <div class="col-sm-5">
                            {{form.low_watermark}}
                            {{form.low_watermark.errors|safe}}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <label class="col-sm-4 control-label">{{form.max_file_size.label}}</label>
                          <div class="col-sm-5">
                            {{form.max_file_size}}
                            {{form.max_file_size.errors|safe}}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <label class="col-sm-4 control-label">{{form.max_disk_space.label}}</label>
                          <div class="col-sm-5">
                            {{form.max_disk_space}}
                            {{form.max_disk_space.errors|safe}}
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <label class="col-sm-4 control-label">{{form.spool_directory.label}}</label>
                          <div class="col-sm-5">
                            {{form.spool_directory}}
                            {{form.spool_directory.errors|safe}}
                          </div>
                        </div>
                      </div>
                    </div>
                  </div> <!-- /.tab-disk -->
                </div> <!-- /.tab-queue -->
              </div> <!-- /.advanced_options -->
            <div class="panel-footer">
              <a type="button" href="{% url 'applications.logfwd.list' %}" class="btn btn-flat btn-default">{% translate "Cancel" %}</a>
              <button type="submit" class="btn btn-info btn-flat pull-right">{% translate "Submit" %}</button>
            </div>
          </div>
        </form>
      </div>
    </div>
  </section>

{% endblock %}

{% block jquery_code %}
  if (!String.prototype.endsWith) {
    String.prototype.endsWith = function(searchString, position) {
      var subjectString = this.toString();
      if (typeof position !== 'number' || !isFinite(position) || Math.floor(position) !== position || position > subjectString.length) {
        position = subjectString.length;
      }
      position -= searchString.length;
      var lastIndex = subjectString.lastIndexOf(searchString, position);
      return lastIndex !== -1 && lastIndex === position;
    };
  }

  $(function() {

    $('.select2').select2();

    /* Switchery mandatory code */
    var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
      elems.forEach(function(html) {
      var switchery = new Switchery(html, {
        'color': '#FA9834'
      });
    });

    /* Show fields depending on chosen mode */
    $('#id_mode').on('change', function(event) {
      var value = $(this).val();
      $('.http-mode').hide();
      $('.tcp-mode').hide();
      $('.'+value+'-mode').show();
    });
    $('#id_mode').trigger('change');

    $("#id_fqdns").tagEditor({
      delimiter: ' '
    });

    $('#id_enable_retry').on('change', function(e){
      if ($(this).is(':checked')) {
        $('#tab-queue').show();
      } else {
        $('#tab-queue').hide();
      }
    }).trigger('change');

    $('#id_enable_disk_assist').on('change', function(e){
      if ($(this).is(':checked')) {
        $('#tab-disk').show();
      } else {
        $('#tab-disk').hide();
      }
    }).trigger('change');

  }); // end of function()

{% endblock %}