Add single media selection form field

See #2509

diff --git a/com.woltlab.wcf/templates/__singleMediaSelectionFormField.tpl b/com.woltlab.wcf/templates/__singleMediaSelectionFormField.tpl
new file mode 100644 (file)
index 0000000..e48f0a0
--- /dev/null
+++ b/com.woltlab.wcf/templates/__singleMediaSelectionFormField.tpl
@@ -0,0 +1,41 @@
+{include file='__formFieldHeader'}
+
+{if $field->isImmutable() && $field->getValue()}
+       {if $field->getMedia()->isImage && $field->getMedia()->hasThumbnail('small')}
+               <div id="{@$field->getPrefixedId()}_preview" class="selectedImagePreview">
+                       {@$field->getMedia()->getThumbnailTag('small')}
+               </div>
+       {else}
+               <div class="box16 selectedImagePreview">
+                       {@$field->getMedia()->getElementTag(16)}
+                       
+                       <p>{$field->getMedia()->getTitle()}</p>
+               </div>
+       {/if}
+{else}
+       {if $field->isImageOnly()}
+               <div id="{@$field->getPrefixedId()}_preview" class="selectedImagePreview">
+                       {if $field->getValue() && $field->getMedia()->hasThumbnail('small')}
+                               {@$field->getMedia()->getThumbnailTag('small')}
+                       {/if}
+               </div>
+       {/if}
+       <p class="button jsMediaSelectButton jsMediaSelectButton_{@$form->getPrefixedId()}" data-store="{@$field->getPrefixedId()}"{if $field->isImageOnly()} data-display="{@$field->getPrefixedId()}_preview"{/if}>{lang}wcf.media.choose{if $field->isImageOnly()}Image{else}File{/if}{/lang}</p>
+       <input type="hidden" name="{@$field->getPrefixedId()}" id="{@$field->getPrefixedId()}"{if $field->getValue()} value="{@$field->getValue()}"{/if}>
+       
+       <script data-relocate="true">
+               {include file='mediaJavaScript'}
+               
+               require(['WoltLabSuite/Core/Media/Manager/Select'], function(MediaManagerSelect) {
+                       new MediaManagerSelect({
+                               buttonClass: 'jsMediaSelectButton_{@$form->getPrefixedId()}',
+                               {if $field->isImageOnly()}
+                                       dialogTitle: '{lang}wcf.media.chooseImage{/lang}',
+                                       imagesOnly: 1
+                               {/if}
+                       });
+               });
+       </script>
+{/if}
+
+{include file='__formFieldFooter'}

diff --git a/syncTemplates.json b/syncTemplates.json
index f213ae46552e22393bbfe735c71f01964129b5b9..f1eb2bcb319a1e3499267dcc5faa488291484087 100644 (file)
--- a/syncTemplates.json
+++ b/syncTemplates.json
@@ -31,6 +31,7 @@
     "__pollOptionsFormField",
     "__radioButtonFormField",
     "__ratingFormField",
+    "__singleMediaSelectionFormField",
     "__singleSelectionFormField",
     "__tabFormContainer",
     "__tabMenuFormContainer",

