luxick/luxtools-plugin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Thumbnails verison 1
Some checks failed
DokuWiki Default Tasks / all (push) Has been cancelled
Details

Browse Source
This commit is contained in:
luxick
2026-01-06 10:40:19 +01:00
parent dbc9de37e0
commit 23403bcc4f
9 changed files with 313 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
Output.php
View File

@@ -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.
*

3
_test/SyntaxTest.php
View File

@@ -239,6 +239,9 @@ class plugin_luxtools_test extends DokuWikiTest
$this->structureCheck($doc, $structure);
$this->assertStringContainsString('exampleimage.png', $xhtml);
$this->assertStringContainsString('data-thumb-src=', $xhtml);
$this->assertStringContainsString('width="150"', $xhtml);
$this->assertStringContainsString('height="150"', $xhtml);
}
/**

3
conf/default.php
View File

@@ -9,6 +9,9 @@ $conf['allow_in_comments'] = 0;
$conf['defaults'] = '';
$conf['extensions'] = '';
// MediaManager ID for gallery thumbnail placeholder
$conf['thumb_placeholder'] = ':wiki:thumb-placeholder.png';
// Local opener service used by {{open>...}}.
$conf['open_service_url'] = 'http://127.0.0.1:8765';
$conf['open_service_token'] = '';

2
conf/metadata.php
View File

@@ -12,5 +12,7 @@ $meta['allow_in_comments'] = array('onoff');
$meta['defaults'] = array('string');
$meta['extensions'] = array('string');
$meta['thumb_placeholder'] = array('string');
$meta['open_service_url'] = array('string');
$meta['open_service_token'] = array('string');

212
file.php
View File

@@ -17,6 +17,172 @@ if (!$syntax) die('plugin disabled?');
$pathUtil = new Path($syntax->getConf('paths'));
$path = $INPUT->str('root') . $INPUT->str('file');
/**
* Send a file to the client with basic caching headers.
*
* @param string $path
* @param string $mime
* @param bool $download
* @param string|null $downloadName
* @param string|null $etag
* @param int|null $mtime
* @param int|null $maxAge
* @return void
*/
function luxtools_sendfile($path, $mime, $download = false, $downloadName = null, $etag = null, $mtime = null, $maxAge = null)
{
header('Content-Type: ' . $mime);
header('X-Content-Type-Options: nosniff');
if ($download) {
$downloadName = $downloadName ?: basename($path);
header('Content-Disposition: attachment; filename="' . $downloadName . '"');
}
if ($etag !== null) {
header('ETag: "' . $etag . '"');
}
if ($mtime !== null) {
header('Last-Modified: ' . gmdate('D, d M Y H:i:s', $mtime) . ' GMT');
}
if ($maxAge !== null) {
header('Cache-Control: public, max-age=' . (int)$maxAge . ', immutable');
}
// Conditional request handling
if ($etag !== null && isset($_SERVER['HTTP_IF_NONE_MATCH'])) {
if (trim($_SERVER['HTTP_IF_NONE_MATCH']) === '"' . $etag . '"') {
http_status(304);
exit;
}
}
if ($mtime !== null && isset($_SERVER['HTTP_IF_MODIFIED_SINCE'])) {
$ims = strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE']);
if ($ims !== false && $ims >= $mtime) {
http_status(304);
exit;
}
}
http_sendfile($path);
readfile($path);
exit;
}
/**
* Create a thumbnail file using GD.
*
* @param string $src
* @param string $dst
* @param int $maxW
* @param int $maxH
* @param string $dstFormat 'jpg' or 'png'
* @param int $quality JPEG quality 0-100
* @return bool
*/
function luxtools_create_thumb_gd($src, $dst, $maxW, $maxH, $dstFormat, $quality)
{
if (!function_exists('imagecreatetruecolor')) return false;
if (!is_readable($src)) return false;
$info = @getimagesize($src);
if (!is_array($info) || empty($info[0]) || empty($info[1]) || empty($info['mime'])) return false;
$srcW = (int)$info[0];
$srcH = (int)$info[1];
$srcMime = (string)$info['mime'];
if ($srcW <= 0 || $srcH <= 0) return false;
$maxW = max(1, (int)$maxW);
$maxH = max(1, (int)$maxH);
$scale = min($maxW / $srcW, $maxH / $srcH, 1);
$dstW = max(1, (int)floor($srcW * $scale));
$dstH = max(1, (int)floor($srcH * $scale));
switch ($srcMime) {
case 'image/jpeg':
if (!function_exists('imagecreatefromjpeg')) return false;
$srcImg = @imagecreatefromjpeg($src);
break;
case 'image/png':
if (!function_exists('imagecreatefrompng')) return false;
$srcImg = @imagecreatefrompng($src);
break;
case 'image/gif':
if (!function_exists('imagecreatefromgif')) return false;
$srcImg = @imagecreatefromgif($src);
break;
case 'image/webp':
if (!function_exists('imagecreatefromwebp')) return false;
$srcImg = @imagecreatefromwebp($src);
break;
default:
return false;
}
if (!$srcImg) return false;
$dstImg = imagecreatetruecolor($dstW, $dstH);
if (!$dstImg) {
imagedestroy($srcImg);
return false;
}
// Preserve transparency for formats that support it
if ($dstFormat === 'png') {
imagealphablending($dstImg, false);
imagesavealpha($dstImg, true);
$transparent = imagecolorallocatealpha($dstImg, 0, 0, 0, 127);
imagefilledrectangle($dstImg, 0, 0, $dstW, $dstH, $transparent);
}
$ok = imagecopyresampled($dstImg, $srcImg, 0, 0, 0, 0, $dstW, $dstH, $srcW, $srcH);
imagedestroy($srcImg);
if (!$ok) {
imagedestroy($dstImg);
return false;
}
// Write to a temporary file then rename atomically
$tmp = $dst . '.tmp.' . getmypid();
@io_mkdir_p(dirname($dst));
$written = false;
if ($dstFormat === 'png') {
if (!function_exists('imagepng')) {
$written = false;
} else {
// compression: 0 (none) .. 9 (max). Use a reasonable default.
$written = @imagepng($dstImg, $tmp, 6);
}
} else {
if (!function_exists('imagejpeg')) {
$written = false;
} else {
$q = max(0, min(100, (int)$quality));
$written = @imagejpeg($dstImg, $tmp, $q);
}
}
imagedestroy($dstImg);
if (!$written || !is_file($tmp)) {
@unlink($tmp);
return false;
}
// Best-effort atomic move
if (!@rename($tmp, $dst)) {
// fallback copy
$ok = @copy($tmp, $dst);
@unlink($tmp);
if (!$ok) return false;
}
return true;
}
try {
$pathInfo = $pathUtil->getPathInfo($path, false);
if ($pathUtil::isWikiControlled($pathInfo['path'])) {
@@ -30,13 +196,47 @@ try {
exit;
}
[$ext, $mime, $download] = mimetype($pathInfo['path'], false);
$basename = basename($pathInfo['path']);
header('Content-Type: ' . $mime);
if ($download) {
header('Content-Disposition: attachment; filename="' . $basename . '"');
// Optional thumbnail mode: ?thumb=1&w=150&h=150
$thumb = (int)$INPUT->int('thumb');
$w = (int)$INPUT->int('w');
$h = (int)$INPUT->int('h');
$q = (int)$INPUT->int('q');
if ($q <= 0) $q = 80;
$isImage = is_string($mime) && str_starts_with($mime, 'image/');
$wantThumb = $thumb === 1 && $isImage && ($w > 0 || $h > 0);
if ($wantThumb) {
if ($w <= 0) $w = $h;
if ($h <= 0) $h = $w;
global $conf;
$srcMtime = @filemtime($pathInfo['path']) ?: time();
// Decide output format (prefer PNG when transparency is likely)
$dstFormat = ($mime === 'image/png' || $mime === 'image/gif') ? 'png' : 'jpg';
$dstMime = ($dstFormat === 'png') ? 'image/png' : 'image/jpeg';
$hash = sha1($pathInfo['path'] . '|' . $srcMtime . '|w=' . $w . '|h=' . $h . '|q=' . $q . '|f=' . $dstFormat);
$sub = substr($hash, 0, 2);
$cacheDir = rtrim($conf['cachedir'], '/');
$thumbPath = $cacheDir . '/luxtools/thumbs/' . $sub . '/' . $hash . '.' . $dstFormat;
if (!is_file($thumbPath)) {
$ok = luxtools_create_thumb_gd($pathInfo['path'], $thumbPath, $w, $h, $dstFormat, $q);
if (!$ok || !is_file($thumbPath)) {
// Fallback: serve original if we cannot thumbnail
luxtools_sendfile($pathInfo['path'], $mime, $download, basename($pathInfo['path']), null, $srcMtime, 3600);
}
}
// Cached thumbs are immutable because filename includes mtime
luxtools_sendfile($thumbPath, $dstMime, false, null, $hash, @filemtime($thumbPath) ?: $srcMtime, 31536000);
}
http_sendfile($pathInfo['path']);
readfile($pathInfo['path']);
// Default: serve original file
$basename = basename($pathInfo['path']);
luxtools_sendfile($pathInfo['path'], $mime, $download, $basename, null, @filemtime($pathInfo['path']) ?: null, 3600);
} catch (Exception $e) {
header('Content-Type: text/plain');
http_status(403);

2
lang/de/settings.php
View File

@@ -2,5 +2,7 @@
$lang['allow_in_comments'] = 'Files-Syntax in Kommentaren erlauben.';
$lang['thumb_placeholder'] = 'MediaManager-ID für den Platzhalter der Galerie-Thumbnails';
$lang['open_service_url'] = 'URL des lokalen Öffner-Dienstes für {{open>...}} (z.B. http://127.0.0.1:8765).';
$lang['open_service_token'] = 'Token für den lokalen Öffner-Dienst (X-Filetools-Token).';

2
lang/en/settings.php
View File

@@ -4,5 +4,7 @@ $lang['allow_in_comments'] = 'Whether to allow the files syntax to be used in co
$lang['defaults'] = 'Default options. Use the same syntax as in inline configuration';
$lang['extensions'] = 'Comma-separated list of allowed file extensions to list';
$lang['thumb_placeholder'] = 'MediaManager ID for the gallery thumbnail placeholder';
$lang['open_service_url'] = 'Local opener service URL for the {{open>...}} button (e.g. http://127.0.0.1:8765).';
$lang['open_service_token'] = 'Token sent to the local opener service (X-Filetools-Token).';

2
lang/nl/settings.php
View File

@@ -8,5 +8,7 @@ $lang['allow_in_comments'] = 'Of de files syntax toegestaan is voor gebruik in c
$lang['defaults'] = 'Default options. Gebruik dezelfde syntax als de inline configuratie.';
$lang['extensions'] = 'Komma-gescheiden lijst van toegestane bestandsextensies voor de lijst.';
$lang['thumb_placeholder'] = 'MediaManager-ID voor de placeholder van galerij thumbnails';
$lang['open_service_url'] = 'Lokale opener service-URL voor de {{open>...}} knop (bijv. http://127.0.0.1:8765).';
$lang['open_service_token'] = 'Token dat naar de lokale opener service wordt gestuurd (X-Filetools-Token).';

41
script.js
View File

@@ -3,6 +3,46 @@
(function () {
'use strict';
function initGalleryThumbs() {
var imgs = document.querySelectorAll('div.filetools-gallery img[data-thumb-src]');
if (!imgs || !imgs.length) return;
function loadThumb(img) {
var src = img.getAttribute('data-thumb-src') || '';
if (!src) return;
if (img.getAttribute('data-thumb-loading') === '1') return;
img.setAttribute('data-thumb-loading', '1');
var pre = new window.Image();
pre.onload = function () {
img.src = src;
img.removeAttribute('data-thumb-src');
img.removeAttribute('data-thumb-loading');
};
pre.onerror = function () {
img.removeAttribute('data-thumb-loading');
};
pre.src = src;
}
if ('IntersectionObserver' in window) {
var io = new window.IntersectionObserver(function (entries) {
entries.forEach(function (entry) {
if (!entry.isIntersecting) return;
loadThumb(entry.target);
io.unobserve(entry.target);
});
}, { rootMargin: '200px' });
imgs.forEach(function (img) { io.observe(img); });
} else {
// Fallback: load soon after initial render
window.setTimeout(function () {
imgs.forEach(loadThumb);
}, 0);
}
}
function getServiceUrl(el) {
var url = el.getAttribute('data-service-url') || '';
url = (url || '').trim();
@@ -120,4 +160,5 @@
}
document.addEventListener('click', onClick, false);
document.addEventListener('DOMContentLoaded', initGalleryThumbs, false);
})();