<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

    <style type="text/css">

        html, body, #wrapper {
            height: 100%;
            margin: 0;
            padding: 0;
            border: none;
            text-align: center;
        }

        #wrapper {
            margin: 0 auto;
            text-align: left;
            vertical-align: middle;
            width: 400px;
        }


    </style>
    <link rel="stylesheet" type="text/css" href="/bundles/pimcoreadmin/css/object_versions.css"/>

</head>

<body>

{% set tempFile = asset.getTemporaryFile() %}
{% set dataUri = pimcore_image_version_preview(tempFile) %}

<table id="wrapper" cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td align="center">
            <img src="{{ dataUri }}"/>
              <table class="preview" border="0" cellpadding="0" cellspacing="0">
                    <tbody>
                        <tr class="odd">
                            <th>Name</th>
                            <th>Value</th>
                        </tr>
                        <tr>
                            <td>Name</td>
                            <td>{{ asset.getFileName() }}</td>
                        </tr>
                        <tr>
                            <td>Creation Date</td>
                            <td>{{ asset.getCreationDate()|date('m/d/Y H:i:s') }}</td>
                        </tr>
                        <tr>
                            <td>Modification Date</td>
                            <td>{{ asset.getModificationDate()|date('m/d/Y H:i:s') }}</td>
                        </tr>
                        <tr>
                            <td>File Size</td>
                            <td>{{ asset.getFileSize(true) }} </td>
                        </tr>
                        <tr>
                            <td>Mime Type</td>
                            <td>{{ asset.getMimeType() }}</td>
                        </tr>
                        <tr>
                            <td>Dimensions</td>
                            <td>
                                {% if asset.getDimensions() is iterable %}
                                    {{ asset.getDimensions()["width"] ~ ' X ' ~ asset.getDimensions()["height"] }}
                                {% endif %}
                            </td>
                        </tr>
                        {% if asset.getHasMetadata() %}
                            {% set metaData = asset.getMetadata() %}

                            {% if metaData is iterable and metaData|length > 0 %}
                                {% for data in metaData %}
                                    {% set preview = data["data"] %}
                                    {% set instance = loader.build(data['type']) %}
                                    {% set preview = instance.getVersionPreview(preview,data) %}

                                    <tr>
                                        <td>{{ data['name'] }} ({{ data['type'] }})</td>
                                        <td>{{ preview }}</td>
                                    </tr>
                                {% endfor %}
                            {% endif %}
                        {% endif %}
                    </tbody>
              </table>
        </td>
    </tr>
</table>

</body>
</html>
