Better Liip-Imagine/Gaufrette media integration

src/Controller/MediaController.php

@@ -17,7 +17,6 @@
 use Sylius\Bundle\ResourceBundle\Controller\ResourceController;
 use Sylius\Component\Resource\ResourceActions;
 use Symfony\Component\HttpFoundation\BinaryFileResponse;
-use Symfony\Component\HttpFoundation\File\File;
 use Symfony\Component\HttpFoundation\Request;
 use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\HttpFoundation\ResponseHeaderBag;
@@ -59,15 +58,13 @@ public function downloadMediaAction(Request $request): Response
         /** @var MediaInterface|null $media */
         $media = $this->getMediaForRequestCode($configuration, $request);
         Assert::notNull($media);
+        Assert::notNull($media->getPath());
         $this->eventDispatcher->dispatch(ResourceActions::SHOW, $configuration, $media);
-        $mediaPath = $this->getMediaPathIfNotNull($media);
-        $mediaFile = new File($mediaPath);
-        $mediaName = $media->getDownloadName() . '.' . $mediaFile->guessExtension();
-        $response = new BinaryFileResponse($mediaPath);
+        $response = new BinaryFileResponse('gaufrette://' . $this->getParameter('bitbag_sylius_cms_plugin.uploader.filesystem') . '/' . $media->getPath());
 
         $response->setContentDisposition(
             $request->get('disposition', ResponseHeaderBag::DISPOSITION_ATTACHMENT),
-            $mediaName
+            $media->getDownloadName() . '.' . pathinfo($media->getPath(), \PATHINFO_EXTENSION),
         );
         $response->headers->set('Content-Type', $media->getMimeType());
 

src/Controller/ResourceDataProcessingTrait.php

@@ -51,9 +51,7 @@ private function setPathForImageMediaType(MediaInterface $media): void
         if (!$this->cacheManager->isStored($media->getPath(), $this::FILTER)) {
             $this->cacheManager->store($this->dataManager->find($this::FILTER, $media->getPath()), $media->getPath(), $this::FILTER);
         }
-        $resolvedPath = $this->cacheManager->resolve($media->getPath(), $this::FILTER);
-        $fileContents = file_get_contents($resolvedPath);
-        Assert::string($fileContents);
+        $fileContents = $this->dataManager->find($this::FILTER, $media->getPath())->getContent();
         $this->setFileContentsAsMediaPath($media, $fileContents);
     }
 
@@ -76,8 +74,8 @@ private function setFileContentsAsMediaPath(MediaInterface $media, string $fileC
     private function getMediaPathIfNotNull(MediaInterface $media): string
     {
         Assert::string($media->getPath());
-        Assert::string($this->getParameter('sylius_core.public_dir'));
+        Assert::string($this->getParameter('bitbag_sylius_cms_plugin.uploader.filesystem'));
 
-        return $this->getParameter('sylius_core.public_dir') . $media->getPath();
+        return 'gaufrette://' . $this->getParameter('bitbag_sylius_cms_plugin.uploader.filesystem') . '/' . $media->getPath();
     }
 }

src/Entity/Media.php

@@ -58,6 +58,9 @@ class Media implements MediaInterface
     /** @var int|null */
     protected $height;
 
+    /** @var array */
+    public $imaginePaths = [];
+
     /** @var bool */
     protected $saveWithOriginalName = false;
 

src/EventListener/CmsMediaListener.php

@@ -0,0 +1,27 @@
+<?php
+
+declare(strict_types=1);
+
+namespace BitBag\SyliusCmsPlugin\EventListener;
+
+use BitBag\SyliusCmsPlugin\Entity\Media;
+use Doctrine\ORM\Event\LifecycleEventArgs;
+use Liip\ImagineBundle\Imagine\Cache\CacheManager;
+use Webmozart\Assert\Assert;
+
+class CmsMediaListener
+{
+    private CacheManager $imagineCacheManager;
+
+    public function __construct(
+        CacheManager $imagineCacheManager
+    ) {
+        $this->imagineCacheManager = $imagineCacheManager;
+    }
+
+    public function postLoad(Media $media, LifecycleEventArgs $event): void
+    {
+        Assert::notNull($media->getPath());
+        $media->imaginePaths['tiny'] = $this->imagineCacheManager->resolve($media->getPath(), 'sylius_admin_product_tiny_thumbnail');
+    }
+}

