{#

This file is part of the Sonata package.

(c) Thomas Rabaix <thomas.rabaix@sonata-project.org>

For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.

#}

{% import _self as macros %}

{% macro bytesToSize(bytes) %}
{% spaceless %}
    {% set kilobyte = 1024 %}
    {% set megabyte = kilobyte * 1024 %}

    {% if bytes < kilobyte %}
        {{ bytes ~ ' B' }}
    {% elseif bytes < megabyte %}
        {{ (bytes / kilobyte)|number_format(2) ~ ' KB' }}
    {% else %}
        {{ (bytes / megabyte)|number_format(2) ~ ' MB' }}
    {% endif %}
{% endspaceless %}
{% endmacro %}

{% extends '@SonataAdmin/CRUD/base_edit.html.twig' %}

{% block stylesheets %}
    {{ parent() }}
    <style>
        button.btn.btn-sm.btn-default.pixlr-link {
            margin-bottom: 0;
        }
    </style>
{% endblock %}

{% block form %}
    <div class="row">
        {% if object.id %}
            <div class="col-md-6">
                {% block sonata_media_show_reference %}
                    <div class="box box-primary">
                        <div class="box-header">
                            <h3 class="box-title">{{ 'title.media_preview'|trans({}, 'SonataMediaBundle') }}</h3>
                            {% if sonata_media.pixlr and sonata_media.pixlr.isEditable(object) %}
                                <div class="box-tools pull-right">
                                    <button class="btn btn-sm btn-default pixlr-link"
                                            data-href="{{ path('sonata_media_pixlr_open_editor', { 'id': object|sonata_urlsafeid }) }}"
                                            data-toggle="modal"
                                            data-target="#pixlr-modal"
                                            >
                                        <i class="fa fa-pencil-square-o"></i> {{ "label.edit_with_pixlr"|trans({}, "SonataMediaBundle") }}
                                    </button>
                                </div>
                            {% endif %}

                        </div>
                        <div class="box-body table-responsive">

                            <div class="text-center">
                                {% media object, 'reference' with {'class': 'img-responsive img-rounded'} %}
                            </div>

                            <table class="table">
                                <tr>
                                    <th>{{ 'label.size'|trans({}, 'SonataMediaBundle') }}</th>
                                    <td>
                                        {{ object.width }} x {{ object.height }}
                                        {% if object.size > 0 %}({{ macros.bytesToSize(object.size) }}){% endif %}
                                    </td>
                                </tr>
                                <tr>
                                    <th>{{ 'label.content_type'|trans({}, 'SonataMediaBundle') }}</th>
                                    <td>{{ object.contenttype }}</td>
                                </tr>
                                <tr>
                                    <th>{{ 'label.cdn'|trans({}, 'SonataMediaBundle') }}</th>
                                    <td>
                                        {% if object.cdnisflushable %}
                                            {{ 'label.to_be_flushed'|trans({}, 'SonataMediaBundle') }}
                                        {% else %}
                                            {{ 'label.flushed_at'|trans({}, 'SonataMediaBundle') }}
                                            {{ object.cdnflushat|date }}
                                        {% endif %}
                                    </td>
                                </tr>
                                <tr>
                                    <th><a href="{{ path('sonata_media_download', {'id': object|sonata_urlsafeid }) }}">{{ 'label.protected_download_url'|trans({}, 'SonataMediaBundle') }}</a></th>
                                    <td>
                                        <input type="text" class="form-control" onClick="this.select();" readonly="readonly" value="{{ path('sonata_media_download', {'id': object|sonata_urlsafeid }) }}" />
                                        <span class="label label-warning">{{ 'label.protected_download_url_notice'|trans({}, 'SonataMediaBundle') }}</span> {{ sonata_media.pool.downloadStrategy(object).description|raw }}
                                    </td>
                                </tr>
                                <tr>
                                    <th>
                                        <a href="{% path object, 'reference' %}" target="_blank">reference</a>
                                    </th>
                                    <td>
                                        <input type="text" class="form-control" onClick="this.select();" readonly="readonly" value="{% path object, 'reference' %}" />
                                    </td>
                                </tr>

                                {% for name, format in sonata_media.pool.formatNamesByContext(object.context) %}
                                    <tr>
                                        <th>
                                            <a href="{% path object, name %}" target="_blank">{{ name }}</a>
                                        </th>
                                        <td>
                                            <input type="text" class="form-control" onClick="this.select();" readonly="readonly" value="{% path object, name %}" />
                                        </td>
                                    </tr>
                                {% endfor %}
                            </table>
                        </div>

                    </div>
                {% endblock sonata_media_show_reference %}
            </div>
        {% endif %}

        <div class="col-md-6">
            {# Renders the form #}
            {{ parent() }}
        </div>
    </div>

    {% if sonata_media.pixlr and sonata_media.pixlr.isEditable(object) %}
        <div class="modal fade" id="pixlr-modal" tabindex="-1" role="dialog" aria-labelledby="{{ "label.edit_with_pixlr"|trans({}, "SonataMediaBundle")}}" aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">{{ "label.edit_with_pixlr"|trans({}, "SonataMediaBundle")}}</h4>
                    </div>
                    <div class="modal-body" id="pixlr-modal-body">
                    </div>
                </div>
            </div>
        </div>

        <script type="text/javascript">
            window.closeModal = function() {
                jQuery('#pixlr-modal').modal('hide');
            }

            jQuery('button.pixlr-link').on('click', function(e) {
                e.preventDefault();
                var url = jQuery(this).attr('data-href');
                jQuery("#pixlr-modal-body").html('<iframe width="100%" height="100%" frameborder="0" scrolling="no" allowtransparency="true" src="'+url+'"></iframe>');
            });

            Admin.setup_list_modal(jQuery('#pixlr-modal'));
        </script>
    {% endif %}
{% endblock form %}