{% extends theme("master.html") %}

{% block title %} - Administration{% endblock %}

{% block content %}
    <div id="wrapper">
        {% include theme("menu.html") %}
        <div id="page-wrapper">
            <div id="edit-window">
                <div class="row">
                    <div class="col-lg-12">
                        <h1 class="page-header">{{ action }} {{ content_type }}</h1>
                        <form role="form" method="POST">
                            <input type="hidden" name="user_id" id="user-id" value="{{ content.user.id }}" />
                            <div class="form-group">
                                <label for="title">Title</label>
                                <input class="form-control focus" id="title" name="title" value="{{ content.title  }}" />
                            </div>
                            <div class="form-group row">
                                <div class="col-xs-2">
                                    <label for="content-parser">Content Type</label>
                                    <select class="form-control" id="content-parser" name="content_parser">
                                        <option value="markdown"{% if content.parser == 'markdown' %} selected{% endif %}>Markdown</option>
                                        <option value="textile"{% if content.parser == 'textile' %} selected{% endif %}>Textile</option>
                                        <option value="html"{% if content.parser == 'html' %} selected{% endif %}>HTML</option>
                                        <option value="mediawiki"{% if content.parser == 'mediawiki' %} selected{% endif %}>Wiki</option>
                                    </select>
                                </div>
                                <div class="col-xs-2 datetime-field">
                                    <label for="published-on">Published Date</label>
                                    <input class="form-control" id="published-on" name="published_on" value="{{ content.human_published_on() }}" />
                                </div>
                                <div class="col-xs-2" style="padding-top: 10px;">
                                    <div class="checkbox">
                                        <label for="published">Published</label>
                                        <input id="published" type="checkbox" value="1"{% if content.published %} checked="checked"{% endif %} />
                                    </div>
                                    <div class="checkbox">
                                        <label for="menu-item">Menu Item</label>
                                        <input id="menu-item" type="checkbox" value="1"{% if content.menu_item %} checked="checked"{% endif %} />
                                    </div>
                                </div>
                                <div class="col-xs-2{% if content.type == 'post' %} hidden{% endif %}">
                                    <label for="content-parser">Theme</label>
                                    <select class="form-control" id="theme" name="theme">
                                        {% for theme in themes %}
                                        <option value="{{ theme }}"{% if content.theme == theme %} selected{% endif %}>{{ theme.capitalize() }}</option>
                                        {% endfor %}
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row">
                              <div class="col-xl-8" style="padding-right: 30px !important;">
                                <label for="body" style="margin-left: 15px;">Body</label>
                                <div id="body" style="border-radius: 5px; width: 100%; height: 100%; min-height: 500px; margin-left: 15px;">{{ content.body }}</div>
                              </div>
                            </div>

                            <div class="form-group row">
                                <div class="col-xs-3">
                                  <button id="save" class="btn btn-success">Save</button>
                                  <button id="preview" class="btn btn-primary">Preview</button>
                                  <button id="help" class="btn btn-default">Help</button>
                                </div>
                                <div class="col-xl-4">
                                  <div id="tags-div" class="form-group{% if content.type == 'page' %} hidden{% endif %} pull-right">
                                      <input class="form-control tags" id="tags" name="tags" value="{{ content.tags }}" placeholder="Add tags" type="text" />
                                  </div>
                                </div>
                            </div>

                        </form>
                    </div>
                    <!-- /.col-lg-12 -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /#edit-window-->
            <div id="preview-div" style="display: none;">
                <button class="btn btn-danger btn-small" id="close-preview" style="float: right; margin-top: 5px;">&times;</button>
                <iframe id="preview-iframe" src="about:blank" style="border: 0px; clear: both; margin-top: 10px;"></iframe>
            </div>
        </div>
        <!-- /#page-wrapper -->
    </div>
    <!-- /#wrapper -->
{% endblock content %}

{% block javascript %}
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/ace.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/mode-textile.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/theme-monokai.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/mode-text.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/mode-markdown.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/mode-html.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/ext-spellcheck.js"></script>
<script src="{{ theme_static('js/content.js') }}"></script>
{% endblock javascript %}