src/Resources/assets/admin/js/bitbag/bitbag-media-autocomplete.js

@@ -147,7 +147,7 @@ export class HandleAutoComplete {
         const selectMenu = mediaContainer.querySelector(this.selectMenu);
         selectMenu.innerHTML = '';
         arr?.forEach((item) => {
-            selectMenu.insertAdjacentHTML('beforeend', this._itemTemplate(item.path, item.code.trim()));
+            selectMenu.insertAdjacentHTML('beforeend', this._itemTemplate(item.imaginePaths.tiny, item.code.trim()));
         });
         triggerCustomEvent(mediaContainer, 'cms.media.display.update.end');
     }

src/Resources/config/serializer/Entity.Media.yml

@@ -15,6 +15,10 @@ BitBag\SyliusCmsPlugin\Entity\Media:
             expose: true
             type: string
             groups: [Autocomplete]
+        imaginePaths:
+            expose: true
+            type: array
+            groups: [Autocomplete]
     relations:
         -
             rel: self

src/Resources/config/services.yml

@@ -54,3 +54,10 @@ services:
 
     bitbag_sylius_cms_plugin.sorter.sections:
         class: BitBag\SyliusCmsPlugin\Sorter\SectionsSorter
+
+    bitbag_sylius_cms_plugin.media_listener:
+        class: BitBag\SyliusCmsPlugin\EventListener\CmsMediaListener
+        tags:
+            - { name: 'doctrine.orm.entity_listener', event: 'postLoad', entity: 'BitBag\SyliusCmsPlugin\Entity\Media' }
+        arguments:
+            - "@liip_imagine.cache.manager"

src/Resources/views/Shop/Media/Show/image.html.twig

@@ -1,6 +1,12 @@
 <h2>{{ media.name|raw }}</h2>
 
-<img class="ui fluid image" src="{{ media.path }}" alt="{{ media.name }}"
+{% if page.image.path starts with 'data:' %}
+    {% set src = page.image.path %}
+{% else %}
+    {% set src = page.image.path|imagine_filter('sylius_large') %}
+{% endif %}
+
+<img class="ui fluid image" src="{{ src }}" alt="{{ media.name }}"
     {% if media.width is not null %} width="{{ media.width }}" {% endif %}
     {% if media.height is not null %} height="{{ media.height }}" {% endif %}
 />

src/Resources/views/Shop/Page/show.html.twig

@@ -33,7 +33,12 @@
             <div class="ui grid center aligned">
                 <div class="eight wide column">
                     {% if page.image %}
-                        <img class="page-image ui fluid image" src="{{ page.image.path }}" alt="">
+                        {% if page.image.path starts with 'data:' %}
+                            {% set src = page.image.path %}
+                        {% else %}
+                            {% set src = page.image.path|imagine_filter('sylius_large') %}
+                        {% endif %}
+                        <img class="page-image ui fluid image" src="{{ src }}" alt="">
                     {% endif %}
                 </div>
             </div>

src/Resources/views/Shop/Product/_pagesBySection.html.twig

@@ -12,7 +12,12 @@
                 <div class="column">
                     <div class="ui fluid segment column">
                         {% if page.image %}
-                            <img class="ui fluid image" src="{{ page.image.path }}" alt="{{ page.nameWhenLinked }}">
+                            {% if page.image.path starts with 'data:' %}
+                                {% set src = page.image.path %}
+                            {% else %}
+                                {% set src = page.image.path|imagine_filter('sylius_small') %}
+                            {% endif %}
+                            <img class="ui fluid image" src="{{ src }}" alt="{{ page.nameWhenLinked }}">
                         {% endif %}
 
                         <h3>

src/Uploader/MediaUploader.php

@@ -46,7 +46,7 @@ public function upload(MediaInterface $media, string $pathPrefix): void
             $path = $this->expandPath($hash . '.' . $file->guessExtension(), $pathPrefix, $originalName);
         } while ($this->filesystem->has($path));
 
-        $media->setPath('/' . $path);
+        $media->setPath($path);
         $media->setMimeType($file->getMimeType());
         $file = $media->getFile();
         Assert::notNull($file, sprintf('File for media identified by id: "%s" is null', $media->getId()));