From: Olaf Braun <olaf_schmitz_1@t-online.de>
Date: Wed, 13 Dec 2023 12:06:33 +0000 (+0100)
Subject: Fix image(attachment and media) width change from editor (#5725)
X-Git-Tag: 6.0.4_dev_1~8
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=09400e13864cb1f4e247b2393b0ba746871e4a3f;p=GitHub%2FWoltLab%2FWCF.git

Fix image(attachment and media) width change from editor (#5725)

* Read and write image and media width

* Insert media width in acp template
---

diff --git a/com.woltlab.wcf/bbcode.xml b/com.woltlab.wcf/bbcode.xml
index 5f84ea27a5..58d1c19bd6 100644
--- a/com.woltlab.wcf/bbcode.xml
+++ b/com.woltlab.wcf/bbcode.xml
@@ -192,6 +192,9 @@
 				<attribute name="2">
 					<validationpattern><![CDATA[^(left|right|none)$]]></validationpattern>
 				</attribute>
+				<attribute name="3">
+					<validationpattern><![CDATA[^\d+$]]></validationpattern>
+				</attribute>
 			</attributes>
 		</bbcode>
 		<bbcode name="wsp">
diff --git a/com.woltlab.wcf/templates/mediaBBCodeTag.tpl b/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
index 848f068fe0..cb55423f3c 100644
--- a/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
+++ b/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
@@ -1,5 +1,5 @@
 {if !$removeLinks|isset}{assign var='removeLinks' value=false}{/if}
-<span class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}">
+<span class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}"{if $width !== 'auto'} style="width: {$width}px; display: inline-flex"{/if}>
 	{if $media->isImage}
 		{if $thumbnailSize != 'original'}
 			{if !$removeLinks}
diff --git a/wcfsetup/install/files/acp/templates/mediaBBCodeTag.tpl b/wcfsetup/install/files/acp/templates/mediaBBCodeTag.tpl
index 848f068fe0..cb55423f3c 100644
--- a/wcfsetup/install/files/acp/templates/mediaBBCodeTag.tpl
+++ b/wcfsetup/install/files/acp/templates/mediaBBCodeTag.tpl
@@ -1,5 +1,5 @@
 {if !$removeLinks|isset}{assign var='removeLinks' value=false}{/if}
-<span class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}">
+<span class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}"{if $width !== 'auto'} style="width: {$width}px; display: inline-flex"{/if}>
 	{if $media->isImage}
 		{if $thumbnailSize != 'original'}
 			{if !$removeLinks}
diff --git a/wcfsetup/install/files/lib/system/bbcode/AttachmentBBCode.class.php b/wcfsetup/install/files/lib/system/bbcode/AttachmentBBCode.class.php
index e4a22067bd..c71ab227fe 100644
--- a/wcfsetup/install/files/lib/system/bbcode/AttachmentBBCode.class.php
+++ b/wcfsetup/install/files/lib/system/bbcode/AttachmentBBCode.class.php
@@ -110,7 +110,7 @@ final class AttachmentBBCode extends AbstractBBCode
         }
 
         return \sprintf(
-            '<span title="%s" class="%s" style="width: %s">%s</span>',
+            '<span title="%s" class="%s" style="width: %s; display: inline-flex;">%s</span>',
             $title,
             $class,
             $width,
@@ -168,7 +168,7 @@ final class AttachmentBBCode extends AbstractBBCode
         }
 
         return \sprintf(
-            '<span class="%s" stlye="width: %s">%s%s</span>',
+            '<span class="%s" style="width: %s; display: inline-flex">%s%s</span>',
             $class,
             $width,
             $imageElement,
diff --git a/wcfsetup/install/files/lib/system/bbcode/WoltLabSuiteMediaBBCode.class.php b/wcfsetup/install/files/lib/system/bbcode/WoltLabSuiteMediaBBCode.class.php
index 4fdb9e2bec..b77b796ed2 100644
--- a/wcfsetup/install/files/lib/system/bbcode/WoltLabSuiteMediaBBCode.class.php
+++ b/wcfsetup/install/files/lib/system/bbcode/WoltLabSuiteMediaBBCode.class.php
@@ -60,6 +60,7 @@ final class WoltLabSuiteMediaBBCode extends AbstractBBCode
                 if ($media->isImage) {
                     $thumbnailSize = (!empty($openingTag['attributes'][1])) ? $openingTag['attributes'][1] : 'original';
                     $float = (!empty($openingTag['attributes'][2])) ? $openingTag['attributes'][2] : 'none';
+                    $width = (!empty($openingTag['attributes'][3])) ? $openingTag['attributes'][3] : 'auto';
 
                     return WCF::getTPL()->fetch('mediaBBCodeTag', 'wcf', [
                         'mediaLink' => $this->getLink($media),
@@ -71,6 +72,7 @@ final class WoltLabSuiteMediaBBCode extends AbstractBBCode
                         'float' => $float,
                         'media' => $media->getLocalizedVersion(MessageEmbeddedObjectManager::getInstance()->getActiveMessageLanguageID()),
                         'thumbnailSize' => $thumbnailSize,
+                        'width' => $width,
                     ]);
                 } elseif ($media->isVideo() || $media->isAudio()) {
                     return WCF::getTPL()->fetch('mediaBBCodeTag', 'wcf', [
diff --git a/wcfsetup/install/files/lib/system/html/input/node/HtmlInputNodeImg.class.php b/wcfsetup/install/files/lib/system/html/input/node/HtmlInputNodeImg.class.php
index 707aefb8ab..eacd22e92e 100644
--- a/wcfsetup/install/files/lib/system/html/input/node/HtmlInputNodeImg.class.php
+++ b/wcfsetup/install/files/lib/system/html/input/node/HtmlInputNodeImg.class.php
@@ -162,6 +162,12 @@ class HtmlInputNodeImg extends AbstractHtmlInputNode
 
         $float = 'none';
         $thumbnail = 'original';
+        $width = $element->getAttribute("data-width");
+        if (\preg_match('~(?<width>\d+)px$~', $width, $matches)) {
+            $width = (int)$matches['width'];
+        } else {
+            $width = "auto";
+        }
 
         if (
             \preg_match(
@@ -188,6 +194,7 @@ class HtmlInputNodeImg extends AbstractHtmlInputNode
             $mediumID,
             $thumbnail,
             $float,
+            $width,
         ];
 
         $newElement = $element->ownerDocument->createElement('woltlab-metacode');