Thumbnails verison 1

Output.php

@@ -54,23 +54,74 @@ class Output
             return;
         }
 
+        $thumbW = 150;
+        $thumbH = 150;
+
+        $placeholderUrl = DOKU_BASE . 'lib/images/blank.gif';
+        $syntax = plugin_load('syntax', 'luxtools');
+        $placeholderId = $syntax ? trim((string)$syntax->getConf('thumb_placeholder')) : '';
+        if ($placeholderId !== '' && function_exists('ml')) {
+            // ml() builds a fetch.php URL for a MediaManager item
+            $placeholderUrl = ml($placeholderId, ['w' => $thumbW, 'h' => $thumbH], true, '&');
+        }
+
         /** @var \Doku_Renderer_xhtml $renderer */
         $renderer = $this->renderer;
         $renderer->doc .= '<div class="filetools-plugin filetools-gallery">';
 
         foreach ($this->files as $item) {
             $url = $this->itemWebUrl($item, !empty($params['randlinks']));
+            $thumbUrl = $this->withQueryParams($url, [
+                'thumb' => 1,
+                'w' => $thumbW,
+                'h' => $thumbH,
+            ]);
             $safeUrl = hsc($url);
+            $safeThumbUrl = hsc($thumbUrl);
+            $safePlaceholderUrl = hsc($placeholderUrl);
             $label = hsc($item['name']);
 
             $renderer->doc .= '<a href="' . $safeUrl . '" class="media" title="' . $label . '">';
-            $renderer->doc .= '<img src="' . $safeUrl . '" alt="' . $label . '" width="150" loading="lazy" />';
+            $renderer->doc .= '<img'
+                . ' class="luxtools-thumb"'
+                . ' src="' . $safePlaceholderUrl . '"'
+                . ' data-thumb-src="' . $safeThumbUrl . '"'
+                . ' alt="' . $label . '"'
+                . ' width="' . $thumbW . '"'
+                . ' height="' . $thumbH . '"'
+                . ' loading="lazy"'
+                . ' decoding="async"'
+                . ' />';
             $renderer->doc .= '</a>';
         }
 
         $renderer->doc .= '</div>';
     }
 
+    /**
+     * Append query parameters to a URL.
+     *
+     * Preserves existing query and fragment and uses RFC3986 encoding.
+     *
+     * @param string $url
+     * @param array $params
+     * @return string
+     */
+    protected function withQueryParams(string $url, array $params): string
+    {
+        if ($params === []) return $url;
+
+        $fragment = '';
+        $hashPos = strpos($url, '#');
+        if ($hashPos !== false) {
+            $fragment = substr($url, $hashPos);
+            $url = substr($url, 0, $hashPos);
+        }
+
+        $glue = (strpos($url, '?') === false) ? '?' : '&';
+        return $url . $glue . http_build_query($params, '', '&', PHP_QUERY_RFC3986) . $fragment;
+    }
+
     /**
      * Renders the files as a table, including details if configured that way.
      *