video-player.html 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. {% if post.video-url %}
  2. <video id="video-player" width="640" height="360" class="video-js vjs-default-skin"
  3. controls poster="{{post.video-thumbnail-url}}" data-setyp='{"controls": "true", "loop": "false", "autoplay": "false", "preload": "false"}'>
  4. <source src="{{post.video-url}}" type="application/x-mpegURL">
  5. </source>
  6. <p class="vjs-no-js">The browser doesn't seem to support our video player... new browsers should.</p>
  7. </video>
  8. <script>
  9. var player = videojs('video-player');
  10. player.ready(function() {
  11. player.mediaSession();
  12. });
  13. //player.play();
  14. </script>
  15. {% else %}
  16. Twitch: {{post.video-twitch-channel}}
  17. {% if post.video-twitch-channel %}
  18. <!-- Add a placeholder for the Twitch embed -->
  19. <div id="twitch-embed"></div>
  20. <!-- Load the Twitch embed script -->
  21. <script src="https://embed.twitch.tv/embed/v1.js"></script>
  22. <!-- Create a Twitch.Embed object that will render within the "twitch-embed" root element. -->
  23. <script type="text/javascript">
  24. new Twitch.Embed("twitch-embed", {
  25. width: 640,
  26. height: 500, // 360 + 180 (chat) - 40
  27. channel: "{{ post.video-twitch-channel }}"
  28. });
  29. </script>
  30. {% else %}
  31. {% if page.video-yt-id %}
  32. <div>
  33. <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/{{post.video-yt-id}}?rel=0&amp;showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
  34. </div>
  35. {% endif %}
  36. {% endif %}
  37. {% endif %}