{% from "_pagination.html" import render_pagination %}

{% macro slides_grid(slides, controller) %}

{{ render_pagination(slides, controller, view=slide_view, **kwargs) }}

<h4>Slides</h4>
<p>
    {% if slide_view == 'grid' %}
        <a class="btn btn-warning disabled" href="#" id="grid-view-link">
            <span class="icon-white icon-th"></span> Grid View
        </a>
        <a class="btn btn-warning" href="#" id="list-view-link">
            <span class="icon-white icon-th-list"></span> List View
        </a>
    {% else %}
        <a class="btn btn-warning" href="#" id="grid-view-link">
            <span class="icon-white icon-th"></span> Grid View
        </a>
        <a class="btn btn-warning disabled" href="#" id="list-view-link">
            <span class="icon-white icon-th-list"></span> List View
        </a>
    {% endif %}
</p>
{% if slide_view == 'grid' %}
    {% for slide in slides.items %}
        <div class="slide-grid-cell">
            <h4><a href="{{ url_for('show_slide', slide_id=slide.id) }}"><span>{{ slide.slide_name }}</span></a></h4>
            <p>
                {% if slide.is_available() %}
                    {% if slide.renditions.original %}
                    <a href="{{ url_for_storage(slide.renditions['original']) }}" class="btn btn-info">
                        <span class="icon-download icon-white"></span> Download
                    </a>
                    {% endif %}
                    {% if slide.renditions.viewer_dzi %}
                    <a href="{{ url_for('view_slide', slide_id=slide.id) }}" class="btn btn-info">
                        <span class="icon-search icon-white"></span> View
                    </a>
                    {% endif %}
                    {% if slide.share_code %}
                        <a href="#" data-revoke-url="{{ url_for('revoke_slide', slide_id=slide.id) }}" class="btn btn-danger slide-revoke-btn">
                            <span class="icon-remove icon-white"></span> Unshare
                        </a>
                        <a class="share-url-link" data-slide-id="{{slide.id}}" href="{{ url_for('view_slide', slide_id=slide.id, code=slide.share_code) }}">
                            Copy Sharing URL
                        </a>
                    {% else %}
                        <a href="#" data-share-url="{{ url_for('share_slide', slide_id=slide.id) }}" data-slide-expire="{{slide.expires.strftime("%Y-%m-%d %H:%M")}}" class="btn btn-info slide-share-btn">
                            <span class="icon-share icon-white"></span> Share
                        </a>
                    {% endif %}
                {% endif %}
                {% if slide.is_archived() %}
                    <a href="#" data-slide-id="{{slide.id}}" data-multiplier="{{slide_restore_form.get_mult(slide.order.owner.id)}}" data-slide-name="{{slide.slide_name}}" class="btn btn-info slide-restore-btn">
                        <span class="icon-bookmark icon-white"></span> Restore
                    </a>
                {% endif %}
                {% if slide.is_restoring() %}
                    <em class="small"><span class="icon-bookmark"></span> Restoration in progress.</em>
                {% endif %}
            </p>
            {% if slide.renditions.macro_small %}
            <p class="slide-macro-container">
                <a href="{{ url_for('show_slide', slide_id=slide.id) }}">
                    <img src="{{ url_for_storage(slide.renditions['macro_small']) }}"/>
                </a>
            </p>
            {% endif %}
        </div>
    {% endfor %}
{% else %}
    <table class="table table-striped table-condensed slide-table">
        <tbody>
        {% for slide in slides.items  %}
            <tr>
                <td>
                    {% if slide.renditions.macro_small %}
                        <a class="wrapword slide-name" href="{{ url_for('show_slide', slide_id=slide.id) }}">{{ slide.slide_name }}</a>
                    {% else %}
                        <a class="wrapword" href="{{ url_for('show_slide', slide_id=slide.id) }}">{{ slide.slide_name }}</a>
                    {% endif %}
                </td>
                <td>
                    {% if slide.renditions['macro_small'] %}
                        <a href="#" data-preview-text="{{slide.slide_name}}" data-preview-url="{{ url_for_storage(slide.renditions['macro_small']) }}" class="btn btn-primary slide-preview-btn">
                            <span class="icon-share icon-white"></span> Preview
                        </a>
                    {% endif %}
                    {% if slide.is_available() %}
                        {% if slide.renditions.original %}
                            <a href="{{ url_for_storage(slide.renditions['original']) }}" class="btn btn-info">
                                <span class="icon-download icon-white"></span> Download
                            </a>
                        {% endif %}
                        {% if slide.renditions.viewer_dzi %}
                            <a href="{{ url_for('view_slide', slide_id=slide.id) }}" class="btn btn-info">
                                <span class="icon-search icon-white"></span> View
                            </a>
                        {% endif %}
                        {% if slide.is_viewable() %}
                            {% if slide.share_code %}
                                <a href="#" data-revoke-url="{{ url_for('revoke_slide', slide_id=slide.id) }}" class="btn btn-danger slide-revoke-btn">
                                    <span class="icon-remove icon-white"></span> Revoke Sharing
                                </a>
                                <a class="share-url-link" data-slide-id="{{slide.id}}" href="{{ url_for('view_slide', slide_id=slide.id, code=slide.share_code) }}">
                                    <span class="icon-share bump-right"></span> Copy Sharing URL
                                </a>
                            {% else %}
                                <a href="#" data-share-url="{{ url_for('share_slide', slide_id=slide.id) }}" data-slide-expire="{{slide.expires.strftime("%Y-%m-%d %H:%M")}}" class="btn btn-primary slide-share-btn">
                                    <span class="icon-share icon-white"></span> Share
                                </a>
                            {% endif %}
                        {% endif %}
                    {% elif slide.is_archived() %}
                        <a href="#" data-slide-id="{{slide.id}}" data-multiplier="{{slide_restore_form.get_mult(slide.order.owner.id)}}" data-slide-name="{{slide.slide_name}}" class="btn btn-info slide-restore-btn">
                            <span class="icon-bookmark icon-white"></span> Restore
                        </a>
                    {% elif slide.is_restoring() %}
                        <em><span class="icon-bookmark bump-right"></span> Restoration in progress.</em>
                    {% endif %}
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    <div id="slide-preview-container">
        <p id="slide-preview-text"></p>
        <img id="slide-preview-img" src="" />
    </div>

    <script>
        $(document).ready(function(){
            $("#slide-preview-container").dialog({
                autoOpen: false,
                width: "150px",
                height: "auto"
            });
            
            $(document).on('click', '.slide-preview-btn', function(e){
                e.preventDefault();
                $("#slide-preview-text").html($(this).attr("data-preview-text"));
                // In
                var img_url = $(this).attr("data-preview-url");
                if (img_url.length > 0) {
                    $("#slide-preview-img").attr("src", img_url);
                    $("#slide-preview-img").load(function(){
                        $("#slide-preview-container").dialog("open");
                    });
                }
            });
        });
    </script>

{% endif %}
{% include 'slide_share.html' %}
<script>

    function toggle_slide_view(view) {
        {% if controller == 'get_order' %}
            var base_url = "{{ url_for('get_order', order_id=order.id) }}";
        {% else %}
            var base_url = "{{ url_for('list_slides') }}";
        {% endif %}
        var new_url = base_url+"?page={{slide_page}}&view="+view;
        document.location.href = new_url;
    }
    
    $(document).ready(function(){
        init_slide_share_warn_dialog();
        init_slide_share_copy_dialog();

        $(document).on('click', '#list-view-link', function(e){
            e.preventDefault();
            toggle_slide_view('list');
        });
        
        $(document).on('click', '#grid-view-link', function(e){
            e.preventDefault();
            toggle_slide_view('grid');
        });
    });    
</script>

{{ render_pagination(slides, controller, view=slide_view, **kwargs) }}

{% endmacro %}