{% extends "dash/_frame.twig" %}
{#
  if page is in 'edit' mode, set variables
  if not, just make them empty
#}
{% if mode == 'edit' %}
  {% set id = page['id']  %}
  {% set uuid = page['uuid']  %}
  {% set slug = page['slug'] %}
  {% set layout = page['layout'] %}
  {% set feature = page['feature']  %}
  {% set _title = page['title']  %}
  {% set tags = page['tags']  %}
  {% set content = page['content']  %}
  {% set date = page['created'] %}
  {% set updated = page['updated'] %}
{% else %}
  {% set id = ''  %}
  {% set uuid = ''  %}
  {% set slug = '' %}
  {% set layout = 'page' %}
  {% set feature = ''  %}
  {% set title = '' %}
  {% set tags = ''  %}
  {% set content = ''  %}
  {% set date = '' %}
  {% set updated = '' %}
{% endif %}

{% block title %}
  {{ title }}
{% endblock %}

{% block stylesheets %}
  <link rel="stylesheet" type="text/css" href="/assets/css/dash.css?=dfdfd">
  {% endblock %}

  {% block mainContent %}
    <div id="post-edit-index" data-index="{{ id }}" data-uuid="{{ uuid }}" data-slug="{{ slug }}" data-layout="{{ layout }}">
      <div id="post-edit-index-wrapper">
        <div id="post-feature">
          {% if page['feature'] == null %}
            <div id="featured-image-drop">
              DRAG AND DROP IMAGE OR <label for="featured-image-upload">CLICK TO CHOSE</label> 
            </div>
          {% else %}
            <div id="featured-new-image-btn">
              <button id="new-feature-upload">
                <svg id="new-feature-upload" viewbox="0 0 20 20" class="icons"><use xlink:href="/assets/images/global/sprite.svg#entypo-image-inverted"/></svg>
              </button>
            </div>
            <div id="featured-image-drop">
              <img id="featured-image" src="{{ feature }}"/>
            </div>

          {% endif %}

        </div>
        <div id="post-header">
          <div id="post-header-wrapper" class="columns">
              <div id="post-title" class="column">
                <label>TITLE</label>
                <textarea id="post_title" type="text" name="post_title" class="post-edit" placeholder="TITLE">
                  {{- _title -}}
                </textarea>
                
                <div id="layouts">
                  <label>LAYOUTS</label>
                  <select id="page-templates">
                    {% for view in views %}
                      {% if view == page['layout']  %}
                        <option value={{ view }} selected>{{ view  }}</option>
                      {% else %}
                        <option value={{ view }}>{{ view  }}</option>
                      {% endif  %}
                      
                    {% endfor  %}
                  </select>
              </div>
              <label>CREATED</label>
              <span id="post-date" type="text">
                {{ date }}
              </span>
              </div>
              <div id="post-meta" class="column">
                <label>TAGS</label>
                <textarea id="post_tags" type="text" name="post_tags" class="form-control" placeholder="tags [comma seperated]">
                  {{- tags -}}
                </textarea>
                <label>OPTIONS</label>
                {% apply spaceless %}
                  {{ include("dash/partials/options.twig") }}
                {% endapply %}
                <label>UPDATED</label>
                <span id="post-date" type="text">
                  {{ updated }}
                </span>        
                <input id="featured-image-upload" type="file" name="featured-image-upload"/>
                <input id="post-image-upload" type="file" name="post-image-upload"/>
                <input id="form_token" name="token" type="hidden" value="{{ token }}">
              </div>
            </div>
          </div>
          <div id="edit-post">
            {% apply spaceless %}
              {{ include("dash/partials/editor.twig") }}
            {% endapply %}         
            <div id="edit-post-wrapper">
              <pre><code spellcheck="false" id="edit-post-text" contenteditable="true" class="language-markdown"> {{- content -}}</code></pre>
            </div>
        </div>
      </div>
    </div>
  {% endblock %}

  {% block javascripts %}
    <script src="/assets/scripts/Start.js" type="text/javascript"></script>
  {% endblock %}