diff --git a/wcfsetup/install/files/acp/templates/__singleMediaSelectionFormField.tpl b/wcfsetup/install/files/acp/templates/__singleMediaSelectionFormField.tpl
new file mode 100644 (file)
index 0000000..e48f0a0
--- /dev/null
+++ b/wcfsetup/install/files/acp/templates/__singleMediaSelectionFormField.tpl
@@ -0,0 +1,41 @@
+{include file='__formFieldHeader'}
+
+{if $field->isImmutable() && $field->getValue()}
+       {if $field->getMedia()->isImage && $field->getMedia()->hasThumbnail('small')}
+               <div id="{@$field->getPrefixedId()}_preview" class="selectedImagePreview">
+                       {@$field->getMedia()->getThumbnailTag('small')}
+               </div>
+       {else}
+               <div class="box16 selectedImagePreview">
+                       {@$field->getMedia()->getElementTag(16)}
+                       
+                       <p>{$field->getMedia()->getTitle()}</p>
+               </div>
+       {/if}
+{else}
+       {if $field->isImageOnly()}
+               <div id="{@$field->getPrefixedId()}_preview" class="selectedImagePreview">
+                       {if $field->getValue() && $field->getMedia()->hasThumbnail('small')}
+                               {@$field->getMedia()->getThumbnailTag('small')}
+                       {/if}
+               </div>
+       {/if}
+       <p class="button jsMediaSelectButton jsMediaSelectButton_{@$form->getPrefixedId()}" data-store="{@$field->getPrefixedId()}"{if $field->isImageOnly()} data-display="{@$field->getPrefixedId()}_preview"{/if}>{lang}wcf.media.choose{if $field->isImageOnly()}Image{else}File{/if}{/lang}</p>
+       <input type="hidden" name="{@$field->getPrefixedId()}" id="{@$field->getPrefixedId()}"{if $field->getValue()} value="{@$field->getValue()}"{/if}>
+       
+       <script data-relocate="true">
+               {include file='mediaJavaScript'}
+               
+               require(['WoltLabSuite/Core/Media/Manager/Select'], function(MediaManagerSelect) {
+                       new MediaManagerSelect({
+                               buttonClass: 'jsMediaSelectButton_{@$form->getPrefixedId()}',
+                               {if $field->isImageOnly()}
+                                       dialogTitle: '{lang}wcf.media.chooseImage{/lang}',
+                                       imagesOnly: 1
+                               {/if}
+                       });
+               });
+       </script>
+{/if}
+
+{include file='__formFieldFooter'}

diff --git a/wcfsetup/install/files/lib/system/form/builder/field/media/SingleMediaSelectionFormField.class.php b/wcfsetup/install/files/lib/system/form/builder/field/media/SingleMediaSelectionFormField.class.php
new file mode 100644 (file)
index 0000000..5a2833f
--- /dev/null
+++ b/wcfsetup/install/files/lib/system/form/builder/field/media/SingleMediaSelectionFormField.class.php
@@ -0,0 +1,121 @@
+<?php
+namespace wcf\system\form\builder\field\media;
+use wcf\data\media\ViewableMedia;
+use wcf\system\form\builder\field\AbstractFormField;
+use wcf\system\form\builder\field\IImmutableFormField;
+use wcf\system\form\builder\field\TImmutableFormField;
+
+/**
+ * Implementation of a form field to select a single media file.
+ * 
+ * @author     Matthias Schmidt
+ * @copyright  2001-2019 WoltLab GmbH
+ * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @package    WoltLabSuite\Core\System\Form\Builder\Field
+ * @since      5.2
+ */
+class SingleMediaSelectionFormField extends AbstractFormField implements IImmutableFormField {
+       use TImmutableFormField;
+       
+       /**
+        * is `true` if only images can be selected and `false` otherwise
+        * @var boolean
+        */
+       protected $imageOnly = false;
+       
+       /**
+        * media object with the current value as id
+        * @var null|ViewableMedia
+        */
+       protected $media;
+       
+       /**
+        * @inheritDoc
+        */
+       protected $javaScriptDataHandlerModule = 'WoltLabSuite/Core/Form/Builder/Field/Value';
+       
+       /**
+        * @inheritDoc
+        */
+       protected $templateName = '__singleMediaSelectionFormField';
+       
+       /**
+        * Returns the media object with the current value as id.
+        * 
+        * @return      ViewableMedia
+        * 
+        * @throws      \InvalidArgumentException       if no or an invalid media id is set as value
+        */
+       public function getMedia() {
+               if ($this->media === null) {
+                       if (!$this->getValue()) {
+                               throw new \BadMethodCallException("Cannot be media object if no valid media id is set as value.");
+                       }
+                       
+                       $this->media = ViewableMedia::getMedia($this->getValue());
+                       if ($this->media === null) {
+                               throw new \UnexpectedValueException("Cannot load media with id '{$this->getValue()}'.");
+                       }
+               }
+               
+               return $this->media;
+       }
+       
+       /**
+        * Sets if only images can be selected and returns this field.
+        * 
+        * @param       boolean         $imageOnly
+        * @return      static                          this field
+        */
+       public function imageOnly($imageOnly = true) {
+               $this->imageOnly = $imageOnly;
+               
+               return $this;
+       }
+       
+       /**
+        * Returns `true` if only images can be selected and `false` otherwise.
+        * 
+        * By default, all images can be selected.
+        * 
+        * @return      boolean
+        */
+       public function isImageOnly() {
+               return $this->imageOnly;
+       }
+       
+       /**
+        * @inheritDoc
+        */
+       public function readValue() {
+               if ($this->getDocument()->hasRequestData($this->getPrefixedId())) {
+                       $value = $this->getDocument()->getRequestData($this->getPrefixedId());
+                       
+                       if ($value) {
+                               $this->value = $value;
+                       }
+               }
+               
+               return $this;
+       }
+       
+       /**
+        * @inheritDoc
+        */
+       public function validate() {
+               parent::validate();
+               
+               try {
+                       $media = $this->getMedia();
+                       if (!$media->isAccessible() || ($this->isImageOnly() && !$media->isImage)) {
+                               $this->value = null;
+                       }
+               }
+               catch (\BadMethodCallException $e) {
+                       $this->value = null;
+               }
+               catch (\UnexpectedValueException $e) {
+                       $this->value = null;
+               }
+       }
+}

