start using webp assets

README.md

@@ -234,7 +234,7 @@ This is based on Laravel Tinker and in fact uses the same REPL under the hood.
 
 # Gracie Gazelle
 
-![Gracie Gazelle](public/images/mascot.png)
+![Gracie Gazelle](public/images/mascot.webp)
 
 Gracie is a veteran pirate of the digital ocean.
 On land, predators form companies to hunt down prey.
@@ -247,6 +247,6 @@ She proudly puts the forbidden share symbols on her hat and belt, and is now one
 ## Tyson Tan
 
 Character design and bio by Tyson Tan, who offers mascot design services for free and open source software, free of charge, under a free license.
-[Download the high resolution version.](public/images/mascotFullVersion.png)
+[Download the high resolution version.](public/images/mascotFullVersion.webp)
 
 [tysontan.com](https://tysontan.com) / <tysontan@tysontan.com> / [@TysonTanX](https://twitter.com/tysontanx)

app/App.php

@@ -253,14 +253,9 @@ public static function manifest()
             "description" => $app->env->siteDescription,
             "icons" => [
                 [
-                    "src" => "/images/logos/liquidrop-bookish-1k.png",
-                    "sizes" => "1024x1024",
-                    "type" => "image/png",
-                ],
-                [
-                    "src" => "/images/logos/liquidrop-postmod-1k.png",
-                    "sizes" => "1024x1024",
-                    "type" => "image/png",
+                    "src" => "/images/logos/colorfulWaves-whiteShadow-2k.webp",
+                    "sizes" => "2048x2048",
+                    "type" => "image/webp",
                 ],
             ],
             /*

app/User.php

@@ -760,7 +760,7 @@ public static function displayAvatar(?string $uri, string $username): string
         # disabled or missing: show default
         if (empty($uri)) {
             #if (!self::hasAvatarsEnabled() || empty($uri)) {
-            $uri = "/images/avatars/default.png";
+            $uri = "/images/avatars/default.webp";
 
             return "<img src='{$uri}' alt='default avatar' title='default avatar' width='120'>";
         }

public/opensearch.xml

@@ -8,7 +8,7 @@
   <Url type="text/html"
        template="https://torrents.bio/torrents.php?search={searchTerms}" />
   <LongName>Search torrents.bio for BitTorrent biology data</LongName>
-  <Image height="2048" width="2048" type="image/webp">https://torrents.bio/images/favicon.webp</Image>
+  <Image height="2048" width="2048" type="image/webp">https://torrents.bio/images/logos/simpleFavicon-2k.webp</Image>
   <Query role="example" searchTerms="saccharomyces cerevisiae" />
   <Developer>Omics Tools LLC</Developer>
   <Attribution>

resources/js/global.js

@@ -383,7 +383,7 @@ function getCover(event) {
   if ($("#coverCont img").length == 0) {
     coverCont.appendChild(document.createElement("img"));
   }
-  $("#coverCont img")[0].src = image ? image : "/public/images/noartwork.png";
+  $("#coverCont img")[0].src = image ? image : "/public/images/noartwork.webp";
   coverCont.style.display = "block";
   coverListener = (mevent) => {
     let wh = window.innerHeight,

resources/scss/assets/icons.scss

@@ -197,7 +197,7 @@ img.torrent_header {
     content: "";
     margin-right: 0.5rem;
 
-    background-image: url("/images/icons/version.png");
+    background-image: url("/images/icons/version.webp");
     background-size: 100% 100%;
     display: inline-block;
 
@@ -218,7 +218,7 @@ img.torrent_header {
     content: "";
     margin-right: 0.5rem;
 
-    background-image: url("/images/icons/archive.png");
+    background-image: url("/images/icons/archive.webp");
     background-size: 100% 100%;
     display: inline-block;
 
@@ -235,6 +235,18 @@ img.torrent_header {
 }
 
 
+/**
+ * collages
+ */
+
+.locked {
+  &:before {
+    content: "🔒";
+    margin-right: 0.5rem;
+  }
+}
+
+
 /**
  * badges
  */

resources/scss/bookish/layout.scss

@@ -1,7 +1,7 @@
 /* Logo */
 /*
 .logo {
-  background: url("/images/logos/liquidrop-bookish-1k.png");
+  background: url("/images/logos/colorfulWaves-whiteShadow-2k.webp");
   background-size: contain;
   width: 50px;
   min-width: 50px;
@@ -149,4 +149,4 @@ ul .invitetree {
   float: left;
   margin: 0px;
   padding: 0px;
-}
+}

resources/scss/global/fonts.scss

@@ -64,7 +64,7 @@
  * wikipedia-style external links
  */
 a.external {
-  background-image: url("/images/symbols/external-link-ltr-icon.svg");
+  background-image: url("/images/icons/externalLink.svg");
   background-position: center right;
   background-repeat: no-repeat;
   padding-right: 13px;

resources/scss/global/tables.scss

@@ -26,6 +26,7 @@ table {
   &.compact,
   &.dense,
   &.small {
+
     th,
     td {
       border-bottom: none;
@@ -47,54 +48,6 @@ table.sidebar {
   }
 }
 
-/**
- * sortable tables
- */
-
-$bitmap: "/images/symbols/table-order.png";
-$nrsr: no-repeat scroll right;
-
-@mixin bitmap($px) {
-  background: url($bitmap) $nrsr $px transparent;
-}
-
-.headerSort {
-  cursor: pointer;
-}
-
-.headerSort span {
-  @include bitmap(-38px);
-  padding: 0px 20px 0 0;
-}
-
-.headerSortDown span {
-  @include bitmap(4px);
-}
-
-.headerSortUp span {
-  @include bitmap(-79px);
-}
-
-.headerSort.sorter-false,
-.headerSort.sorter-false span {
-  background-image: none;
-  cursor: default;
-}
-
-/* generic */
-#sortable {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  width: 50%;
-
-  li {
-    padding: 0px;
-    font-size: 1.2em;
-    height: 1.5em;
-  }
-}
-
 /* drag and drop controls */
 .drag_drop_save {
   padding: 6px 0;
@@ -179,4 +132,4 @@ aside.postActions {
       }
     }
   }
-}
+}

