academy/models.py & /blocks.py & block_topic_teaser.html & _blocks.scss

liqd · Aug 25, 2022 · a1ef7d8 · a1ef7d8
1 parent 41be358
commit a1ef7d8
Show file tree

Hide file tree

Showing 6 changed files with 135 additions and 14 deletions.
diff --git a/apps/academy/blocks.py b/apps/academy/blocks.py
@@ -1,7 +1,11 @@
-from wagtail.blocks import (CharBlock, ListBlock, PageChooserBlock,
-                            RichTextBlock, StructBlock, TextBlock, URLBlock)
+from django.template.defaulttags import register
+from wagtail.blocks import (CharBlock, ChoiceBlock, ListBlock,
+                            PageChooserBlock, RichTextBlock, StructBlock,
+                            TextBlock, URLBlock)
 from wagtail.images.blocks import ImageChooserBlock
 
+from apps.academy.choices import TOPIC_CHOICES
+
 
 class ChallengeStepBlock(StructBlock):
     challenge_step_title = CharBlock()
@@ -82,3 +86,37 @@ class Meta:
         icon = 'plus-inverse'
         help_text = 'Add 1 or 2 column teaser with black '
         'background and white writing'
+
+
+class TopicBlock(StructBlock):
+    topic_category = ChoiceBlock(
+        choices=TOPIC_CHOICES,
+        required=True,
+        help_text='Select a topic'
+    )
+    topic_text = CharBlock(required=True, max_length=110)
+    topic_link_text = CharBlock(required=True, max_length=40)
+
+
+class TopicBlockList(StructBlock):
+    title = CharBlock(required=True, max_length=74)
+    topics = ListBlock(TopicBlock(), min_num=3, max_num=3)
+    topic_url = PageChooserBlock(
+        required=True,
+        page_type='academy.AcademyIndexPage'
+    )
+
+    def get_context(self, value, parent_context=None):
+        context = super().get_context(value, parent_context=parent_context)
+        context['topics_dict'] = dict(TOPIC_CHOICES)
+        return context
+
+    class Meta:
+        template = 'academy/blocks/block_topic_teaser.html'
+        icon = 'grip'
+        label = '3 topic teasers'
+
+
+@register.filter
+def get_category_name(dict, key):
+    return dict.get(key)
diff --git a/apps/academy/choices.py b/apps/academy/choices.py
@@ -0,0 +1,11 @@
+from django.utils.translation import gettext_lazy as _
+
+LIQDTHEORY = 'LT'
+DIGITALCIVICSOCIETY = 'DS'
+PARTICIPATIONACTION = 'PA'
+
+TOPIC_CHOICES = [
+    (LIQDTHEORY, _('Liquid Democracy: Theory & Vision')),
+    (DIGITALCIVICSOCIETY, _('Digital Civic Society')),
+    (PARTICIPATIONACTION, _('Digital Participation In Action'))
+]
diff --git a/apps/academy/migrations/0013_add_topic_block_to_landing_page.py b/apps/academy/migrations/0013_add_topic_block_to_landing_page.py
@@ -0,0 +1,26 @@
+# Generated by Django 3.2.13 on 2022-08-25 09:26
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+import wagtail.images.blocks
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('academy', '0012_fix_max_length'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='academylandingpage',
+            name='body_de',
+            field=wagtail.fields.StreamField([('single_teaser', wagtail.blocks.StructBlock([('category', wagtail.blocks.CharBlock(max_length=32, required=False)), ('headline', wagtail.blocks.CharBlock(max_length=74, required=True)), ('body_text', wagtail.blocks.TextBlock(max_length=164, required=True)), ('link', wagtail.blocks.PageChooserBlock(help_text='Please only add either an internal or external link', required=False)), ('external_link', wagtail.blocks.URLBlock(help_text='The external link overwrites the link to a local page.', label='External Link', required=False)), ('link_text', wagtail.blocks.CharBlock(max_length=24, required=True)), ('image', wagtail.images.blocks.ImageChooserBlock(required=True))])), ('call_to_action_teaser', wagtail.blocks.StructBlock([('columns', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('headline', wagtail.blocks.CharBlock(max_length=28, required=True)), ('image', wagtail.images.blocks.ImageChooserBlock(help_text='Please add image with transparent background', required=True)), ('body_text', wagtail.blocks.TextBlock(max_length=120, required=True)), ('cta_link', wagtail.blocks.StructBlock([('internal_link', wagtail.blocks.PageChooserBlock(help_text='The external link overwrites the link to a local page. Please only add 1 link.', required=False)), ('external_link', wagtail.blocks.URLBlock(required=False))])), ('link_text', wagtail.blocks.CharBlock(label='Link Text', max_length=28, required=False)), ('anchor_link', wagtail.blocks.CharBlock(help_text='Anchor link should be all one word.', label='Anchor Link', max_length=28, required=False))], label='List and Image'), max_num=2))])), ('topic_block_list', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(max_length=74, required=True)), ('topics', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('topic_category', wagtail.blocks.ChoiceBlock(choices=[('LT', 'Liquid Democracy: Theory & Vision'), ('DS', 'Digital Civic Society'), ('PA', 'Digital Participation In Action')], help_text='Select a topic')), ('topic_text', wagtail.blocks.CharBlock(max_length=110, required=True)), ('topic_link_text', wagtail.blocks.CharBlock(max_length=40, required=True))]), max_num=3, min_num=3)), ('topic_url', wagtail.blocks.PageChooserBlock(page_type=['academy.AcademyIndexPage'], required=True))]))], blank=True, null=True, use_json_field=True, verbose_name='Body'),
+        ),
+        migrations.AlterField(
+            model_name='academylandingpage',
+            name='body_en',
+            field=wagtail.fields.StreamField([('single_teaser', wagtail.blocks.StructBlock([('category', wagtail.blocks.CharBlock(max_length=32, required=False)), ('headline', wagtail.blocks.CharBlock(max_length=74, required=True)), ('body_text', wagtail.blocks.TextBlock(max_length=164, required=True)), ('link', wagtail.blocks.PageChooserBlock(help_text='Please only add either an internal or external link', required=False)), ('external_link', wagtail.blocks.URLBlock(help_text='The external link overwrites the link to a local page.', label='External Link', required=False)), ('link_text', wagtail.blocks.CharBlock(max_length=24, required=True)), ('image', wagtail.images.blocks.ImageChooserBlock(required=True))])), ('call_to_action_teaser', wagtail.blocks.StructBlock([('columns', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('headline', wagtail.blocks.CharBlock(max_length=28, required=True)), ('image', wagtail.images.blocks.ImageChooserBlock(help_text='Please add image with transparent background', required=True)), ('body_text', wagtail.blocks.TextBlock(max_length=120, required=True)), ('cta_link', wagtail.blocks.StructBlock([('internal_link', wagtail.blocks.PageChooserBlock(help_text='The external link overwrites the link to a local page. Please only add 1 link.', required=False)), ('external_link', wagtail.blocks.URLBlock(required=False))])), ('link_text', wagtail.blocks.CharBlock(label='Link Text', max_length=28, required=False)), ('anchor_link', wagtail.blocks.CharBlock(help_text='Anchor link should be all one word.', label='Anchor Link', max_length=28, required=False))], label='List and Image'), max_num=2))])), ('topic_block_list', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(max_length=74, required=True)), ('topics', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('topic_category', wagtail.blocks.ChoiceBlock(choices=[('LT', 'Liquid Democracy: Theory & Vision'), ('DS', 'Digital Civic Society'), ('PA', 'Digital Participation In Action')], help_text='Select a topic')), ('topic_text', wagtail.blocks.CharBlock(max_length=110, required=True)), ('topic_link_text', wagtail.blocks.CharBlock(max_length=40, required=True))]), max_num=3, min_num=3)), ('topic_url', wagtail.blocks.PageChooserBlock(page_type=['academy.AcademyIndexPage'], required=True))]))], null=True, use_json_field=True, verbose_name='Body'),
+        ),
+    ]
diff --git a/apps/academy/models.py b/apps/academy/models.py
@@ -16,26 +16,18 @@
 from wcag_contrast_ratio import contrast
 
 from apps.academy.blocks import (AcademyCallToActionBlock,
-                                 AcademySingleTeaserBlock, ChallengeStepBlock)
+                                 AcademySingleTeaserBlock, ChallengeStepBlock,
+                                 TopicBlockList)
+from apps.academy.choices import TOPIC_CHOICES
 from apps.blog.models import AbstractBlogPage
 from contrib.translations.translations import TranslatedField
 
