rra/lumbung-video-prototype
1
0
Fork 0
Code Issues 4 Pull Requests Projects Releases Wiki Activity

template

Browse Source
This commit is contained in:
rra 2021-07-07 17:24:14 +02:00
parent f5d455b487
commit e6db8462cf
1 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
video-feed.html
View File

@ -200,10 +200,9 @@
<div class='wrapper'>
{% for video in videos %}
<div class='video-box'>
<div class='media'>
<a class='video-thumbnail' href="{{ host }}/videos/watch/{{ video.uuid }}">
<div class='media' id='media-{{ video.id }}'>
<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 }}">
<!-- <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">
{% if video.is_live %}
LIVE
@ -218,11 +217,11 @@
</div>
<div class='metadata'>
<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'>
<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>
</div>
@ -236,5 +235,17 @@
function toggleDescription(id){
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>
</html>
</html>