sections/bookmarks/torrents.php

@@ -161,7 +161,7 @@ class="number_column<?=(($Torrent['Seeders'] == 0) ? ' r00' : '')?>">
             $DisplayName .= 'data-cover="'.\Gazelle\Images::process($picture, 'thumb').'" ';
         }
 
-        $DisplayName .=' class="tooltip" title="View torrent group" dir="ltr">'.$GroupName.'</a>';
+        $DisplayName .= ' class="tooltip" title="View torrent group" dir="ltr">'.$GroupName.'</a>';
 
         if ($Torrent['IsSnatched']) {
             $DisplayName .= ' ' . Format::torrent_label('Snatched', 'bold');
@@ -245,7 +245,7 @@ class="number_column<?=(($Torrent['Seeders'] == 0) ? ' r00' : '')?>">
     class="bookmark_<?=$GroupID?>">
 
     <?php if (!$picture) {
-        $picture = staticServer.'/images/noartwork.png';
+        $picture = staticServer.'/images/noartwork.webp';
     } ?>
 
     <img class="tooltip"
@@ -282,7 +282,7 @@ class="bookmark_<?=$GroupID?>">
   <div class="header">
     <h2><?php if (!$Sneaky) { ?><a
         href="feeds.php?feed=torrents_bookmarks_t_<?=$app->user->extra['torrent_pass']?>&amp;user=<?=$app->user->core['id']?>&amp;auth=<?=$app->user->extra['RSS_Auth']?>&amp;passkey=<?=$app->user->extra['torrent_pass']?>&amp;authkey=<?=$app->user->extra['AuthKey']?>&amp;name=<?=urlencode($ENV->siteName.': Bookmarked Torrents')?>"><img
-          src="<?=staticServer?>/images/symbols/rss.png"
+          src="<?=staticServer?>/images/icons/rss.webp"
           alt="RSS feed" /></a>&nbsp;<?php } ?><?=$Title?>
     </h2>
     <div class="linkbox">

sections/requests/request.php

@@ -39,7 +39,7 @@
 
 if ($IsFilled) {
     $DisplayLink = "<a href='torrents.php?torrentid=$Request[TorrentID]' dir='ltr'>$Title</a>";
-#$DisplayLink = "$ArtistLink<a href='torrents.php?torrentid=$Request[TorrentID]' dir='ltr'>$Title</a>";
+    #$DisplayLink = "$ArtistLink<a href='torrents.php?torrentid=$Request[TorrentID]' dir='ltr'>$Title</a>";
 } else {
     $DisplayLink = '<span dir="ltr">'.$Title."</span>";
     #$DisplayLink = $ArtistLink.'<span dir="ltr">'.$Title."</span>";
@@ -142,7 +142,7 @@ class="brackets">Request update</a>
         <?php
     } else { ?>
         <img style="width: 100%;"
-          src="<?=staticServer?>/images/noartwork.png"
+          src="<?=staticServer?>/images/noartwork.webp"
           alt="<?=$CategoryName?>" class="tooltip"
           title="<?=$CategoryName?>" height="220" border="0" />
         <?php } ?>

sections/torrents/details.php

@@ -321,7 +321,7 @@ class="brackets">View log</a>
               alt="<?=$AltName?>" /></div>
           <?php } else { ?>
           <div><img width="100%"
-              src="<?=staticServer?>/images/noartwork.png"
+              src="<?=staticServer?>/images/noartwork.webp"
               alt="<?=$Categories[$GroupCategoryID - 1]?>"
               class="brackets tooltip"
               title="<?=$Categories[$GroupCategoryID - 1]?>" /></div>

sections/user/notify_edit.php

@@ -97,7 +97,7 @@
   <h3>
     <a
       href="feeds.php?feed=torrents_notify_<?=$N['ID']?>_<?=$app->user->extra['torrent_pass']?>&amp;user=<?=$app->user->core['id']?>&amp;auth=<?=$app->user->extra['RSS_Auth']?>&amp;passkey=<?=$app->user->extra['torrent_pass']?>&amp;authkey=<?=$app->user->extra['AuthKey']?>&amp;name=<?=urlencode($N['Label'])?>"><img
-        src="<?=staticServer?>/images/symbols/rss.png"
+        src="<?=staticServer?>/images/icons/rss.webp"
         alt="RSS feed"></a>
     <?=\Gazelle\Text::esc($N['Label'])?>
     <a href="user.php?action=notify_delete&amp;id=<?=$N['ID']?>&amp;auth=<?=$app->user->extra['AuthKey']?>"
@@ -186,8 +186,8 @@ class="box pad slight_margin"
           <input type="checkbox" name="categories<?=$i?>[]"
             id="<?=$Category?>_<?=$N['ID']?>"
             value="<?=$Category?>" <?php if (in_array($Category, $N['Categories'])) {
-        echo ' checked="checked"';
-    } ?>>
+                echo ' checked="checked"';
+            } ?>>
           <label
             for="<?=$Category?>_<?=$N['ID']?>"><?=$Category?></label><br>
           <?php } ?>
@@ -200,8 +200,8 @@ class="box pad slight_margin"
           <input type="checkbox" name="newgroupsonly<?=$i?>"
             id="newgroupsonly_<?=$N['ID']?>"
             <?php if ($N['NewGroupsOnly'] == '1') { # todo: Fix strict equality checking
-        echo ' checked="checked"';
-    } ?>>
+                echo ' checked="checked"';
+            } ?>>
           <label
             for="newgroupsonly_<?=$N['ID']?>">Only
             notify for new releases, not new formats</label>