-LIQDTHEORY = 'LT'
-DIGITALCIVICSOCIETY = 'DS'
-PARTICIPATIONACTION = 'PA'
-
 VIDEO = 'VD'
 WORKSHOP = 'WS'
 LINKLIST = 'LL'
 ARTICLE = 'AR'
 EVENT = 'EV'
 
-TOPIC_CHOICES = [
-    (LIQDTHEORY, _('Liquid Democracy: Theory & Vision')),
-    (DIGITALCIVICSOCIETY, _('Digital Civic Society')),
-    (PARTICIPATIONACTION, _('Digital Participation In Action')),
-]
-
 CONTENT_TYPE_CHOICES = [
     (VIDEO, _('video')),
     (WORKSHOP, _('workshop')),
@@ -50,7 +42,8 @@
 
 STREAMFIELD_LP_BLOCKS = [
     ('single_teaser', AcademySingleTeaserBlock()),
-    ('call_to_action_teaser', AcademyCallToActionBlock())
+    ('call_to_action_teaser', AcademyCallToActionBlock()),
+    ('topic_block_list', TopicBlockList())
 ]
 
 STREAMFIELD_EXTRA_BLOCKS = [

diff --git a/apps/academy/templates/academy/blocks/block_topic_teaser.html b/apps/academy/templates/academy/blocks/block_topic_teaser.html
@@ -0,0 +1,30 @@
+{% load static wagtailimages_tags i18n %}
+
+<section class="row block" aria-label="three topic teasers">
+    <h2 class="academy-block__title">{{value.title}}</h2>
+    {% for topic in value.topics %}
+        <article class="col-md-4 col-sm-12 container">
+            <figure class="mb-4">
+                {% with 'images/'|add:topic.topic_category|add:'-topic.svg' as topic_svg %}
+                <img
+                    class="academy-block__img mx-auto"
+                    src="{% static topic_svg %}"
+                    alt="{{ topics_dict|get_category_name:topic.topic_category }}"
+                    width="70"
+                />
+                {% endwith %}
+            </figure>
+            <h3 class="academy-block__title">
+                {{ topics_dict|get_category_name:topic.topic_category }}
+            </h3>
+            <p class="academy-block__text">{{topic.topic_text}}</p>
+            <div class="academy-block__link mb-4">
+                <a
+                    href="{{ value.topic_url.url }}?topic={{ topic.topic_category }}&academy_content_type=&alphabetical="
+                >
+                    {{topic.topic_link_text}}
+                </a>
+            </div>
+        </article>
+    {% endfor %}
+</section>
diff --git a/apps/core/static/scss/_blocks.scss b/apps/core/static/scss/_blocks.scss
@@ -153,3 +153,26 @@
         }
     }
 }
+
+.academy-block__img {
+    width: 81px;
+    height: 75px;
+    object-fit: contain;
+    display: block;
+}
+
+.academy-block__title {
+    font-family: $font-family-monospace;
+    font-size: $font-size-xs;
+    text-align: center;
+    text-transform: uppercase;
+}
+
+.academy-block__text {
+    font-size: $font-size-sm;
+    text-align: center;
+}
+
+.academy-block__link {
+    text-align: center;
+}