Use `data-caption` instead of `title`
authorCyperghost <olaf_schmitz_1@t-online.de>
Wed, 23 Oct 2024 11:07:22 +0000 (13:07 +0200)
committerCyperghost <olaf_schmitz_1@t-online.de>
Wed, 23 Oct 2024 11:07:22 +0000 (13:07 +0200)
com.woltlab.wcf/templates/shared_bbcode_wsm.tpl
com.woltlab.wcf/templates/shared_uploadFieldComponent.tpl
ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
wcfsetup/install/files/acp/templates/attachmentList.tpl
wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
wcfsetup/install/files/js/WoltLabSuite/Core/Component/Image/Viewer.js
wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js

index 89da936e06c443c21244715fdf334addd7c320bf..282c4b1dd2c5d0edb26e14e419c6ed4e70719b62 100644 (file)
@@ -4,7 +4,7 @@
        {if $media->isImage}
                {if $thumbnailSize != 'original'}
                        {if !$removeLinks}
-                               <a href="{$mediaLink}" class="embeddedAttachmentLink" data-fancybox="attachments">
+                               <a href="{$mediaLink}" data-caption="{$media->title}" class="embeddedAttachmentLink" data-fancybox="attachments">
                        {/if}
                                        <img src="{$thumbnailLink}" alt="{$media->altText}" title="{$media->title}" width="{@$media->getThumbnailWidth($thumbnailSize)}" height="{@$media->getThumbnailHeight($thumbnailSize)}" loading="lazy">
                        {if !$removeLinks}
index 82051998549cf4d88c6bba3de086983e7bb63d78..d5a9fe7c05a5b243aeb570dd098e411b603663be 100644 (file)
@@ -13,7 +13,7 @@
                        {foreach from=$uploadFieldFiles item=file}
                                <li class="box64 uploadedFile" data-unique-file-id="{$file->getUniqueFileId()}">
                                        {if $file->isImage()}
-                                               <a href="{$file->getImage()}" data-fancybox>
+                                               <a href="{$file->getImage()}" data-fancybox data-caption="{$file->getFilename()}">
                                                        <img src="{$file->getImage()}" width="{$file->getWidth()}" height="{$file->getHeight()}" loading="lazy" alt="" class="formUploadHandlerContentListImage">
                                                </a>
                                        {else}
index afb4eb36eaf8684fecea2ec03e1c57dd12d5ab11..ab07eb7bad617d4e124718a110d24fad72de0a24 100644 (file)
@@ -61,6 +61,7 @@ function fileInitializationCompleted(element: HTMLElement, file: WoltlabCoreFile
       link.href = file.link!;
       link.dataset.fancybox = "attachments";
       link.title = file.filename;
+      link.dataset.caption = file.filename;
       link.textContent = file.filename;
 
       const filename = element.querySelector(".fileList__item__filename")!;
index 10fe391c01296f27aea654879c75b8591998473d..e8d1fab02e80895c30310d7d1e36177a4a74b4b7 100644 (file)
@@ -264,6 +264,7 @@ export class FileProcessor {
           filenameLink.title = element.filename;
           filenameLink.textContent = element.filename;
           filenameLink.dataset.fancybox = "";
+          filenameLink.dataset.caption = element.filename;
 
           // Insert a hidden image element that will be used by the image viewer as the preview image
           const previewImage = document.createElement("img");
index 6c846d7718882078b2f68216f17b90181c551049..edfc5f0f0176734a64ec34f2981f53bf59dc2387 100644 (file)
                                                <td class="columnID columnAttachmentID">{@$attachment->attachmentID}</td>
                                                <td class="columnTitle columnFilename">
                                                        <div class="box64">
-                                                               <a href="{$attachment->getLink()}"{if $attachment->isImage} data-fancybox="attachments" title="{$attachment->filename}"{/if}>
+                                                               <a href="{$attachment->getLink()}"{if $attachment->isImage} data-fancybox="attachments" data-caption="{$attachment->filename}"{/if}>
                                                                        {if $attachment->tinyThumbnailType}
                                                                                <img src="{$attachment->getThumbnailLink('tiny')}" class="attachmentTinyThumbnail" alt="">
                                                                        {else}
index 45eab9a9ff96501050bb55563614911701c546ff..b91487d63f5ca8af8a651d8d6db1225edfbc73bd 100644 (file)
@@ -45,6 +45,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Ui/Dropdown/Simple", "
                 link.href = file.link;
                 link.dataset.fancybox = "attachments";
                 link.title = file.filename;
+                link.dataset.caption = file.filename;
                 link.textContent = file.filename;
                 const filename = element.querySelector(".fileList__item__filename");
                 filename.innerHTML = "";
index e9b29182e49e9da4d62a33c8e14eef4ff9d81720..80399a7b1d3d9aea808c531752599e15423e5b8b 100644 (file)
@@ -26,7 +26,7 @@ define(["require", "exports", "@fancyapps/ui"], function (require, exports, ui_1
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.setup = setup;
     exports.getLocalization = getLocalization;
-    const LOCALES = ["cs", "de", "en", "es", "fr", "it", "ja", "lv", "pl", "sk"];
+    const LOCALES = ["cs", "de", "en", "es", "fr", "it", "lv", "pl", "sk"];
     function setup() {
         void getLocalization().then((l10n) => {
             ui_1.Fancybox.bind("[data-fancybox]", {
index ace76ed429650b79fbe0aeecd15b0bf29aaab056..970e561ad277b057c4fd785a03083d92fea870e5 100644 (file)
@@ -213,6 +213,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui
                         filenameLink.title = element.filename;
                         filenameLink.textContent = element.filename;
                         filenameLink.dataset.fancybox = "";
+                        filenameLink.dataset.caption = element.filename;
                         // Insert a hidden image element that will be used by the image viewer as the preview image
                         const previewImage = document.createElement("img");
                         previewImage.src = thumbnail !== undefined ? thumbnail.link : element.link;