diff --git a/wcfsetup/install/lang/de.xml b/wcfsetup/install/lang/de.xml
index d69c0fb50596a5fd627a13ce361bba40f400ef26..04432fdb2a9105fced0a6227b735523d813ac217 100644 (file)
--- a/wcfsetup/install/lang/de.xml
+++ b/wcfsetup/install/lang/de.xml
@@ -3979,6 +3979,7 @@ Dateianhänge:
                <item name="wcf.media.caption.enableHtml"><![CDATA[HTML in der Bildunterschrift verwenden]]></item>
                <item name="wcf.media.category.choose"><![CDATA[Kategorien]]></item>
                <item name="wcf.media.categoryID"><![CDATA[Kategorie]]></item>
+               <item name="wcf.media.chooseFile"><![CDATA[Datei auswählen]]></item>
                <item name="wcf.media.chooseImage"><![CDATA[Bild auswählen]]></item>
                <item name="wcf.media.delete.confirmMessage"><![CDATA[{if LANGUAGE_USE_INFORMAL_VARIANT}Möchtest du{else}Möchten Sie{/if} die Datei <span class="confirmationObject">{$title}</span> wirklich löschen?]]></item>
                <item name="wcf.media.edit"><![CDATA[Datei bearbeiten]]></item>

diff --git a/wcfsetup/install/lang/en.xml b/wcfsetup/install/lang/en.xml
index 477dd695b21f33c4d19dd5ff15960091d7a93472..4ec7a031d7d3a700f7049bdd71907e1ef28e4527 100644 (file)
--- a/wcfsetup/install/lang/en.xml
+++ b/wcfsetup/install/lang/en.xml
@@ -3925,6 +3925,7 @@ Attachments:
                <item name="wcf.media.caption.enableHtml"><![CDATA[Enable HTML code in caption]]></item>
                <item name="wcf.media.category.choose"><![CDATA[Categories]]></item>
                <item name="wcf.media.categoryID"><![CDATA[Category]]></item>
+               <item name="wcf.media.chooseFile"><![CDATA[Select File]]></item>
                <item name="wcf.media.chooseImage"><![CDATA[Select Image]]></item>
                <item name="wcf.media.delete.confirmMessage"><![CDATA[Do you really want to delete the media file <span class="confirmationObject">{$title}</span>?]]></item>
                <item name="wcf.media.edit"><![CDATA[Edit Media File]]></item>