{% extends "wiki/article.html" %}
{% load wiki_tags i18n sekizai_tags %}

{% block pagetitle %}{% trans "Edit" %}: {{ article.current_revision.title }}{% endblock %}

{% block wiki_contents_tab %}

{% addtoblock "js" %}
<script type="text/javascript">
  $(document).ready(
    function ($) {
      accessible_modal("#cheatsheetLink", "#cheatsheetModal .close-modal", "#cheatsheetModal", ".content-wrapper");
      accessible_modal("#previewButton", "#previewModal .close-modal", "#previewModal", ".content-wrapper");
      $("#previewModalBackToEditor").click(function (e) {
        $("#previewModal .close-modal").click();
        e.preventDefault();
      });
    }
  );
</script>
{% endaddtoblock %}

<form method="POST" class="form-horizontal" id="article_edit_form" name="article_edit_form" enctype="multipart/form-data">
  {% include "wiki/includes/editor.html" %}
  <div class="form-actions">
      <button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.target=''; this.form.action='{% url 'wiki:edit' path=urlpath.path article_id=article.id %}'">
        <span class="icon fa fa-check-square-o" aria-hidden="true"></span>
        {% trans "Save changes" %}
      </button>
      <a class="btn btn-large" id="previewButton" href="#previewModal" rel="leanModal"
        onclick="
          document.article_edit_form.target='previewWindow';
          document.article_edit_form.action='{% url 'wiki:preview' path=urlpath.path article_id=article.id %}';
          document.article_edit_form.submit();">
        <span class="icon fa fa-eye" aria-hidden="true"></span>
        {% trans "Preview" %}
      </a>

      <a href="{% url 'wiki:delete' path=urlpath.path article_id=article.id %}" class="pull-right btn btn-danger">
        <span class="icon fa fa-remove" aria-hidden="true"></span>
        {% trans "Delete article" %}
      </a>

  </div>
  <div id="previewModal" class="modal" aria-hidden="true">
    <div class="inner-wrapper" role="dialog" aria-labelledby="preview-title" aria-modal=true>
      <button class="close-modal"><span class="icon fa fa-remove" aria-hidden="true"></span> <span class="sr">{% trans 'Close' %}</span></button>

      <header>
        <h2 id="preview-title">{% trans "Wiki Preview" %}<span class="sr">, {% trans "window open" %}</span></h2>
        <hr/>
      </header>


      <div class="modal-body">
        <iframe name="previewWindow" frameborder="0"></iframe>
      </div>
      <div class="modal-footer">
        <button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.target=''; this.form.action='{% url 'wiki:edit' path=urlpath.path article_id=article.id %}'">
          <span class="icon fa fa-check-square-o" aria-hidden="true"></span>
          {% trans "Save changes" %}
        </button>

        <a id="previewModalBackToEditor" href="#" class="btn btn-large">
          <span class="icon fa fa-circle-arrow-left" aria-hidden="true"></span>
          {% trans "Back to editor" %}
        </a>
      </div>
    </div>
  </div>
  {% include "wiki/includes/cheatsheet.html" %}
</form>

{% endblock %}
