{% extends "repo_master.html" %}
{% from "_formhelper.html" import render_bootstrap_field %}

{% block title %}{% if not type or type == 'new'
    %}New issue{% elif type and type == 'edit'
    %}Edit issue #{{ issueid }} {% endif %} - {{ repo.name }}{% endblock %}
{% set tag = "home" %}


{% block repo %}
<div class="row">
  <div class="col-md-8 col-md-offset-2">
    <div class="card">
      <div class="card-header">
        {% if not type or type == 'new' %}
        New issue
        {% elif type and type == 'edit' %}
        Edit issue #{{ issueid }}
        {% endif %}
      </div>
      <div class="card-block">
        {% if not type or type == 'new' %}
          <form action="{{ url_for('.new_issue',
                           username=username, repo=repo.name) }}" method="post"
                enctype="multipart/form-data">

        {% elif type and type == 'edit' %}
          <form action="{{ url_for('.edit_issue', username=username,
                             repo=repo.name, issueid=issueid) }}" method="post"
                enctype="multipart/form-data">
        {% endif %}
        {{ render_bootstrap_field(form.title, field_description="the name of your project") }}
        {{ render_bootstrap_field(form.status, field_description="bug statuss") }}
        {{ render_bootstrap_field(form.private, field_description="the name of your project") }}
          <fieldset class="form-group">
            <label for="issue_content"><strong>Description</strong></label>
            <small class="text-muted pull-xs-right"><span class="btn btn-sm btn-secondary inactive" aria-pressed="false" id="previewinmarkdown">Preview</span></small>
            <textarea class="form-control" rows="8" id="issue_content" name="issue_content"
                placeholder="Report your issue/request here">
              {%- if issue %}{{ issue.content }}{% endif -%}
            </textarea>
            <div>

              {% if form.issue_content.errors %}
              <span class="pull-xs-right text-danger">
                <small>
                {% for error in form.issue_content.errors %}
                  {{ error }}&nbsp;
                {% endfor %}
                </small>
              </span>
              {% endif %}
            </div>
            <div id="preview">
            </div>
          </fieldset>
        Attach file <input id="file-picker" type="file" name="filestream" accept="image/*" multiple>


        <p class="buttons indent">
          {% if not type or type == 'new' %}
          <input type="submit" class="btn btn-primary" value="Create">
          {% elif type and type == 'edit' %}
          <input type="submit" class="btn btn-primary" value="Update">
          {% endif %}
          <input type="button" value="Cancel" class="btn btn-secondary" onclick="history.back();">
          {{ form.csrf_token }}
        </p>
      </form>
      </div>
    </div>

{% if authenticated and repo_admin and type and type == 'edit' %}
<form method="post" class="pull-xs-right" action="{{ url_for('.delete_issue',
                    username=username, repo=repo.name, issueid=issueid) }}">
  <button class="btn btn-danger" type="submit"
      onclick="return confirm('Are you sure to delete this ticket? \nThis is final and cannot be un-done.');"
      title="Delete this ticket">
    <span class="icon icon-trash blue"></span>
    Delete issue
  </button>
  {{ form.csrf_token }}
</form>
{% endif %}


  </div>
</div>

{% endblock %}

{% block jscripts %}
{{ super() }}
<script type="text/javascript">
{% if authenticated and form %}
$(document).ready(function() {
  // Set up the handler for the file input box.
  $("#file-picker").on("change", function() {
    //doUpload("{{ form.csrf_token.current_token }}", this.files);
    var _txt = $("#issue_content").val();
    if (_txt) {
      _txt += '\n';
    }
    var _loc = "{{ url_for('view_issue_raw_file', repo=repo.name, username=username, filename='') }}" + this.file;

    $("#issue_content").val(_txt + '<!!image>');
  });
});
{% endif %}

$(function() {
  $( "#previewinmarkdown" ).click(
    function(event, ui) {
        if ($( "#previewinmarkdown" ).hasClass("inactive")){
          var _text = $( "#issue_content" ).val();
          var _url = "{{ url_for('markdown_preview') }}";
            $.ajax({
                url: _url ,
                type: 'POST',
                data: {
                  content: _text,
                  csrf_token: "{{ form.csrf_token.current_token }}",
                },
                dataType: 'html',
                success: function(res) {
                    $( "#preview" ).html(res);
                    $( "#previewinmarkdown" ).removeClass("inactive");
                    $( "#previewinmarkdown" ).addClass("active");
                    $( "#issue_content" ).hide();
                    $( "#preview" ).show();
                },
                error: function() {
                    alert('Unable to generate preview!'+error);
                }
            });
            return false;
          } else if ($( "#previewinmarkdown" ).hasClass("active")){
            $( "#previewinmarkdown" ).addClass("inactive");
            $( "#previewinmarkdown" ).removeClass("active");
            $( "#issue_content" ).show();
            $( "#preview" ).hide();
          }
    }
  );
});
</script>
{% endblock %}