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

{% block title %}Edit Circular{% endblock %}

{% block content %}
<div class="kt-subheader kt-grid__item"></div>

{{ form_start(form, { 'attr': { 'class': 'kt-form' }}) }}
<div class="kt-container kt-grid__item kt-grid__item--fluid">
  <div class="kt-portlet kt-portlet--mobile">
    <div class="kt-portlet__head kt-portlet__head--lg">
      <div class="kt-portlet__head-label">
        <h3 class="kt-portlet__head-title">Edit Circular</h3>
      </div>

      <div class="kt-portlet__head-toolbar">
        <div class="kt-portlet__head-wrapper">
          <a href="{{ path('circular_index') }}" class="btn btn-clean btn-icon-sm mr-2"><i
              class="la la-long-arrow-left"></i>Back</a>
          <a href="{{ app.request.uri }}" class="btn btn-secondary btn-bold mr-2">Reset</a>
          <button class="btn btn-primary btn-bold">Submit</button>
        </div>
      </div>
    </div>

    <div class="kt-portlet__body">
      {% include 'parts/flash.html.twig' %}
      {% include 'circular/_form.html.twig' %}
    </div>
  </div>
</div>
{{ form_end(form) }}
{% endblock %}

{% block scripts %}
{{ parent() }}

<script>
  var arrows;

  if (KTUtil.isRTL()) {
    arrows = {
      leftArrow: '<i class="la la-angle-right"></i>',
      rightArrow: '<i class="la la-angle-left"></i>'
    };
  } else {
    arrows = {
      leftArrow: '<i class="la la-angle-left"></i>',
      rightArrow: '<i class="la la-angle-right"></i>'
    };
  }

  $('#circular_uploadedAt').datepicker({
    rtl: KTUtil.isRTL(),
    autoclose: true,
    todayHighlight: true,
    orientation: 'bottom left',
    templates: arrows,
    endDate: '+0d',
    format: 'yyyy-mm-dd'
  });
</script>
<script>
  $(function () {
    $("input[type='file']").change(function () {
      var myid = $(this).attr("id");
      validateImage(myid);
    });
  });
  function validateImage(id) {
    var file = document.getElementById(id).files[0];
    var ext = file.type.split('/').pop().toLowerCase();
    var spanid = $('#' + id).attr('id');
    switch (ext) {
      case 'vnd.openxmlformats-officedocument.wordprocessingml.document':
      case 'msword':
      case 'pdf':
        flag = true;
        $("." + id).text("")
        break;
      default:
        flag = false;
    }

    if (flag == false) {
      $("#error").text("Invalid file type.").css('color', 'red');
      return false;
    } else {
      var size = GetFileSize(id);
      if (size.toFixed(2) > 5.00) {
        $("#error").text("Upload file size must have 5mb or less than").css('color', 'red');
        return false;
      } else {
        $("#error").text("")
        return true;
      }
    }
    function GetFileSize(fileid) {
      fileBytes = $("#" + fileid)[0].files[0].size
      fileSize = fileBytes / 1024 / 1024;// actual file size
      return fileSize
    }
  }
</script>
{% endblock %}