Merge branch 'hotfix/1.5.3'

roadiz · Nov 6, 2020 · fd232a8 · fd232a8
2 parents decd297 + 9ad1614
commit fd232a8
Show file tree

Hide file tree

Showing 11 changed files with 79 additions and 32 deletions.
diff --git a/composer.json b/composer.json
@@ -34,7 +34,7 @@
         "monolog/monolog":"^1.24.0",
         "guzzlehttp/guzzle": "^6.3",
         "enshrined/svg-sanitize": "^0.10.0",
-        "twig/twig": "2.*",
+        "twig/twig": "^2.9 || 3.*",
         "intervention/image": "^2.4",
         "jms/serializer": "^2.3.0 || ^3.1.1"
     },

diff --git a/src/Roadiz/Document/Renderer/AbstractImageRenderer.php b/src/Roadiz/Document/Renderer/AbstractImageRenderer.php
@@ -128,7 +128,9 @@ protected function createTransparentDataURI(string $hexColor, int $width = 1, in
     protected function additionalAssignation(DocumentInterface $document, array $options, array &$assignation): void
     {
         if ($document instanceof AdvancedDocumentInterface) {
-            if (null !== $document->getImageRatio()) {
+            if (null !== $options['ratio'] && $options['ratio'] !== 0) {
+                $assignation['ratio'] = $options['ratio'];
+            } elseif (null !== $document->getImageRatio()) {
                 $assignation['ratio'] = $document->getImageRatio();
             }
             if (null !== $document->getImageAverageColor() &&

diff --git a/src/Roadiz/Resources/views/documents/audio.html.twig b/src/Roadiz/Resources/views/documents/audio.html.twig
@@ -1,4 +1,4 @@
-{% spaceless %}
+{% apply spaceless %}
     {% set attributes = {} %}
 
     {% if width %}
@@ -51,4 +51,4 @@
     {% endfor %}
     {% block audio_fallback %}<p>Your browser does not support native audio.</p>{% endblock %}
 </audio>
-{% endspaceless %}
+{% endapply %}
diff --git a/src/Roadiz/Resources/views/documents/image.html.twig b/src/Roadiz/Resources/views/documents/image.html.twig
@@ -1,4 +1,4 @@
-{% spaceless %}
+{% apply spaceless %}
     {% set attributes = {
         'alt' : alt|escape('html_attr'),
     } %}
@@ -82,4 +82,4 @@
             </noscript>
         {% endblock %}
     {% endif %}
-{% endspaceless %}
+{% endapply %}
diff --git a/src/Roadiz/Resources/views/documents/pdf.html.twig b/src/Roadiz/Resources/views/documents/pdf.html.twig
@@ -1,4 +1,4 @@
-{% spaceless %}
+{% apply spaceless %}
     {% set attributes = {
         'type': "application/pdf"|escape('html_attr'),
         'data': url,
@@ -34,4 +34,4 @@
 <object {{ attributesCompiled|join(' ')|raw }}>
     {%- block pdf_fallback -%}<p>Your browser does not support PDF native viewer.</p>{%- endblock -%}
 </object>
-{% endspaceless %}
+{% endapply %}
diff --git a/src/Roadiz/Resources/views/documents/picture.html.twig b/src/Roadiz/Resources/views/documents/picture.html.twig
@@ -1,4 +1,4 @@
-{% spaceless %}
+{% apply spaceless %}
 
 {%- include 'documents/picture-inner.html.twig' -%}
 {%- if lazyload -%}
@@ -11,4 +11,4 @@
 {% endblock %}
 {%- endif -%}
 
-{% endspaceless %}
+{% endapply %}
diff --git a/src/Roadiz/Resources/views/documents/video.html.twig b/src/Roadiz/Resources/views/documents/video.html.twig
@@ -1,4 +1,4 @@
-{% spaceless %}
+{% apply spaceless %}
     {% set attributes = {} %}
     {% if width %}
         {% set attributes = attributes|merge({
@@ -64,4 +64,4 @@
         <p>Your browser does not support native video.</p>
     {% endblock %}
 </video>
-{% endspaceless %}
+{% endapply %}
diff --git a/src/Roadiz/Utils/Document/UrlOptionsResolver.php b/src/Roadiz/Utils/Document/UrlOptionsResolver.php
@@ -32,13 +32,15 @@ public function __construct()
             'sharpen' => 0,
             'contrast' => 0,
             'rotate' => 0,
+            'ratio' => null,
         ]);
         $this->setAllowedTypes('width', ['int']);
         $this->setAllowedTypes('height', ['int']);
         $this->setAllowedTypes('crop', ['null', 'string']);
         $this->setAllowedTypes('fit', ['null', 'string']);
         $this->setAllowedTypes('flip', ['null', 'string']);
         $this->setAllowedTypes('align', ['null', 'string']);
+        $this->setAllowedTypes('ratio', ['null', 'float']);
         $this->setAllowedValues('align', [
             null,
             'top-left',
@@ -63,18 +65,31 @@ public function __construct()
         $this->setAllowedTypes('noProcess', ['boolean']);
         $this->setAllowedTypes('interlace', ['boolean']);
 
+        $this->setDefault('ratio', function (Options $options) {
+            $compositing = $options['crop'] ?? $options['fit'] ?? '';
+            if (1 === preg_match('#(?<width>[0-9]+)[x:\.](?<height>[0-9]+)#', $compositing, $matches)) {
+                return (float) $matches['width'] / $matches['height'];
+            }
+            return null;
+        });
         /*
          * Guess width and height options from fit
          */
         $this->setDefault('width', function (Options $options) {
-            if (1 === preg_match('#(?<width>[0-9]+)[x:\.](?<height>[0-9]+)#', $options['fit'] ?? '', $matches)) {
+            $compositing = $options['fit'] ?? '';
+            if (1 === preg_match('#(?<width>[0-9]+)[x:\.](?<height>[0-9]+)#', $compositing, $matches)) {
                 return (int) $matches['width'];
+            } elseif (null !== $options['ratio'] && $options['height'] !== 0 && $options['ratio'] !== 0) {
+                return (int) ($options['height'] * $options['ratio']);
             }
             return 0;
         });
         $this->setDefault('height', function (Options $options) {
-            if (1 === preg_match('#(?<width>[0-9]+)[x:\.](?<height>[0-9]+)#', $options['fit'] ?? '', $matches)) {
+            $compositing = $options['fit'] ?? '';
+            if (1 === preg_match('#(?<width>[0-9]+)[x:\.](?<height>[0-9]+)#', $compositing, $matches)) {
                 return (int) $matches['height'];
+            } elseif (null !== $options['ratio'] && $options['width'] !== 0 && $options['ratio'] !== 0) {
+                return (int) ($options['width'] / $options['ratio']);
             }
             return 0;
         });

diff --git a/src/Roadiz/Utils/MediaFinders/AbstractDeezerEmbedFinder.php b/src/Roadiz/Utils/MediaFinders/AbstractDeezerEmbedFinder.php
@@ -150,10 +150,10 @@ public function getSource(array &$options = []): string
             'id' => $this->embedId
         ];
 
-        if ($options['autoplay']) {
+        if (key_exists('autoplay', $queryString)) {
             $queryString['autoplay'] = ((bool) $options['autoplay']) ? ('true') : ('false');
         }
-        if ($options['playlist']) {
+        if (key_exists('playlist', $queryString)) {
             $queryString['playlist'] = ((bool) $options['playlist']) ? ('true') : ('false');
         }
         if (null !== $options['color']) {

diff --git a/tests/Roadiz/Document/Renderer/ImageRenderer.php b/tests/Roadiz/Document/Renderer/ImageRenderer.php
@@ -159,6 +159,7 @@ class="lazyload" />
             ->isEqualTo($this->htmlTidy(<<<EOT
 <img alt="file.jpg"
      src="/assets/f600x400-q70/folder/file.jpg"
+     data-ratio="1.5"
      width="600"
      height="400" />
 EOT
@@ -251,7 +252,8 @@ class="awesome-image responsive" />
 <img alt="file.jpg"
      src="/assets/f600x400-q90/folder/file.jpg"
      srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-     sizes="(max-width: 767px) 300px, (min-width: 768px) 400px" />
+     sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
+     data-ratio="1.5" />
 EOT
             ))
 
@@ -279,7 +281,8 @@ class="awesome-image responsive" />
      src="/assets/f600x400-q90/folder/file.jpg"
      srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
      sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
-     loading="lazy" />
+     loading="lazy"
+     data-ratio="1.5" />
 EOT
             ))
             ->string($this->htmlTidy($renderer->render($mockDocument, [
@@ -308,12 +311,14 @@ class="awesome-image responsive" />
      src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNcvGDBfwAGtQLk4581vAAAAABJRU5ErkJggg=="
      data-srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
      sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
+     data-ratio="1.5"
      class="lazyload" />
 <noscript>
     <img alt="file.jpg"
          src="/assets/f600x400-q90/folder/file.jpg"
          srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-         sizes="(max-width: 767px) 300px, (min-width: 768px) 400px" />
+         sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
+         data-ratio="1.5" />
 </noscript>
 EOT
             ))
@@ -345,13 +350,15 @@ class="lazyload" />
      data-srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
      sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
      loading="lazy"
+     data-ratio="1.5"
      class="lazyload" />
 <noscript>
     <img alt="file.jpg"
          src="/assets/f600x400-q90/folder/file.jpg"
          srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
          sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
-         loading="lazy" />
+         loading="lazy"
+         data-ratio="1.5" />
 </noscript>
 EOT
             ))

diff --git a/tests/Roadiz/Document/Renderer/PictureRenderer.php b/tests/Roadiz/Document/Renderer/PictureRenderer.php
@@ -407,7 +407,8 @@ class="awesome-image responsive" />
     <img alt="file.jpg"
         src="/assets/f600x400-q90/folder/file.jpg"
         srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-        sizes="(max-width: 767px) 300px, (min-width: 768px) 400px" />
+        sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
+        data-ratio="1.5" />
 </picture>
 EOT
             ))
@@ -444,7 +445,8 @@ class="awesome-image responsive" />
         src="/assets/f600x400-q90/folder/file.jpg"
         srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
         sizes="(max-width: 767px) 300px, (min-width: 768px) 400px"
-        loading="lazy" />
+        loading="lazy"
+        data-ratio="1.5" />
 </picture>
 EOT
             ))
@@ -477,7 +479,9 @@ class="awesome-image responsive" />
          data-src="/assets/f600x400-q90/folder/file.jpg"
          src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNcvGDBfwAGtQLk4581vAAAAABJRU5ErkJggg=="
          data-srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-         width="600" height="400"
+         data-ratio="1.5"
+         width="600"
+         height="400"
          class="lazyload" />
 </picture>
 <noscript>
@@ -489,7 +493,9 @@ class="lazyload" />
         <img alt="file.jpg"
              src="/assets/f600x400-q90/folder/file.jpg"
              srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-             width="600" height="400" />
+             data-ratio="1.5"
+             width="600"
+             height="400" />
     </picture>
 </noscript>
 EOT
@@ -524,7 +530,9 @@ class="lazyload" />
          data-src="/assets/f600x400-q90/folder/file.jpg"
          src="https://test.test/fallback.png"
          data-srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
-         width="600" height="400"
+         data-ratio="1.5"
+         width="600"
+         height="400"
          class="lazyload" />
 </picture>
 <noscript>
@@ -536,6 +544,7 @@ class="lazyload" />
         <img alt="file.jpg"
             src="/assets/f600x400-q90/folder/file.jpg"
             srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x"
+            data-ratio="1.5"
             width="600"
             height="400" />
     </picture>
@@ -570,7 +579,9 @@ class="lazyload" />
             srcset="/assets/f600x400-q90/folder/file.jpg 1x, /assets/f1200x800-q90/folder/file.jpg 2x">
     <img alt="file.jpg"
          src="/assets/f600x400-q90/folder/file.jpg"
-         width="600" height="400" />
+         data-ratio="1.5"
+         width="600"
+         height="400" />
 </picture>
 EOT
             ))
@@ -623,7 +634,9 @@ class="lazyload" />
 
     <img alt="file.jpg"
          src="/assets/f600x400-q90/folder/file.jpg"
-         width="600" height="400" />
+         data-ratio="1.5"
+         width="600"
+         height="400" />
 </picture>
 EOT
             ))
@@ -678,7 +691,9 @@ class="lazyload" />
     <img alt="file.jpg"
          src="/assets/f600x400-q90/folder/file.jpg"
          loading="lazy"
-         width="600" height="400" />
+         data-ratio="1.5"
+         width="600"
+         height="400" />
 </picture>
 EOT
             ))
@@ -730,7 +745,9 @@ class="lazyload" />
     <img alt="file.webp"
          data-src="/assets/f600x400-q90/folder/file.webp"
          src="FALLBACK"
-         width="600" height="400"
+         data-ratio="1.5"
+         width="600"
+         height="400"
          class="lazyload" />
 </picture>
 <noscript>
@@ -745,7 +762,9 @@ class="lazyload" />
 
         <img alt="file.webp"
              src="/assets/f600x400-q90/folder/file.webp"
-             width="600" height="400" />
+             data-ratio="1.5"
+             width="600"
+             height="400" />
     </picture>
 </noscript>
 EOT
@@ -800,7 +819,9 @@ class="lazyload" />
          data-src="/assets/f600x400-q90/folder/file.webp"
          src="FALLBACK"
          loading="lazy"
-         width="600" height="400"
+         data-ratio="1.5"
+         width="600"
+         height="400"
          class="lazyload" />
 </picture>
 <noscript>
@@ -816,7 +837,9 @@ class="lazyload" />
         <img alt="file.webp"
              src="/assets/f600x400-q90/folder/file.webp"
              loading="lazy"
-             width="600" height="400" />
+             data-ratio="1.5"
+             width="600"
+             height="400" />
     </picture>
 </noscript>
 EOT