{% extends "layout.html" %}
{% block header_addition %}
<link rel="stylesheet" media="all" href="{{ url_for('static',filename='lib/codemirror.css') }}" />
<link rel="stylesheet" media="all" href="{{ url_for('static',filename='lib/addon/dialog/dialog.css') }}" />
<link rel="stylesheet" media="all" href="{{ url_for('static',filename='lib/addon/search/matchesonscrollbar.css') }}" />
<script src="{{ url_for('static',filename='lib/codemirror.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/mode/overlay.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/mode/rst/rst.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/dialog/dialog.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/search/searchcursor.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/search/search.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/scroll/annotatescrollbar.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/search/matchesonscrollbar.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static',filename='lib/addon/search/jump-to-line.js') }}" type="text/javascript"></script>
<script>

  $(document).ready(
    function() {
      var textArea = document.getElementById("editor")
      var editor = CodeMirror.fromTextArea(textArea, {
        mode: 'rst',
        lineNumbers: true,
        extraKeys: {"Alt-F": "findPersistent"}
      })
    }
  );
</script>
{% endblock %}
{% block content %}
<div class="container-fluid">
  <div class="row">
    <div class="col-md">
      <form action='/update' method='POST'>
        <div>
          <textarea rows = "30" cols = "120" name = "content" id="editor">{% if filecontent %}{{ filecontent }}
            {% endif %}
          </textarea>
        </div>
        <br>
        <input type='hidden' id='sha' name='sha' value="{{ sha }}">
        <input type='hidden' id='path' name='path' value="{{ path }}">
        <button type="submit">Update in GIT!!</button>
      </form>
    </div>
    <div class='col-md'>
      <div id="drop-area">
        <form class="my-form">
          <p>Upload multiple files with the file dialog or by dragging and dropping images onto the dashed region. Files are automatically uploaded to git!</p>
          <input type="file" id="fileElem" multiple accept="image/*" onchange="handleFiles(this.files)">
          <label class="button" for="fileElem">Select some files</label>
        </form>
        <progress id="progress-bar" max=100 value=0></progress>
      </div>
      <div id="gallery"></div>
    </div>
  </div>
</div>
<script type="text/javascript" src="{{ url_for('static',filename='upload.js') }}"></script>

{% endblock %}