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

{% block title %}Edit - {{ repo.name }}{% endblock %}
{% set tag = "home" %}
{% block header %}
<script src="{{ url_for('static', filename='codemirror/codemirror.js') }}"></script>
<link rel="stylesheet" href="{{ url_for('static', filename='codemirror/codemirror.css') }}">
{% endblock%}

{% block repo %}

<div class="card">
  <div class="card-header">
      <ol class="breadcrumb">
      <li><a href="{{ url_for('view_tree', username=username,
                  repo=repo.name, identifier=branchname)
      }}"><span class="oi" data-glyph="random"></span>&nbsp; {{ branchname }}</a></li>{%
    for file in filename.split('/') %}
      {% if loop.first %}
      {% set path = file %}
      {% else %}
      {% set path = path + '/' + file %}
      {% endif %}
      {% if loop.index != loop.length %}<li><a
      href="{{ url_for('view_file', username=username,
              repo=repo.name, identifier=branchname,
              filename=path)}}"
        ><span class="oi" data-glyph="folder"></span>&nbsp; {{ file }}</a></li>{% elif file %}<li class="active"><span class="oi" data-glyph="{% if output_type == 'tree' %}folder{% else %}file{% endif %}"></span>&nbsp; {{ file }}</li>{% endif %}
    {% endfor %}
    </ol>
  </div>
  <div class="card-block p-a-0">
    <form action="{{ url_for(
          'edit_file', username=username, repo=repo.name,
          branchname=branchname, filename=filename) }}"
          method="post">
    {{ form.csrf_token }}

    <textarea id="textareaCode" name="content">{{ data }}</textarea>

    <div id="commit_block" class="p-a-2">
      <fieldset class="form-group">
        <label for="email"><strong>Committing as</strong></label>
        <div>
          <select id="email" name="email" class="c-select">
            {% for email in user.emails %}
            <option value="{{ email.email }}" {%
                if form.email.data == email.email %}selected{%
                endif %}>{{ email.email }}</option>
            {% endfor %}
          </select>
          {{ user.username | avatar(16) | safe }}
          {{ user.fullname }}
        </div>
      </fieldset>
      <fieldset class="form-group">
        <label for="branch"><strong>Branch</strong></label>
        <div>
          <span id="branch"><select name="branch" class="c-select">
            {% for branch in branches %}
            <option value="{{ branch }}" {%
                if form.branch.data or branchname == branch %}selected{%
                endif %}>{{ branch }}</option>
            {% endfor %}
          </select></span>
          <input type="radio" name="braction" value="existing" checked />Existing branch
          <input type="radio" name="braction" value="new" />New branch
        </div>
      </fieldset>
      <fieldset class="form-group">
        <label for="commit_title"><strong>Commit Title</strong></label>
        <input type="text" class="form-control" id="commit_title" name="commit_title"
            placeholder="Update {{ filename }}"
            value="{{ form.commit_title.data if form.commit_title.data else 'Update %s' filename }}" />
      </fieldset>
      <fieldset class="form-group">
        <label for="commit_message"><strong>Commit Description</strong></label>
        <textarea rows="5" class="form-control" type="text" id="commit_message"
            name="commit_message"
            placeholder="An optional description of the change">
        {{- form.commit_message.data if form.commit_message.data -}}
        </textarea>
      </fieldset>
      <div>
        <input type="submit" class="btn btn-primary" value="Commit changes">
        <input type="button" class="btn btn-secondary" value="Clear" id="clear_comment" />
      </div>
    </div>

    </form>
  </div><!-- end cardblock-->
</div> <!-- end card -->

{% endblock %}

{% block jscripts %}
{{ super() }}
<script>var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("textareaCode"), {
    lineNumbers: true
  });</script>
<script type="text/javascript">
$( "#clear_comment").click(
  function() {
    $( "#commit_message" ).val("");
  }
);

var lbranch = $('#branch').html();

$("input[name=braction]:radio").change(function (e) {
  if ($(e.currentTarget).val() == 'new'){
    console.log('new');
    $('#branch').html('<input type="text" placeholder="Branch name" name="branch">');
  } else {
    console.log('not new');
    $('#branch').html(lbranch);
  }
});
</script>
{% endblock %}