feat(video): add loop on video element

Author: maximehuran

src/Form/Type/UiElement/VideoType.php

@@ -64,6 +64,10 @@ public function addFields(FormBuilderInterface $builder, array $options): void
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.video.field.autoplay',
                 'required' => false,
             ])
+            ->add('loop', CheckboxType::class, [
+                'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.video.field.loop',
+                'required' => false,
+            ])
         ;
     }
 

src/Resources/translations/messages.en.yml

@@ -69,6 +69,7 @@ monsieurbiz_richeditor_plugin:
         image: 'Background image'
         controls: 'Show controls'
         autoplay: 'Autoplay (without sound)'
+        loop: 'Loop'
     monsieurbiz.separator:
       title: 'Separator'
       short_description: 'A separator'

src/Resources/translations/messages.fr.yml

@@ -69,6 +69,7 @@ monsieurbiz_richeditor_plugin:
         image: 'Image de fond'
         controls: 'Afficher les contrôles'
         autoplay: 'Lancer automatiquement la vidéo (sans le son)'
+        loop: 'Jouer en boucle'
     monsieurbiz.separator:
       title: 'Séparateur'
       short_description: 'Une lame permettant de faire séparateur'

src/Resources/views/Admin/UiElement/video.html.twig

@@ -7,6 +7,7 @@
         align
         autoplay
         controls
+        loop
 #}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'inherit' %}
 {% if monsieurbiz_richeditor_file_extension_media_manager_exists() %}
@@ -20,6 +21,7 @@
 {% set image = element.image|default('') %}
 {% set controls = element.controls is defined ? element.controls : true %}
 {% set autoplay = element.autoplay is defined ? element.autoplay : false %}
+{% set loop = element.loop is defined ? element.loop : false %}
 <div style="text-align: {{align}};">
     <video
         width="100%"
@@ -33,6 +35,9 @@
             autoplay
             muted
         {% endif %}
+        {% if loop %}
+            loop
+        {% endif %}
     >
         <source src="{{ videoSrc }}" type="video/{{ element.video|split('.')|last }}">
     </video>

src/Resources/views/Shop/UiElement/video.html.twig

@@ -7,6 +7,7 @@
         align
         autoplay
         controls
+        loop
 #}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'inherit' %}
 {% if monsieurbiz_richeditor_file_extension_media_manager_exists() %}
@@ -33,6 +34,9 @@
             autoplay
             muted
         {% endif %}
+        {% if loop %}
+            loop
+        {% endif %}
     >
         <source src="{{ videoSrc }}" type="video/{{ element.video|split('.')|last }}">
     </video>