<!DOCTYPE html>
<html lang="es">
    <head>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <title>{$titulo} | {$videoTitle}</title>
        <link rel="icon" href="templates/images/favicon.png" sizes="192x192" />
        <!--Plyr-->
        <link href="{$styles.plyr}" rel="stylesheet"/>
        <style>
         body {
             margin: 0rem;
             padding: 0rem;
         }
        </style>
        <script>
         /*
            @licstart  The following is the entire license notice for the
            JavaScript code in this page.

            Copyright (C) {$smarty.now|date_format:"%Y"} Jesús E. | <heckyel@hyperbola.info>

            The JavaScript code in this page is free software: you can
            redistribute it and/or modify it under the terms of the GNU
            General Public License (GNU GPL) as published by the Free Software
            Foundation, either version 3 of the License, or (at your option)
            any later version.  The code is distributed WITHOUT ANY WARRANTY;
            without even the implied warranty of MERCHANTABILITY or FITNESS
            FOR A PARTICULAR PURPOSE.  See the GNU GPL for more details.

            As additional permission under GNU GPL version 3 section 7, you
            may distribute non-source (e.g., minimized or compacted) forms of
            that code without the copy of the GNU GPL normally required by
            section 4, provided you include this license notice and a URL
            through which recipients can access the Corresponding Source.


            @licend  The above is the entire license notice
            for the JavaScript code in this page.
          */
        </script>
    </head>
    <body>
        {if $islive == false }
            <video id="player"
                   poster="{$videoThumbURL}"
                   controls
                   playsinline
                   onmouseleave='{$videoTitle}'
                   oncontextmenu='{$videoTitle}'
                   onmouseenter='{$videoTitle}'
                   title='{$videoTitle}'>
                {foreach $streamFormats as $stream}
                    <source data-res="{trim($stream['resolution'], 'p')}" src="{$stream['url']}" type='{$stream['type']}'/>
                {/foreach}
                <p>Lo siento, este navegador no soporta vídeo en HTML5. Por favor, cambia o actualiza tu navegador web</p>
            </video>
            <!--Plyr-->
            <script>
             // @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later
             document.addEventListener('DOMContentLoaded', () => {
                 const player = new Plyr(document.getElementById('player'), {
                     disableContextMenu: false,
                     controls: [
                         'play-large',
                         'play',
                         'progress',
                         'current-time',
                         'mute',
                         'volume',
                         'captions',
                         'settings',
                         'download',
                         'fullscreen'
                     ]
                 });
             });
             // @license-end
            </script>
            <!--EndPlyr-->
        {else}
            <p>I sorry not live support for now.</p>
        {/if}
        <script src="{$javascript.plyr}" integrity="sha512-YjLaaKupD6GUZwnkLn8LbzL73ZhgY01zYCaeCscD/+khdOtmPfz02tw/cb9kYySUSPlpQoBT8HGY/ggiKAjA7A=="></script>
    </body>
</html>
