Remove using of `jsImageViewer` class and set `data-fancybox`

diff --git a/com.woltlab.wcf/templates/shared_bbcode_wsm.tpl b/com.woltlab.wcf/templates/shared_bbcode_wsm.tpl
index b53650955ad3bd1214e021bb8d0f4c220c6ea224..89da936e06c443c21244715fdf334addd7c320bf 100644 (file)
--- a/com.woltlab.wcf/templates/shared_bbcode_wsm.tpl
+++ b/com.woltlab.wcf/templates/shared_bbcode_wsm.tpl
@@ -4,7 +4,7 @@
        {if $media->isImage}
                {if $thumbnailSize != 'original'}
                        {if !$removeLinks}
-                               <a href="{$mediaLink}" class="embeddedAttachmentLink jsImageViewer">
+                               <a href="{$mediaLink}" 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}

diff --git a/com.woltlab.wcf/templates/shared_uploadFieldComponent.tpl b/com.woltlab.wcf/templates/shared_uploadFieldComponent.tpl
index 59db9e3fc473ad7d7e6b62162dbd0d4bb66770de..82051998549cf4d88c6bba3de086983e7bb63d78 100644 (file)
--- a/com.woltlab.wcf/templates/shared_uploadFieldComponent.tpl
+++ b/com.woltlab.wcf/templates/shared_uploadFieldComponent.tpl
@@ -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()}" class="jsImageViewer">
+                                               <a href="{$file->getImage()}" data-fancybox>
                                                        <img src="{$file->getImage()}" width="{$file->getWidth()}" height="{$file->getHeight()}" loading="lazy" alt="" class="formUploadHandlerContentListImage">
                                                </a>
                                        {else}

diff --git a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
index 144caf80780d82cd0e7198acb619cfe3fbcfdf90..afb4eb36eaf8684fecea2ec03e1c57dd12d5ab11 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
+++ b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
@@ -59,7 +59,7 @@ function fileInitializationCompleted(element: HTMLElement, file: WoltlabCoreFile
     if (file.link !== undefined && file.filename !== undefined) {
       const link = document.createElement("a");
       link.href = file.link!;
-      link.classList.add("jsImageViewer");
+      link.dataset.fancybox = "attachments";
       link.title = file.filename;
       link.textContent = file.filename;
 

diff --git a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
index fef5939cb0a2012b1bed402e9147d4e1dd7c8ead..10fe391c01296f27aea654879c75b8591998473d 100644 (file)
--- a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
+++ b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
@@ -263,7 +263,7 @@ export class FileProcessor {
           filenameLink.href = element.link;
           filenameLink.title = element.filename;
           filenameLink.textContent = element.filename;
-          filenameLink.classList.add("jsImageViewer");
+          filenameLink.dataset.fancybox = "";
 
           // Insert a hidden image element that will be used by the image viewer as the preview image
           const previewImage = document.createElement("img");

diff --git a/ts/WoltLabSuite/Core/Ui/File/Upload.ts b/ts/WoltLabSuite/Core/Ui/File/Upload.ts
index 0e041911cf22caa7ec5ccfa0ecbc2d0bbd6daa31..043f5977bb6af0e90566f21c60c2c5986eccb8d7 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/File/Upload.ts
+++ b/ts/WoltLabSuite/Core/Ui/File/Upload.ts
@@ -177,7 +177,7 @@ class FileUpload extends Upload<FileUploadOptions> implements FileUploadHandler
 
           if (fileData.image !== null) {
             const a = document.createElement("a");
-            a.classList.add("jsImageViewer");
+            a.dataset.fancybox = "";
             a.href = fileData.image;
             const image = document.createElement("img");
             image.classList.add("formUploadHandlerContentListImage");

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
index d5bfeb4d6e5237a82474ba739f5ab6c2dbbefcf3..45eab9a9ff96501050bb55563614911701c546ff 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
@@ -43,7 +43,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Ui/Dropdown/Simple", "
             if (file.link !== undefined && file.filename !== undefined) {
                 const link = document.createElement("a");
                 link.href = file.link;
-                link.classList.add("jsImageViewer");
+                link.dataset.fancybox = "attachments";
                 link.title = file.filename;
                 link.textContent = file.filename;
                 const filename = element.querySelector(".fileList__item__filename");

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
index 2a6816322b035dcd424165feed7c62fa2d04e8b0..ace76ed429650b79fbe0aeecd15b0bf29aaab056 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
@@ -212,7 +212,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui
                         filenameLink.href = element.link;
                         filenameLink.title = element.filename;
                         filenameLink.textContent = element.filename;
-                        filenameLink.classList.add("jsImageViewer");
+                        filenameLink.dataset.fancybox = "";
                         // 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;

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/File/Upload.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/File/Upload.js
index 3b9ac95de11804a0b98c00092088925fb5adfdad..cb8454ee3459b522dd5305e05093e538dd01db14 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/File/Upload.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/File/Upload.js
@@ -113,7 +113,7 @@ define(["require", "exports", "tslib", "../../Core", "./Delete", "../../Dom/Util
                         const icon = fileElement.querySelector("fa-icon");
                         if (fileData.image !== null) {
                             const a = document.createElement("a");
-                            a.classList.add("jsImageViewer");
+                            a.dataset.fancybox = "";
                             a.href = fileData.image;
                             const image = document.createElement("img");
                             image.classList.add("formUploadHandlerContentListImage");