Adds carousel text block (#11541)

* Adds carousel text block

* Changed the wrong field

* Rebase fixes

* Better template to work with

* Fix migrations

* Drop 'block' in naming conventions

* So we don't trigger a new migration

network-api/networkapi/mozfest/blocks/__init__.py

@@ -1,2 +1,3 @@
 # flake8: noqa
+from .carousel_text_block import CarouselTextBlock
 from .stats_block import StatisticsBlock

network-api/networkapi/mozfest/blocks/carousel_text_block.py

@@ -0,0 +1,19 @@
+from wagtail import blocks
+
+from networkapi.wagtailpages.pagemodels import customblocks
+
+
+class CarouselTextBlock(blocks.StructBlock):
+    heading = blocks.CharBlock(help_text="Heading for the block.", required=False)
+    text = blocks.RichTextBlock(features=["bold", "italic", "link"])
+    # Use specific link fields for the CTA on the block as opposed to the
+    # common.link_blocks.LabelledExternalLinkBlock so it can be marked as
+    # required=False.
+    link_url = blocks.URLBlock(help_text="A CTA URL for a link displayed", required=False)
+    link_label = blocks.CharBlock(help_text="Label for the CTA link.", required=False)
+    carousel_images = blocks.ListBlock(customblocks.ImageBlock(), max_num=4)
+
+    class Meta:
+        icon = "placeholder"
+        template = "fragments/blocks/carousel_text_block.html"
+        label = "Carousel and Text Block"

network-api/networkapi/mozfest/factory.py

@@ -10,7 +10,7 @@
 from networkapi.wagtailpages.factory.image_factory import ImageFactory
 from networkapi.wagtailpages.factory.signup import SignupFactory
 
-streamfield_fields = ["paragraph", "image", "spacer", "quote", "statistics", "listing"]
+streamfield_fields = ["paragraph", "image", "spacer", "quote", "carousel_and_text", "statistics", "listing"]
 
 Faker.add_provider(StreamfieldProvider)
 

network-api/networkapi/mozfest/models.py

@@ -53,6 +53,7 @@ class MozfestPrimaryPage(FoundationMetadataPageMixin, FoundationBannerInheritanc
             ("tabbed_profile_directory", customblocks.TabbedProfileDirectory()),
             ("newsletter_signup", customblocks.NewsletterSignupBlock()),
             ("statistics", mozfest_blocks.StatisticsBlock()),
+            ("carousel_and_text", mozfest_blocks.CarouselTextBlock()),
         ],
         use_json_field=True,
     )

network-api/networkapi/mozfest/templates/fragments/blocks/carousel_text_block.html

@@ -0,0 +1,26 @@
+{% load wagtailcore_tags wagtailimages_tags %}
+
+{% block block_content %}
+    <div class="tw-bg-black tw-dark tw-py-16">
+        <div class="tw-container">
+            <div class="tw-row tw-body">
+                <div>
+                    {% if self.heading %}
+                        <h2>{{ self.heading }}</h2>
+                    {% endif %}
+                    {{ self.text|richtext }}
+                    {% if self.link_url and self.link_label %}
+                        <a href="{{ self.link_url }}">{{ self.link_label }}</a>
+                    {% endif %}
+                </div>
+                <div>
+                    <ul>
+                        {% for slide in self.carousel_images %}
+                            <li><img width="auto" height="auto" src="{{ slide.image.file.url }}" alt="{{ slide.altText }}"></li>
+                        {% endfor %}
+                    </ul>
+                </div>
+            </div>
+        </div>
+    </div>
+{% endblock block_content %}

network-api/networkapi/utility/faker/streamfield_provider.py

@@ -496,6 +496,33 @@ def generate_listing_block_field():
     return generate_field("listing", {"cards": cards, "heading": heading})
 
 
+def generate_carousel_text_block_field():
+    heading = fake.sentence(nb_words=10, variable_nb_words=True)
+    text = fake.paragraph(nb_sentences=10, variable_nb_sentences=True)
+    link_url = fake.url(schemes=["https"])
+    link_label = fake.sentence(nb_words=5, variable_nb_words=True)
+
+    carousel_images = []
+
+    for n in range(4):
+        carousel_images.append(
+            {
+                "image": choice(Image.objects.all()).id,
+                "altText": " ".join(fake.words(nb=5)),
+            }
+        )
+
+    data = {
+        "heading": heading,
+        "text": text,
+        "link_url": link_url,
+        "link_label": link_label,
+        "carousel_images": carousel_images,
+    }
+
+    return generate_field("carousel_and_text", data)
+
+
 class StreamfieldProvider(BaseProvider):
     """
     A custom Faker Provider for relative image urls, for use with factory_boy
@@ -547,6 +574,7 @@ def streamfield(self, fields=None):
             "blog_newsletter_signup": generate_blog_newsletter_signup_field,
             "statistics": generate_stats_block_field,
             "listing": generate_listing_block_field,
+            "carousel_and_text": generate_carousel_text_block_field,
         }
 
         streamfield_data = []