{% 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'] %}
  {% set media = page['media'] %}
{% else %}
  {% set id = ''  %}
  {% set uuid = ''  %}
  {% set slug = '' %}
  {% set layout = 'page' %}
  {% set feature = ''  %}
  {% set title = '' %}
  {% set tags = ''  %}
  {% set content = ''  %}
  {% set date = '' %}
  {% set updated = '' %}
  {% set media = '' %}
{% 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="page-file-manager">
              <div id="page-file-wrapper">
                <div id="page-file-drop">
                  <label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
                </div>
                IMAGES AND VIDEO
                <div id="page-images-list">
                  {% if media|length > 1 %}
                    {% for item in media %}
                      {% if item.type == "mp4"%}
                        <div id="{{loop.index0}}" class="video-item" data-source="{{ item.file }}"></div>
                      {% else %}
                          <div id="{{loop.index0}}" class="img-item" style="background: url({{ item.file }}) no-repeat center center / cover"></div>
                      {% endif %}
                    {% endfor %}
                 {% else  %}
                    <div id="0" class="img-item" style="background: url({{ media[0] }}) no-repeat center center / cover">
                  {% endif %}
                  
                </div>
                FILES
                <div id="page-files-list"></div>
              </div>
              
            </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="page-files-upload" type="file" name="page-files-upload" multiple/>
                <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">
              <textarea id="edit" spellcheck="false">{{- content -}}</textarea>
              <pre id="highlight">
                <code id="highlight-content" class="language-md">
                  
                </code>
              </pre>
            </div>
        </div>
      </div>
    </div>
  {% endblock %}

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