summaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
authorLibravatar cel 🌸 <cel@blos.sm>2024-07-17 10:04:13 +0100
committerLibravatar cel 🌸 <cel@blos.sm>2024-07-17 10:04:13 +0100
commit2476ed8bd64ea7335b6baf44ec1adbeb5169069c (patch)
treec926bca429ddb8605cc307df84237b188d24d393 /templates
parentfb76f6581f199504e66125dad3f5ca5a7d4c7db6 (diff)
downloadinfoculture.pub-2476ed8bd64ea7335b6baf44ec1adbeb5169069c.tar.gz
infoculture.pub-2476ed8bd64ea7335b6baf44ec1adbeb5169069c.tar.bz2
infoculture.pub-2476ed8bd64ea7335b6baf44ec1adbeb5169069c.zip
genericise video player
Diffstat (limited to 'templates')
-rw-r--r--templates/article.html12
-rw-r--r--templates/load-webtorrent.html2
-rw-r--r--templates/thumbs.html12
-rw-r--r--templates/video-player.html11
4 files changed, 16 insertions, 21 deletions
diff --git a/templates/article.html b/templates/article.html
index 3de52e4..2aa24f2 100644
--- a/templates/article.html
+++ b/templates/article.html
@@ -3,15 +3,7 @@
<div class="thumbnail" style="height: 30vh;">$thumbnail$</div>
$endif$
$if(torrent)$
- <video controls class="thumbnail" id="media-$id$" style="height: 30vh;"></video>
- <script type='module'>
- const torrentId = '$torrent$';
- const player = document.querySelector('#media-$id$');
- window.torrentClient.add(torrentId, torrent => {
- const file = torrent.files.find(file => file.name.endsWith('.mp4'));
- file.streamTo(player);
- });
- </script>
+ $partial("templates/video-player.html")$
$endif$
<div class="panel">
<section class="header">
@@ -39,4 +31,4 @@
$body$
</section>
</div>
-</article>
+</article> \ No newline at end of file
diff --git a/templates/load-webtorrent.html b/templates/load-webtorrent.html
index 0d7347f..f63aa41 100644
--- a/templates/load-webtorrent.html
+++ b/templates/load-webtorrent.html
@@ -6,4 +6,4 @@
navigator.serviceWorker.register('/sw.min.js');
const controller = await navigator.serviceWorker.ready;
window.torrentClient.createServer({controller});
-</script>
+</script> \ No newline at end of file
diff --git a/templates/thumbs.html b/templates/thumbs.html
index 6070c23..cadbbc7 100644
--- a/templates/thumbs.html
+++ b/templates/thumbs.html
@@ -6,15 +6,7 @@
<br>
$endif$
$if(torrent)$
- <video controls class="thumbnail" id="media-$id$" style="height: 20vh;"></video>
- <script type='module'>
- const torrentId = '$torrent$';
- const player = document.querySelector('#media-$id$');
- window.torrentClient.add(torrentId, torrent => {
- const file = torrent.files.find(file => file.name.endsWith('.mp4'));
- file.streamTo(player);
- });
- </script>
+ $partial("templates/video-player.html")$
$endif$
<div class="thumb-title">
<a href="$url$">
@@ -40,4 +32,4 @@
$endif$
</div>
$endfor$
-</div> \ No newline at end of file
+</div>
diff --git a/templates/video-player.html b/templates/video-player.html
new file mode 100644
index 0000000..fd508a8
--- /dev/null
+++ b/templates/video-player.html
@@ -0,0 +1,11 @@
+<video id="media-$id$" class="thumbnail" controls preload="metadata"></video>
+<script type='module'>
+ const torrentId = '$torrent$';
+ const player = document.querySelector('#media-$id$');
+ window.torrentClient.add(torrentId, torrent => {
+ const thumbnail = torrent.files.find(file => file.name.endsWith('.jpg')).streamURL;
+ player.setAttribute("poster", thumbnail);
+ const videofile = torrent.files.find(file => file.name.endsWith('.mp4'));
+ videofile.streamTo(player);
+ });
+</script>