path: root/templates/thumbs.html

<div class="thumbs">
  $for(posts)$
  <div class="thumb panel">
    $if(thumbnail)$
    <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>
        <div style="flex-grow: 1"></div>
        <h3>
          $if(author)$
          <span>$author$ - </span>
          $endif$
          <span>$date$</span>
        </h3>
      </a>
    </div>
    $if(subtitle)$
    <div class="thumb-subtitle">
      $subtitle$
    </div>
    $endif$
    $if(teaser)$
    <div class="thumb-teaser">
      $teaser$<a href="$url$">read more...</a>
    </div>
    $endif$
  </div>
  $endfor$
</div>