Browse Source

template

pull/1/head
rra 3 years ago
parent
commit
e6db8462cf
  1. 23
      video-feed.html

23
video-feed.html

@ -200,10 +200,9 @@
<div class='wrapper'> <div class='wrapper'>
{% for video in videos %} {% for video in videos %}
<div class='video-box'> <div class='video-box'>
<div class='media'> <div class='media' id='media-{{ video.id }}'>
<a class='video-thumbnail' href="{{ host }}/videos/watch/{{ video.uuid }}"> <span class='video-thumbnail' id='thumb-{{ video.id }}' onclick="loadPlayer('{{ video.id }}', '{{ host }}{{ video.embed_path }}')" href="{{ host }}/videos/watch/{{ video.uuid }}">
<img src="{{ host }}{{ video.preview_path }}"> <img src="{{ host }}{{ video.preview_path }}">
<!-- <iframe width="560" height="315" sandbox="allow-same-origin allow-scripts allow-popups" src="{{ host }}{{ video.embed_path }}" frameborder="0" allowfullscreen></iframe> -->
<div class="video-thumbnail-duration-overlay"> <div class="video-thumbnail-duration-overlay">
{% if video.is_live %} {% if video.is_live %}
LIVE LIVE
@ -218,11 +217,11 @@
</div> </div>
<div class='metadata'> <div class='metadata'>
<div class='title'>{{ video.name }}</div> <div class='title'>{{ video.name }}</div>
<span class="description collapsed" id='vid-{{ video.id }}'> {{ video.description | linebreaks }}</span> <span class="description collapsed" id='meta-{{ video.id }}'> {{ video.description | linebreaks }}</span>
<div class='footer'> <div class='footer'>
<span class='channel'><a href='{{ video.channel.url }}'> {{ video.channel.display_name }}</a></span> <span class='channel'><a href='{{ video.channel.url }}'> {{ video.channel.display_name }}</a></span>
<span class='descr_button' id='toggle-button' onclick="toggleDescription('#vid-{{ video.id }}')"> <a href='#'> </a></span> <span class='descr_button' id='toggle-button' onclick="toggleDescription('#meta-{{ video.id }}')"> <a href='#'> </a></span>
<span class='date'> <a href='{{ host }}/videos/watch/{{ video.uuid }}'> {{ video.published_at.strftime('%Y-%m-%d') }}</a></span> <span class='date'> <a href='{{ host }}/videos/watch/{{ video.uuid }}'> {{ video.published_at.strftime('%Y-%m-%d') }}</a></span>
</div> </div>
@ -236,5 +235,17 @@
function toggleDescription(id){ function toggleDescription(id){
document.querySelector(id).classList.toggle("collapsed"); document.querySelector(id).classList.toggle("collapsed");
} }
function loadPlayer(id, embed_path){
media = document.querySelector('#media-'+ id)
var iframe = document.createElement('iframe');
iframe.src = embed_path + '?autoplay=1&title=0'
iframe.width = 560;
iframe.height = 315;
iframe.frameBorder = 0;
iframe.sandbox = "allow-same-origin allow-scripts allow-popups"
media.appendChild(iframe)
document.querySelector('#thumb-'+ id).remove()
}
</script> </script>
</html> </html>

Loading…
Cancel
Save