<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/bundles/pimcoreadmin/css/admin.css"/>

    <style type="text/css">

        /* hide from ie on mac \*/
        html {
            height: 100%;
            overflow: hidden;
        }

        #wrapper {
            height: 100%;
        }

        /* end hide */

        body {
            height: 100%;
            margin: 0;
            padding: 0;
        }

    </style>

</head>

<body>

<table id="wrapper" width="100%" height="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td class="error" align="center" valign="center">
            {% if thumbnail is defined and thumbnail["status"] == "inprogress" %}
                <style type="text/css">
                    .pimcore_editable_video_progress {
                        position:relative;
                        background:#555 url("{{ asset.getImageThumbnail({"width": 640}) }}") no-repeat center center;
                        font-family:Arial,Verdana,sans-serif;
                        color:#fff;
                        text-shadow: 0 0 3px #000, 0 0 5px #000, 0 0 1px #000;
                    }
                    .pimcore_editable_video_progress_status {
                        font-size:16px;
                        color:#555;
                        font-family:Arial,Verdana,sans-serif;
                        line-height:66px;
                        background:#fff url(/bundles/pimcoreadmin/img/video-loading.gif) center center no-repeat;
                        width:66px;
                        height:66px;
                        padding:20px;
                        border:1px solid #555;
                        text-align:center;
                        box-shadow: 2px 2px 5px #333;
                        border-radius:20px;
                        top: 137px;
                        left: 267px;
                        position:absolute;
                        opacity: 0.8;
                        text-shadow: none;
                    }
                </style>
                <div class="pimcore_editable_video_progress" style="width:640px; height:380px;">

                    <br />
                    {{ 'video_preview_in_progress'|trans([],'admin') }}
                    <br />
                    {{ 'please_wait'|trans([],'admin') }}

                    <div class="pimcore_editable_video_progress_status"></div>
                </div>


                <script {{ pimcore_csp.getNonceHtmlAttribute()|raw }}>
                    window.setTimeout(function () {
                        location.reload();
                    }, 5000);
                </script>
            {% elseif not pimcore_video_is_available() %}
                {{ 'preview_not_available'|trans([],'admin') }}
                <br />
                {{ 'php_cli_binary_and_or_ffmpeg_binary_setting_is_missing'|trans([],'admin') }}
            {% else %}
                {{ 'preview_not_available'|trans([],'admin') }}
                <br />
                Error unknown, please check the log files
            {% endif %}
        </td>
    </tr>
</table>


</body>
</html>
