diff options
author | cel 🌸 <cel@blos.sm> | 2024-07-16 13:12:33 +0100 |
---|---|---|
committer | cel 🌸 <cel@blos.sm> | 2024-07-16 13:12:33 +0100 |
commit | fd0ea710395904e1b4cf5f22fd17af13db43ce5f (patch) | |
tree | c694efa675d3ad1daab3b1d9cfea737a805f1977 /templates | |
parent | e5e763f1d7d473b22d8c2e7f4a0058ada7832c24 (diff) | |
download | infoculture.pub-fd0ea710395904e1b4cf5f22fd17af13db43ce5f.tar.gz infoculture.pub-fd0ea710395904e1b4cf5f22fd17af13db43ce5f.tar.bz2 infoculture.pub-fd0ea710395904e1b4cf5f22fd17af13db43ce5f.zip |
webtorrent and teaser support
Diffstat (limited to '')
-rw-r--r-- | templates/article.html | 44 | ||||
-rw-r--r-- | templates/base.html | 2 | ||||
-rw-r--r-- | templates/default.html | 33 | ||||
-rw-r--r-- | templates/load-webtorrent.html | 9 | ||||
-rw-r--r-- | templates/post.html | 30 | ||||
-rw-r--r-- | templates/thumbs.html | 18 |
6 files changed, 73 insertions, 63 deletions
diff --git a/templates/article.html b/templates/article.html new file mode 100644 index 0000000..e5ed720 --- /dev/null +++ b/templates/article.html @@ -0,0 +1,44 @@ +<article> + $if(thumbnail)$ + <div class="thumbnail" style="height: 30vh;">$thumbnail$</div> + $endif$ + $if(torrent)$ + <div> + <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> + </div> + $endif$ + <div class="panel"> + <section class="header"> + <div class="title"> + <h1>$title$</h1> + <a href="https://infoculture.pub$url$">permalink</a> + <a href="/$path$">raw</a> + $if(torrent)$ + <a href="$torrent$">magnet link</a> + $endif$ + </div> + <div class="meta"> + $if(author)$ + <h2 class="author">$author$</h2> + $endif$ + <h3 class="date">$date$</h3> + $if(tags)$ + <h3 class="tags">$tags$</h3> + $endif$ + </div> + </section> + <br> + <br> + <section> + $body$ + </section> + </div> +</article> diff --git a/templates/base.html b/templates/base.html index 321ab9d..1875345 100644 --- a/templates/base.html +++ b/templates/base.html @@ -38,4 +38,4 @@ </footer> </body> -</html> +</html>
\ No newline at end of file diff --git a/templates/default.html b/templates/default.html deleted file mode 100644 index e91badc..0000000 --- a/templates/default.html +++ /dev/null @@ -1,33 +0,0 @@ -<!doctype html> -<html lang="en"> - <head> - <meta charset="utf-8"> - <meta http-equiv="x-ua-compatible" content="ie=edge"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <title>My Hakyll Blog - $title$</title> - <link rel="stylesheet" href="/css/default.css" /> - </head> - <body> - <header> - <div class="logo"> - <a href="/">My Hakyll Blog</a> - </div> - <nav> - <a href="/">Home</a> - <a href="/about.html">About</a> - <a href="/contact.html">Contact</a> - <a href="/archive.html">Archive</a> - </nav> - </header> - - <main role="main"> - <h1>$title$</h1> - $body$ - </main> - - <footer> - Site proudly generated by - <a href="http://jaspervdj.be/hakyll">Hakyll</a> - </footer> - </body> -</html> diff --git a/templates/load-webtorrent.html b/templates/load-webtorrent.html new file mode 100644 index 0000000..0d7347f --- /dev/null +++ b/templates/load-webtorrent.html @@ -0,0 +1,9 @@ +<script type='module'> + import WebTorrent from '/scripts/webtorrent.min.js'; + + window.torrentClient = new WebTorrent(); + + navigator.serviceWorker.register('/sw.min.js'); + const controller = await navigator.serviceWorker.ready; + window.torrentClient.createServer({controller}); +</script> diff --git a/templates/post.html b/templates/post.html index 77986ae..ddbd384 100644 --- a/templates/post.html +++ b/templates/post.html @@ -1,30 +1,4 @@ <main role="main"> - <article> - $if(thumbnail)$ - <div class="thumbnail" style="height: 30vh;">$thumbnail$</div> - $endif$ - <div class="panel"> - <section class="header"> - <div class="title"> - <h1>$title$</h1> - <a href="https://infoculture.pub$url$">permalink</a> - <a href="/$path$">raw</a> - </div> - <div class="meta"> - $if(author)$ - <h2 class="author">$author$</h2> - $endif$ - <h3 class="date">$date$</h3> - $if(tags)$ - <h3 class="tags">$tags$</h3> - $endif$ - </div> - </section> - <br> - <br> - <section> - $body$ - </section> - </div> - </article> + $partial("templates/load-webtorrent.html")$ + $partial("templates/article.html")$ </main>
\ No newline at end of file diff --git a/templates/thumbs.html b/templates/thumbs.html index 91cfd74..3fcc6f7 100644 --- a/templates/thumbs.html +++ b/templates/thumbs.html @@ -5,6 +5,17 @@ <div class="thumbnail" style="height: 25vh">$thumbnail$</div> <br> $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> + $endif$ <div class="thumb-title"> <a href="$url$"> <h2>$title$</h2> @@ -22,6 +33,11 @@ $subtitle$ </div> $endif$ + $if(teaser)$ + <div class="thumb-teaser"> + $teaser$<a href="$url$">read more...</a> + </div> + $endif$ </div> $endfor$ -</div>
\ No newline at end of file +</div> |