{% extends "admin/file_manager/file-manager-base.html" %}

{% load url from future %}
{% load thumbnail %}

{% block breadcrumbs %}
    <li class="active">Images</li>
{% endblock %}

{% block buttons %}
    {% if input_name %}
        <div class="pull-left">
            <a href="{% url 'admin_image_new_folder' input_name %}?{{ request.META.QUERY_STRING }}" class="btn btn-default new"><i class="glyphicon glyphicon-plus"></i> New Folder</a>
            <a href="{% url 'admin_image_upload_file' input_name %}?{{ request.META.QUERY_STRING }}" class="btn btn-default upload"><i class="glyphicon glyphicon-arrow-up"></i> Upload Image</a>
        </div>
        <div class="pull-right">
            <a href="javascript:window.close()" class="btn btn-default close_button"><i class="glyphicon glyphicon-remove"></i>Close</a>
        </div>
        <div class="clearfix"></div>
    {% else %}
        <div class="pull-left">
            <a href="{% url 'admin_cke_image_new_folder' %}?{{ request.META.QUERY_STRING }}" class="btn btn-default new"><i class="glyphicon glyphicon-plus"></i> New Folder</a>
            <a href="{% url 'admin_cke_image_upload_file' %}?{{ request.META.QUERY_STRING }}" class="btn btn-default upload"><i class="glyphicon glyphicon-arrow-up"></i> Upload Image</a>
        </div>
        <div class="pull-right">
            <a href="javascript:window.close()" class="btn btn-default close_button"><i class="glyphicon glyphicon-remove"></i> Close</a>
        </div>
        <div class="clearfix"></div>
    {% endif %}
{% endblock %}

{% block content %}
    {% if folders or images %}
        <form name="pageform" id="pageform" action="">
            <div class="items">
                {% for folder in folders %}
                    <div class="item folder">
                        {% if input_name %}
                            <div class="thumb"><a href="{% url 'admin_image_folder' input_name folder.id %}"><i class="glyphicon glyphicon-folder-open"></i></a></div>
                            <div class="details">
                                <div class="name"><a href="{% url 'admin_image_folder' input_name folder.id %}">{{ folder.name }}</div>
                                <div class="delete"><a href="{% url 'admin_image_edit_folder' input_name folder.id %}" title="Edit"><i class="glyphicon glyphicon-pencil"></i></a> <a href="{% url 'admin_image_delete_folder' input_name folder.id %}" title="Delete" onclick="return confirm('Are you sure you want to delete this folder?');"><i class="glyphicon glyphicon-trash"></i></a></div>
                            </div>
                        {% else %}
                            <div class="thumb"><a href="{% url 'admin_cke_image_folder' folder.id %}?{{ request.META.QUERY_STRING }}"><i class="glyphicon glyphicon-folder-open"></i></a></div>
                            <div class="details">
                                <div class="name"><a href="{% url 'admin_cke_image_folder' folder.id %}?{{ request.META.QUERY_STRING }}">{{ folder.name }}</div>
                                <div class="delete"><a href="{% url 'admin_cke_image_edit_folder' folder.id %}?{{ request.META.QUERY_STRING }}" title="Edit"><i class="glyphicon glyphicon-pencil"></i></a> <a href="{% url 'admin_cke_image_delete_folder' folder.id %}?{{ request.META.QUERY_STRING }}" title="Delete" onclick="return confirm('Are you sure you want to delete this folder?');"><i class="glyphicon glyphicon-trash"></i></a></div>
                            </div>
                        {% endif %}
                    </div>
                {% endfor %}
                {% for image in images %}
                    <div class="item image">
                        {% if input_name %}
                            <div class="thumb"><a href="javascript:setImage('{{ input_name }}','{{ image.id }}','{{ image.name }}');"><img src="{% thumbnail image.image '80x80' crop %}" alt="{{ image }}"/></a></div>
                            <div class="details">
                                <div class="name"><a href="javascript:setImage('{{ input_name }}','{{ image.id }}','{{ image.name }}');">{{ image }}</a></div>
                                <div class="delete"><a href="{% url 'admin_image_edit_file' input_name image.id %}" title="Edit"><i class="glyphicon glyphicon-pencil"></i></a> <a href="{% url 'admin_image_delete_file' input_name image.id %}" title="Delete" onclick="return confirm('Are you sure you want to delete this Image?');"><i class="glyphicon glyphicon-trash"></i></a></div>
                            </div>
                        {% else %}
                            <div class="thumb"><a href="javascript:setImageCKE('{{ image.image.url }}');"><img src="{% thumbnail image.image '80x80' crop %}" alt="{{ image }}"/></a></div>
                            <div class="details">
                                <div class="name"><a href="javascript:setImageCKE('https://{{ request.META.HTTP_HOST }}{{ image.image.url }}');">{{ image }}</a></div>
                                <div class="delete"><a href="{% url 'admin_cke_image_edit_file' image.id %}?{{ request.META.QUERY_STRING }}" title="Edit"><i class="glyphicon glyphicon-pencil"></i></a> <a href="{% url 'admin_cke_image_delete_file' image.id %}?{{ request.META.QUERY_STRING }}" title="Delete" onclick="return confirm('Are you sure you want to delete this Image?');"><i class="glyphicon glyphicon-trash"></i></a></div>
                            </div>
                        {% endif %}
                    </div>
                {% endfor %}
            </div>
        </form>
    {% endif %}
{% endblock %}