video.tpl 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4. <meta charset="UTF-8"/>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  6. <title>{$titulo} | {$videoTitle}</title>
  7. <link rel="icon" href="templates/images/favicon.png" sizes="192x192" />
  8. <link href="{$styles.normalize}" rel="stylesheet"/>
  9. <link href="{$styles.salida}" rel="stylesheet"/>
  10. <!--Plyr-->
  11. <script>
  12. /*
  13. @licstart The following is the entire license notice for the
  14. JavaScript code in this page.
  15. Copyright (C) {$smarty.now|date_format:"%Y"} Jesús E. | <heckyel@hyperbola.info>
  16. The JavaScript code in this page is free software: you can
  17. redistribute it and/or modify it under the terms of the GNU
  18. General Public License (GNU GPL) as published by the Free Software
  19. Foundation, either version 3 of the License, or (at your option)
  20. any later version. The code is distributed WITHOUT ANY WARRANTY;
  21. without even the implied warranty of MERCHANTABILITY or FITNESS
  22. FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
  23. As additional permission under GNU GPL version 3 section 7, you
  24. may distribute non-source (e.g., minimized or compacted) forms of
  25. that code without the copy of the GNU GPL normally required by
  26. section 4, provided you include this license notice and a URL
  27. through which recipients can access the Corresponding Source.
  28. @licend The above is the entire license notice
  29. for the JavaScript code in this page.
  30. */
  31. </script>
  32. <link href="{$styles.plyr}" rel="stylesheet"/>
  33. <style>
  34. code, kbd, samp {
  35. font-family: monospace, monospace;
  36. font-size: 0.8em;
  37. background: black;
  38. text-align: center;
  39. padding: 1em;
  40. border: solid 1px #00b7f1;
  41. margin-bottom: 1em;
  42. }
  43. </style>
  44. </head>
  45. <body>
  46. <div class="contenedor">
  47. <header>
  48. <a class="drm-free" rel="noopener noreferrer" href="https://www.defectivebydesign.org/drm-free" target="_blank"></a>
  49. <h2>{$videoTitle}</h2>
  50. </header>
  51. <form class="form-search" id="site-search">
  52. <input type="search" name="link" class="search-box" value="" placeholder="Enlace de Youtube">
  53. <button type="submit" value="Search" class="search-button">Query</button>
  54. </form>
  55. <hr>
  56. <section class="libreyt">
  57. <div class="contenedor">
  58. <div class="row">
  59. <div class="imageyt">
  60. <img alt='{$videoTitle}' src="{$videoThumbURL}"/>
  61. </div>
  62. <div class="features">
  63. <h6 class="yt-titulo">Canal</h6>
  64. <h6>{$videoAuthor}</h6>
  65. <h6 class="yt-titulo">Duración</h6>
  66. <h6>{$videoDuration}</h6>
  67. <h6 class="yt-titulo">Vistas</h6>
  68. <h6>{$videoViews}</h6>
  69. </div>
  70. </div>
  71. </div>
  72. <hr>
  73. <div class="contenedor">
  74. {if $islive == false }
  75. <div class="librevideojs">
  76. <video id="player"
  77. poster="{$videoThumbURL}"
  78. controls
  79. playsinline
  80. onmouseleave='{$videoTitle}'
  81. oncontextmenu='{$videoTitle}'
  82. onmouseenter='{$videoTitle}'
  83. title='{$videoTitle}'>
  84. {foreach $streamFormats as $stream}
  85. <source data-res="{trim($stream['resolution'], 'p')}" src="{$stream['url']}" type='{$stream['type']}'/>
  86. {/foreach}
  87. </video>
  88. </div>
  89. <!--Plyr-->
  90. <script>
  91. document.addEventListener('DOMContentLoaded', () => {
  92. const player = new Plyr(document.getElementById('player'), {
  93. disableContextMenu: false,
  94. quality: { default: 360 },
  95. controls: [
  96. 'play-large',
  97. 'play',
  98. 'progress',
  99. 'current-time',
  100. 'mute',
  101. 'volume',
  102. 'captions',
  103. 'settings',
  104. 'download',
  105. 'fullscreen'
  106. ]
  107. });
  108. });
  109. </script>
  110. <!--EndPlyr-->
  111. <details class="v-download">
  112. <summary class="download-dropdown-label">Download</summary>
  113. <ul class="download-dropdown-content">
  114. {foreach $streamFormats as $download}
  115. <li class="download-format">
  116. <a class="boton-descarga" href="{$download['url']}">
  117. {$download['format']}
  118. </a>
  119. </li>
  120. {/foreach}
  121. {if $streamExtra == TRUE}
  122. {foreach $streamFormatsExtra as $download}
  123. <li class="download-format">
  124. <a class="boton-descarga" href="{$download['url']}">
  125. {$download['format']}
  126. </a>
  127. </li>
  128. {/foreach}
  129. {/if}
  130. </ul>
  131. </details>
  132. {else}
  133. <p>I sorry not live support for now.</p>
  134. {/if}
  135. </div>
  136. </section>
  137. <code>{$url_query}</code>
  138. <code>
  139. &lt;iframe width='560' height='315' src='{$local_url}embed?link={$url_query}' frameborder='0' scrolling='no'&gt;&lt;/iframe&gt;
  140. </code>
  141. <footer>
  142. <p class="copyleft">Esta web es Software Libre y esta disponible en <a class="enlace"
  143. rel="noopener noreferrer"
  144. href="{$source_code}"
  145. target="_blank">LibreGit</a> bajo la Licencia
  146. <a class="enlace" rel="license noopener noreferrer" href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank">
  147. <abbr title="GNU Affero General Public License version 3">GNU AGPLv3+</abbr>
  148. </a>
  149. </p>
  150. <p class="copyleft">
  151. <a class="enlace" href="templates/librejs.html" data-jslicense="1"
  152. rel="license noopener noreferrer" target="_blank">Información de licencias de JavaScript.</a>
  153. </p>
  154. <p class="copyleft">Versión <a href="{$source_code}/src/tag/{$version}"
  155. class="enlace"
  156. rel="noopener noreferrer"
  157. target="_blank">{$version}</a></p>
  158. </footer>
  159. </div>
  160. <script src="{$javascript.plyr}" integrity="sha512-VAzAm4qxuDivjRHdF9ykJb9aEntumzPAheFTg3fs9FGmVyI4Gx9GsRBy2ydWOAIXLVfCG1ZwvKjnVMe7zZLOKw=="></script>
  161. </body>
  162. </html>