{% extends "admin/base_site.html" %}

<!-- LOADING -->
{% load static i18n fb_tags fb_pagination %}

<!-- STYLESHEETS -->
{% block stylesheets %}
    {{ block.super }}
    <link rel="stylesheet" type="text/css" href="{% static "filebrowser/css/filebrowser.css" %}" />
{% endblock %}

<!-- JAVASCRIPTS -->
{% block javascripts %}
    {{ block.super }}
    {% if query.pop == '1' %} <!-- FileBrowseField -->
    <script language="javascript" type="text/javascript" src="{% static "filebrowser/js/FB_FileBrowseField.js" %}"></script>
    {% endif %}
    {% if query.pop == '2' %} <!-- TinyMCE -->
    <script language="javascript" type="text/javascript" src="{% static "grappelli/tinymce/jscripts/tiny_mce/tiny_mce_popup.js" %}"></script>
    <script language="javascript" type="text/javascript" src="{% static "filebrowser/js/FB_TinyMCE.js" %}"></script>
    {% if query.mce_rdomain %}<script language="javascript">document.domain = "{{ query.mce_rdomain }}"</script>{% endif %}
    {% endif %}
    {% if query.pop == '3' %} <!-- CKeditor (former "FCKeditor") -->
    <script language="javascript" type="text/javascript" src="{% static "filebrowser/js/FB_CKEditor.js" %}"></script>
    {% endif %}
    {% if query.pop == '4' %} <!-- TinyMCE v4 -->
    <script language="javascript" type="text/javascript" src="{% static "filebrowser/js/FB_TinyMCEv4.js" %}"></script>
    {% endif %}
    {% if query.pop == '5' %} <!-- TinyMCE v5 -->
    <script language="javascript" type="text/javascript" src="{% static "filebrowser/js/FB_TinyMCEv5.js" %}"></script>
    {% endif %}

    {{ media }}
    <script type="text/javascript" charset="utf-8">
        (function($) {
            $(document).ready(function() {
                grappelli.initSearchbar();
                grappelli.initFilter();
            });
        })(grp.jQuery);
    </script>
    <script type="text/javascript" charset="utf-8">
        (function($) {
            $(document).ready(function() {
                $("a.grp-pulldown-versions-handler").bind("click", function() {
                    if (!$(this).parent().hasClass("grp-open")) {
                        $("tr").removeClass("grp-selected");
                        $(".grp-pulldown-versions-container").removeClass("grp-open");
                        $(this).parent().addClass("grp-open");
                        $(this).parent().parent().parent().addClass("grp-selected");
                    } else {
                        $(this).parent().removeClass("grp-open");
                        $(this).parent().parent().parent().removeClass("grp-selected");
                    }
                });
                $(document).keypress(function(evt) {
                    if (evt.keyCode == '27') {
                        $(".grp-pulldown-versions-container:visible").removeClass("grp-open");
                        $(".grp-pulldown-versions-container").parent().parent().removeClass("grp-selected");
                    }
                });
                $(document).mousedown(function(evt) {
                    if ($(".grp-pulldown-versions-container").is(":visible")) {
                        var $target = $(evt.target);
                        if (!$(evt.target).hasClass("pulldown-versions-container") && $target.parents(".grp-pulldown-versions-container").length == 0) {
                            $(".grp-pulldown-versions-container").removeClass("grp-open");
                            $(".grp-pulldown-versions-container").parent().parent().removeClass("grp-selected");
                        }
                    }
                });
            });
        })(grp.jQuery);
    </script>
{% endblock %}

<!-- COLTYPE/BODYCLASS -->
{% block bodyclass %}grp-change-list grp-filebrowser{% if query.pop %} grp-popup{% endif %}{% endblock %}
{% block content-class %}{% endblock %}

<!-- BREADCRUMBS -->
{% block breadcrumbs %}{% include "filebrowser/include/breadcrumbs.html" %}{% endblock %}

<!-- OBJECT-TOOLS -->
{% block object-tools %}
    <ul class="grp-object-tools">
        <li><a href="{% url 'filebrowser:fb_createdir' %}{% query_string '' 'p' %}">{% trans "New Folder" %}</a></li>
        <li><a href="{% url 'filebrowser:fb_upload' %}{% query_string '' 'p' %}" class="grp-state-focus">{% trans "Upload" %}</a></li>
    </ul>
{% endblock %}

<!-- CONTENT -->
{% block content %}
    <div class="grp-module grp-changelist-filters">
        <div class="grp-row">
            <div class="l-2cr-fluid l-d-12">
                <!-- SEARCH -->
                <aside class="c-1">
                    <header style="display:none"><h1>Search</h1></header>
                    <div id="search" class="g-d-6">
                        <form id="grp-changelist-search" action="." method="get">
                            <input type="text" size="40" name="q" value="{{ query.q }}" id="grp-changelist-search" class="grp-search-field grp-form-field-contained" />
                            {% if query.filter_type %}<input type="hidden" name="filter_type" value="{{ query.filter_type }}" />{% endif %}
                            {% if query.filter_date %}<input type="hidden" name="filter_date" value="{{ query.filter_date }}" />{% endif %}
                            {% if query.o %}<input type="hidden" name="o" value="{{ query.o }}" />{% endif %}
                            {% if query.ot %}<input type="hidden" name="ot" value="{{ query.ot }}" />{% endif %}
                            {% if query.pop %}<input type="hidden" name="pop" value="{{ query.pop }}" />{% endif %}
                            {% if query.type %}<input type="hidden" name="type" value="{{ query.type }}" />{% endif %}
                            {% if query.format %}<input type="hidden" name="format" value="{{ query.format }}" />{% endif %}
                            {% if query.dir %}<input type="hidden" name="dir" value="{{ query.dir|urlencode }}" />{% endif %}
                            {% if query.pop == '3' %} {# Custom CKEditor fields #}
                                {% if query.CKEditor %}<input type="hidden" name="CKEditor" value="{{ query.CKEditor }}" />{% endif %}
                                {% if query.CKEditorFuncNum %}<input type="hidden" name="CKEditorFuncNum" value="{{ query.CKEditorFuncNum }}" />{% endif %}
                            {% endif %}
                            <button class="grp-search-button" type="submit" value="">&nbsp;</button>
                        </form>
                    </div>
                    <!-- FILTERS -->
                    {% include "filebrowser/include/filter.html" %}
                </aside>
                <div class="c-2">
                    <!-- PAGINATION -->
                    {% pagination %}
                </div>
            </div>
        </div>
    </div>
    <section id="grp-changelist">
        <header style="display:none"><h1>Results</h1></header>
        <!-- RESULTS -->
        {% if filelisting.results_current %}
            <div class="grp-module grp-changelist-results">
                <table cellspacing="0" class="grp-table">
                    {% include "filebrowser/include/tableheader.html" %}
                    <tbody>
                    {% include "filebrowser/include/filelisting.html" %}
                    </tbody>
                </table>
            </div>
        {% endif %}
    </section>
    {% if not filelisting.results_current == 0 %}
        <div class="grp-module">
            <div class="grp-row">{% pagination %}</div>
        </div>
    {% endif %}
{% endblock %}
