{% extends "wiki/base.html" %}
{% from "includes/error_list.html" import errorlist %}
{% set title = _(document.title + ' | Edit {title}')|fe(title=('Template' if document.is_template else 'Article')) %}
{% block title %}{{ page_title(title) }}{% endblock %}
{% set classes = 'edit' %}
{% block bodyclass %}edit{% if document.is_template %} is-template{% endif %}{% endblock %}

{% block site_css %}
    {{ super() }}
    {{ css('wiki-edit') }}
    {{ css('jquery-ui') }}
{% endblock %}

{% block content %}
  <article id="edit-document">
    <form id="wiki-page-edit" class="editing" method="post" action="">
      {{ csrf() }}
      <fieldset>

        {{ errorlist(revision_form) }}

        {% if collision %}
        <section class="collision-compare">
          <p>{% trans %}
            Please review the differences between your changes and the changes
            saved since you started editing. You may save again, but try to
            resolve any conflicts by hand so that the changes made since you
            started are not lost.
          {% endtrans %}</p>

          <div class="revision-diff">
            <header>
              <div>
                  <h3>{{ _('Your Changes') }}</h3>
                <p>{{ _('Revision {id} by {user} on {date}')|fe(id=original_revision.id, user=original_revision.creator, date=datetimeformat(original_revision.created, format='longdatetime')) }}</p>
              </div>
              <div>
                <h3>
                    <a href="{{ url('wiki.revision', current_revision.document.full_path, current_revision.id) }}">
                      {{ _('Current Revision:')|f(num=current_revision.id) }}
                    </a>
                </h3>
                <p>{{ _('Revision {id} by {user} on {date}')|fe(id=current_revision.id, user=current_revision.creator, date=datetimeformat(current_revision.created, format='longdatetime')) }}</p>
              </div>
            </header>

            {% set title = request.POST['title'] %}
            {% set slug = request.POST['slug'] %}
            {% set keywords = request.POST['request'] %}
            {% set summary = request.POST['summary'] %}

            {% if title and current_revision.title and title != current_revision.title %}
                <h4>{{ _('Title:') }}</h4>
                <div><p>{{ title }}</p></div>
                <div><p>{{ current_revision.title }}</p></div>
            {% endif %}

            {% if tags and current_revision.tags and tags != current_revision.tags %}
                <h4>{{ _('Tags:') }}</h4>
                <div><p>{{ tags }}</p></div>
                <div><p>{{ current_revision.tags }}</p></div>
            {% endif %}

            {% if keywords and current_revision.keywords and keywords != current_revision.keywords %}
                <h4>{{ _('Keywords:') }}</h4>
                <div><p>{{ keywords }}</p></div>
                <div><p>{{ current_revision.keywords }}</p></div>
            {% endif %}

            {% if summary and current_revision.summary and summary != current_revision.summary %}
                <h4>{{ _('Search results summary:') }}</h4>
                <div><p>{{ summary }}</p></div>
                <div><p>{{ current_revision.summary }}</p></div>
            {% endif %}

            {% if content and current_revision.content and content != current_revision.content %}
                <h4>{{ _('Content:') }}</h4>
                {{ diff_table(content, current_content, current_revision.id, "Proposed") }}
            {% endif %}

          </div>
        </section>
        {% endif %}

        <header id="article-head">

          <div class="title">
            <h1>{{ _('<span class="action">Editing</span> <em>{title}</em>')|fe(title=revision.title) }}</h1>
            <p class="save-state" id="draft-status">
              {% if not section_id %}
                <a href="" id="btn-properties">{{ _('Edit Page Title and Properties') }}</a><br />
              {% endif %}
              {% trans %}Draft <span id="draft-action"></span> <time id="draft-time" class="timeago" title=""></time>{% endtrans %}
            </p>
          </div>

          {% include 'wiki/includes/page_buttons.html' %}

          {% if revision_form and not section_id %}
            <ul class="metadata">
                <li class="clear">
                    <label for="id_title">{{_('Title:')}}</label>
                    {{ revision_form.title | safe }}
                </li>
                {% if document.is_template %}
                  <input type="hidden" name="toc_depth" value="0" />
                {% else %}
                  {% include 'wiki/includes/document_toc_field.html' %}
                {% endif %}
                <li class="clear">
                  <fieldset class="duration-container">
                    <legend>{{_('Rendering max age:')}}</legend>
                    <div>
                      <label for="days">{{_('Days')}}</label>
                      <input type="number" name="days" id="days" placeholder="days" value="0" step="1" min="0" />
                    </div>
                    <div>
                      <label for="hours">{{_('Hours')}}</label>
                      <input type="number" name="hours" id="hours" placeholder="hours" value="0" max="60" step="1" min="0" />
                    </div>
                    <div>
                      <label for="minutes">{{_('Minutes')}}</label>
                      <input type="number" name="minutes" id="minutes" placeholder="minutes" value="0" max="60" step="15" min="0" />
                    </div>
                  </fieldset>
                  <div class="offscreen" aria-hidden="true">
                    {{ revision_form.render_max_age |  safe }}
                  </div>
                </li>
                <li class="metadata-choose-parent clear">
                    {{_('Find the translation source with the lookup below and then click "Save Changes."')}}
                    <br />
                    <label for="parent_text">{{_('Lookup:')}}</label> <input type="text" id="parent_text" />
                    <input type="hidden" name="parent_id" id="parent_id" value="{{ revision_form.instance.document.parent.id }}" />
                </li>
            </ul>
          {% endif %}

          {% if not collision %}
            {{ revision_form.current_rev | safe }}
          {% endif %}

        </header>

        {% if request.user.get_profile().wiki_activity()|count == 0 %}
          <section class="first-contrib-welcome">
            <h2>{{_('Thank you for taking the time to improve MDN!')}}</h2>
            <p>
              {% trans url=devmo_url('Project:MDN/Contributing/Editor_guide/') %}
                It looks like this is your first contribution to MDN. You can find answers to common editing questions within our <a target="_blank" href="{{ url }}">Editor Guide</a>.
              {% endtrans %}
            </p>
            <p>{{_("Don't be afraid to break something, you can always revert your changes.")}}</p>
            <p>{{_('Have fun and be proud of your contribution!')}}</p>
          </section>
        {% endif %}

        {% if revision_form %}
            {% include 'wiki/includes/guide_links.html' %}

            {% if document.is_template %}
              {{ revision_form.content | safe }}
              <div id="ace_content" class="editor-container"></div>
            {% else %}
              <div class="ckeditor-container editor-container">{{ revision_form.content | safe }}</div>
            {% endif %}

            <input type="hidden" name="form" value="rev" />
            {{ revision_form.hidden_fields()|join|safe }}

            <section class="page-meta">
              {% set tags = document.tags.all() %}
              <section id="page-tags" class="page-tags">
                <h2><i aria-hidden="true" class="icon-tags"></i>{{ _('Tags') }} <a href="{{ devmo_url('Project:MDN/Contributing/Editor_guide/Editing#The_tags_box') }}"><i aria-hidden="true" title="{{ _('Learn how to tag an article') }}" class="icon-question-sign editor-help-icon"></i></a></h2>
                <p>
                  {% trans url=devmo_url('Project:MDN/Contributing/Tagging_standards') %}
                    Categorize the article. It will make the article findable under the right filters in the search engine. <a target="_blank" href="{{ url }}">Read the Tagging Guide</a>.
                  {% endtrans %}
                </p>
                <input id="tagit_tags" type="text" name="tags" value="{% for tag in tags %}{{ tag.name }},{% endfor %}" maxlength="255" />
              </section>
            </section>

            {% include 'wiki/includes/revision_comment.html' %}

            {% include 'wiki/includes/review_tags.html' %}

        {% endif %}
      </fieldset>
      {% include 'wiki/includes/wiki_notifier.html' %}
    </form>

    {% include 'wiki/includes/attachment_list.html' %}

    <!-- Add information about this document in JSON format for use in CKEditor -->
    <script type="text/javascript">
      mdn.wiki.document = {{ document.get_json_data()|tojson }};
    </script>

  </article>

{% endblock %}

{% block site_js %}
    {{ super() }}
    {{ js('jquery-ui') }}
    {{ js('framebuster') }}
    {% include 'wiki/includes/tag_suggestions.html' %}

    {% if document.is_template %}
      {% include 'wiki/includes/ace_scripts.html' %}
    {% else %}
      {% include 'wiki/includes/ckeditor_scripts.html' %}
    {% endif %}
    {{ js('wiki-edit') }}

{% endblock %}