Merge pull request #988 from noesya/block-feature

Bloc "fonctionnalités"

app/models/communication/block.rb

@@ -41,12 +41,19 @@ class Communication::Block < ApplicationRecord
   # template_blobs would be a better name, because there are files
   has_many_attached :template_images
 
+  # Les numéros sont un peu en vrac
+  # Dans l'idée, pour le futur
+  # 1000 basic
+  # 2000 storytelling
+  # 3000 references
+  # 4000 utilities
   enum template_kind: {
     chapter: 50,
     image: 51,
     gallery: 300,
     video: 52,
     key_figures: 56,
+    features: 2010,
     datatable: 54,
     files: 55,
     embed: 53,
@@ -64,7 +71,7 @@ class Communication::Block < ApplicationRecord
 
   CATEGORIES = {
     basic: [:chapter, :image, :video, :datatable],
-    storytelling: [:key_figures, :gallery, :call_to_action, :testimonials, :timeline],
+    storytelling: [:key_figures, :features, :gallery, :call_to_action, :testimonials, :timeline],
     references: [:pages, :posts, :organization_chart, :partners, :programs],
     utilities: [:files, :definitions, :embed, :contact]
   }

app/models/communication/block/template/feature.rb

+class Communication::Block::Template::Feature < Communication::Block::Template::Base
+
+  has_elements
+  has_component :description, :rich_text
+
+end

app/models/communication/block/template/feature/element.rb

+class Communication::Block::Template::Feature::Element < Communication::Block::Template::Base
+
+  has_component :title, :string
+  has_component :description, :text
+  has_component :image, :image
+  has_component :alt, :string
+  has_component :credit, :rich_text
+
+end

app/views/admin/communication/blocks/templates/features/_edit.html.erb

+<div class="row pure__row--small">
+  <div class="col-xl-6">
+    <%= block_component_edit :description %>
+  </div>
+</div>
+
+<%= block_component_add_element t('.add_element') %>
+<draggable :list="data.elements" handle=".dragHandle" class="mb-3 <%= if_appstack 'list-group' %>">
+  <div v-for="(element, index) in data.elements" class="draggable-item <%= if_appstack 'list-group-item' %>">
+    <div>
+      <a class="btn ps-0 pt-0 dragHandle"><i class="<%= Icon::DRAG %> handle"></i></a>{{element.title}}
+      <a  class="btn btn-sm text-danger float-end pe-0"
+          v-on:click="data.elements.splice(data.elements.indexOf(element), 1)"
+          title="<%= t '.remove_element' %>">
+          <i class="<%= Icon::DELETE %>"></i>
+      </a>
+    </div>
+    <div class="row pure__row--small">
+      <div class="col-lg-4">
+        <%= block_component_edit :title, template: @element %>
+        <%= block_component_edit :description, template: @element, rows: 5 %>
+      </div>
+      <div class="col-lg-4">
+        <%= block_component_edit :image, template: @element %>
+      </div>
+      <div class="col-lg-4" v-show="element.image.id != ''">
+        <%= block_component_edit :alt, template: @element %>
+        <%= block_component_edit :credit, template: @element %>
+      </div>
+    </div>
+  </div>
+</draggable>
+<div v-show="data.elements.length > 2">
+  <%= block_component_add_element t('.add_element') %>
+</div>
\ No newline at end of file

app/views/admin/communication/blocks/templates/features/_static.html.erb

+<%= block_component_static :description %>
+      elements:
+<% block.template.elements.each do |element| %>
+<%= block_component_static :title, template: element, list: true, depth: 4 %>
+<%= block_component_static :description, template: element, depth: 5 %>
+<%= block_component_static :image, template: element, depth: 5 %>
+<%= block_component_static :alt, template: element, depth: 5 %>
+<%= block_component_static :credit, template: element, depth: 5 %>
+<% end %>

config/locales/communication/en.yml

@@ -361,6 +361,27 @@ en:
                 label: Iframe title (mandatory for accessibility)
                 placeholder: Enter the title
               warning: Beware, the code below is used as is, without any security filtering. Be extremely careful and never integrate possibly unreliable code.
+          features:
+            description: A list of features with images (often icons) and a description.
+            edit:
+              add_element: Add feature
+              remove_element: Remove feature
+              element:
+                image:
+                  label: Image (.png, .jpg, .svg)
+                  remove: Remove image
+                alt:
+                  label: Alternative text
+                  placeholder: Enter text description
+                credit:
+                  label: Credit
+                  placeholder: Enter image's credit here
+                title:
+                  label: Title
+                  placeholder: Enter title here
+                description:
+                  label: Text
+                  placeholder: Enter text here
           files:
             description: A list of downloadable files, mentioning their file size.
             edit:
@@ -706,6 +727,7 @@ en:
           datatable: Table
           definitions: Definitions
           embed: HTML embed
+          features: Features
           files: Files
           gallery: Gallery
           image: Image

config/locales/communication/fr.yml

@@ -361,6 +361,27 @@ fr:
                 label: Titre de l'iframe (nécessaire pour l'accessibilité)
                 placeholder: Entrer le titre
               warning: Attention, le code ci-dessous est intégré tel quel, sans filtrage de sécurité. N'intégrez jamais de code externe dont la fiabilité n'est pas certaine.
+          features:
+            description: Une liste de fonctionnalités avec des images, par exemple des icônes, et une description.
+            edit:
+              add_element: Ajouter une fonctionnalité
+              remove_element: Supprimer la fonctionnalité
+              element:
+                image:
+                  label: Image (.png, .jpg, .svg)
+                  remove: Enlever l'image
+                alt:
+                  label: Texte alternatif
+                  placeholder: Entrer la description textuelle
+                credit:
+                  label: Crédit
+                  placeholder: Entrer le crédit de l'image ici
+                title:
+                  label: Titre
+                  placeholder: Entrer le titre de la fonctionnalité
+                description:
+                  label: Texte
+                  placeholder: Entrer la description de la fonctionnalité
           files:
             description: Une liste de fichiers téléchargeables, présentés avec leur poids.
             edit:
@@ -706,6 +727,7 @@ fr:
           datatable: Tableau
           definitions: Définitions
           embed: Intégration HTML
+          features: Fonctionnalités
           files: Fichiers
           gallery: Galerie
           image: Image