Merge branch 'feature/pirati-cz' into feature/pirati-cz-dan

.isort.cfg

@@ -3,4 +3,4 @@
 line_length = 88
 multi_line_output = 3
 include_trailing_comma = true
-known_third_party = PyPDF2,arrow,bleach,bs4,captcha,celery,django,environ,faker,fastjsonschema,icalevnt,markdown,modelcluster,pirates,pytest,pytz,requests,sentry_sdk,taggit,tweepy,wagtail,wagtailmetadata,weasyprint,yaml,zoneinfo
+known_third_party = PyPDF2,arrow,bleach,bs4,captcha,celery,django,environ,faker,fastjsonschema,icalevnt,markdown,modelcluster,pirates,pytest,pytz,requests,sentry_sdk,taggit,tweepy,wagtail,wagtailmetadata,weasyprint,yaml

.pre-commit-config.yaml

 default_language_version:
-  python: python3.8
+  python: python3.9
 
 exclude: snapshots/
 repos:

main/models.py

@@ -180,39 +180,41 @@ class MainHomePage(MenuMixin, ExtendedMetadataHomePageMixin, MetadataPageMixin,
     def get_region_response(self, request):
         last_month = timezone.now().today().replace(day=1) - timedelta(days=1)
         first_day_of_last_month = last_month.replace(day=1)
-        if request.GET.get('region', None) == 'VSK':
+        if request.GET.get("region", None) == "VSK":
             sorted_article_qs = MainArticlePage.objects.filter(
                 date__gt=first_day_of_last_month
             ).order_by("-date")
         else:
             sorted_article_qs = MainArticlePage.objects.filter(
-                date__gt=first_day_of_last_month, region=request.GET.get('region', None)
+                date__gt=first_day_of_last_month, region=request.GET.get("region", None)
             ).order_by("-date")
-        context = {
-            "article_data_list": sorted_article_qs[:3]
-        }
+        context = {"article_data_list": sorted_article_qs[:3]}
         data = {
-            'html': render(request, 'main/includes/small_article_preview.html', context).content.decode("utf-8")
+            "html": render(
+                request, "main/includes/small_article_preview.html", context
+            ).content.decode("utf-8")
         }
         return JsonResponse(data=data, safe=False)
 
     def get_twitter_response(self, request):
-        tweet_paginator = Paginator(Tweet.objects.order_by("-twitter_id"), self.max_items)
-        tweet_page = tweet_paginator.get_page(request.GET.get('page', 1))
-        context = {
-            "tweet_list": tweet_page.object_list
-        }
-        html_content = render(request, 'main/includes/twitter_widget.html', context).content
+        tweet_paginator = Paginator(
+            Tweet.objects.order_by("-twitter_id"), self.max_items
+        )
+        tweet_page = tweet_paginator.get_page(request.GET.get("page", 1))
+        context = {"tweet_list": tweet_page.object_list}
+        html_content = render(
+            request, "main/includes/twitter_widget.html", context
+        ).content
         data = {
-            'html': html_content.decode("utf-8"),
-            'last_page': tweet_page.paginator.num_pages,
+            "html": html_content.decode("utf-8"),
+            "last_page": tweet_page.paginator.num_pages,
         }
         return JsonResponse(data=data, safe=False)
 
     def serve(self, request, *args, **kwargs):
-        if not request.META.get('HTTP_X_REQUESTED_WITH') == 'XMLHttpRequest':
+        if not request.META.get("HTTP_X_REQUESTED_WITH") == "XMLHttpRequest":
             return super().serve(request, *args, **kwargs)
-        if 'region' in request.GET:
+        if "region" in request.GET:
             return self.get_region_response(request)
         else:
             return self.get_twitter_response(request)
@@ -310,7 +312,7 @@ class MainArticlesPage(
             first_day_of_last_month = last_month.replace(day=1)
 
         sorted_article_qs = MainArticlePage.objects.filter(
-            date__gt=first_day_of_last_month
+            date__gt=first_day_of_last_month, article_type=ARTICLE_TYPES.WORK_TIMELINE
         ).order_by("-date")
 
         article_data_list = []
@@ -334,26 +336,56 @@ class MainArticlesPage(
 
     def get_context(self, request, *args, **kwargs):
         ctx = super().get_context(request, args, kwargs)
-        article_list = self.get_article_data_list(1)
-        ctx["article_data_list"] = article_list
-        ctx["show_next_articles"] = MainArticlePage.objects.count() > len(article_list)
+        article_timeline_list = self.get_article_data_list(1)
+        ctx["article_timeline_list"] = article_timeline_list
+        ctx["show_next_timeline_articles"] = MainArticlePage.objects.filter(
+            article_type=ARTICLE_TYPES.WORK_TIMELINE
+        ).count() > len(article_timeline_list)
+        article_list = MainArticlePage.objects.filter(
+            article_type=ARTICLE_TYPES.PRESS_RELEASE
+        ).order_by("-date")
+        ctx["article_article_list"] = article_list[:10]
+        ctx["show_next_article"] = len(article_list) > 4
         return ctx
 
-    def get_articles_response(self, request):
-        article_list = self.get_article_data_list(int(request.GET.get('months', None)))
-        context = {
-            "article_data_list": article_list
+    def get_timeline_articles_response(self, request):
+        article_list = self.get_article_data_list(int(request.GET.get("months", None)))
+        context = {"article_data_list": article_list}
+        data = {
+            "html": render(
+                request, "main/blocks/articles_timeline_block.html", context
+            ).content.decode("utf-8"),
+            "last_article": article_list[-1]
+            == MainArticlePage.objects.filter(article_type=ARTICLE_TYPES.WORK_TIMELINE)
+            .order_by("-date")
+            .last(),
         }
+        return JsonResponse(data=data, safe=False)
+
+    def get_articles_response(self, request):
+        article_paginator = Paginator(
+            MainArticlePage.objects.filter(
+                article_type=ARTICLE_TYPES.PRESS_RELEASE
+            ).order_by("-date", "title"),
+            10,
+        )
+        article_page = article_paginator.get_page(request.GET.get("page", 1))
+        context = {"article_data_list": article_page.object_list}
+        html_content = render(
+            request, "main/includes/person_article_preview.html", context
+        ).content
         data = {
-            'html': render(request, 'main/blocks/articles_block.html', context).content.decode("utf-8"),
-            'last_article': article_list[-1] == MainArticlePage.objects.all().order_by('-date').last()
+            "html": html_content.decode("utf-8"),
+            "last_page": article_page.paginator.num_pages,
         }
         return JsonResponse(data=data, safe=False)
 
     def serve(self, request, *args, **kwargs):
-        if not request.META.get('HTTP_X_REQUESTED_WITH') == 'XMLHttpRequest':
+        if not request.META.get("HTTP_X_REQUESTED_WITH") == "XMLHttpRequest":
             return super().serve(request, *args, **kwargs)
-        if 'months' in request.GET:
+        if "months" in request.GET:
+            return self.get_timeline_articles_response(request)
+        if "page" in request.GET:
             return self.get_articles_response(request)
 
     @staticmethod
@@ -507,7 +539,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
         blank=True,
         null=True,
         verbose_name="Hlavní obrázek",
-        related_name="+"
+        related_name="+",
     )
 
     profile_image = models.ForeignKey(
@@ -516,7 +548,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
         blank=True,
         null=True,
         verbose_name="Profilový obrázek",
-        related_name="+"
+        related_name="+",
     )
     before_name = models.CharField(
         "Tituly před jménem", max_length=32, blank=True, null=True
@@ -535,7 +567,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
         blank=True,
         null=True,
         max_length=32,
-        help_text="Uživatelské jméno zadejte bez @ na začátku"
+        help_text="Uživatelské jméno zadejte bez @ na začátku",
     )
 
     social_links = StreamField(
@@ -622,7 +654,7 @@ class MainContactPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin
     text = StreamField(
         [("two_columns_text", blocks.TwoTextColumnBlock())],
         verbose_name="Kontaktní informace",
-        blank=True
+        blank=True,
     )
 
     ### PANELS

main/styleguide/source/_patterns/templates/how-we-works.mustache

@@ -20,6 +20,7 @@
                       v-slot="{ isCurrentView, toggleView }">
       <div class="grid-container article-section mb-8">
         <div class="grid-full">
+          <div class="flex justify-center">
             <div class="switch">
               <a @click="toggleView('timeline')" class="switch__item"
                  :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
@@ -27,6 +28,7 @@
                  :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
             </div>
           </div>
+      </div>
       </div>
         <template v-if="isCurrentView('timeline')">
           <div class="mt-10 md:mt-20">

main/styleguide/source/css/molecules/switch.pcss

 .switch {
-  @apply py-5 justify-center;
+  @apply py-5;
 }
 
 .switch__item {

main/styleguide/source/css/organisms/footer.pcss

@@ -25,19 +25,18 @@
 .footer__main-links {
   grid-area: main-links;
 
-  .footer__main--link {
-    @apply mt-6 w-fit xl:mr-2
-  }
-
   ul {
-    display: grid;
-    grid-auto-columns: minmax(160px, auto);
-    grid-auto-flow: column;
-    grid-gap: 10px;
-    grid-template-rows: repeat(12, 40px);
+    display: flex;
+    flex-flow: row wrap;
+    max-height: 320px;
+    writing-mode: vertical-lr; /* workaround for long-living bug https://stackoverflow.com/a/39102894/7113416 */
 
-    @screen sm {
-      grid-template-rows: repeat(6, 40px);
+    li {
+      display: block;
+      height: 40px;
+      line-height: 40px;
+      min-width: 150px;
+      writing-mode: initial; /* workaround revert from above */
     }
   }
 }

main/templates/main/blocks/articles_block.html

-{% for month_article_data in article_data_list %}
-  <div class="mb-4">
-    <h3 class="head-7xl mb-4 xl:hidden">
-      {{ month_article_data.month_text }}
-    </h3>
-    <div class="flex flex-col justify-between xl:flex-row">
-      <div class="xl:pt-8">
-        {% for article_page in month_article_data.left_column %}
-          {% include 'main/includes/work_article_preview.html' %}
-        {% empty %}
-          <div class="p-7 flex flex-col max-w-xl mb-8" />
-        {% endfor %}
-      </div>
-      <div class="relative border border-violet-400 mx-8 hidden xl:block">
-        <div class="absolute bg-violet-400 p-1 text-white font-bold" style="transform: translateX(-50%); top: -1rem">
-          {{ month_article_data.month_text }}
-        </div>
-      </div>
-      <div class="xl:pt-14">
-        {% for article_page in month_article_data.right_column %}
-          {% include 'main/includes/work_article_preview.html' %}
-        {% empty %}
-          <div class="p-7 flex flex-col max-w-xl mb-8" />
-        {% endfor %}
-      </div>
-    </div>
-  </div>
-{% endfor %}
\ No newline at end of file

main/templates/main/blocks/articles_timeline_block.html

+{% for month_article_data in article_data_list %}
+    <div class="mb-4">
+        <h2 class="head-4xl mb-5 xl:hidden">
+            {{ month_article_data.month_text }}
+        </h2>
+        <div class="article-timeline-grid justify-between">
+            <div class="article-timeline-grid__left-article xl:pt-8">
+                {% for article_page in month_article_data.left_column %}
+                    {% include 'main/includes/work_article_preview.html' %}
+                {% empty %}
+                    <div class="p-7 flex flex-col max-w-xl mb-8"/>
+                {% endfor %}
+            </div>
+            <div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
+                <div class="article-timeline--month absolute bg-violet-400  p-1 text-white font-bold">
+                    {{ month_article_data.month_text }}
+
+                </div>
+            </div>
+            <div class="article-timeline-grid__right-article xl:pt-14">
+                {% for article_page in month_article_data.right_column %}
+                    {% include 'main/includes/work_article_preview.html' %}
+                {% empty %}
+                    <div class="p-7 flex flex-col max-w-xl mb-8"/>
+                {% endfor %}
+            </div>
+        </div>
+    </div>
+{% endfor %}
\ No newline at end of file

main/templates/main/includes/person_article_preview.html

+{% for article_page in article_data_list %}
+    <div class="flex flex-col justify-between items-start mb-9">
+      <div class="flex font-bold mb-4 text-xs text-white uppercase">
+        <span class="bg-green-500 mr-1 px-1">Duben 2022</span>
+        <span class="bg-violet-600 mr-1 px-1">#ENERGETIKA</span>
+      </div>
+      <h4 class="head-3xl mb-4">
+        {{ article_page.title }}
+      </h4>
+      <p class="mb-6">
+        {{ article_page.perex }}
+      </p>
+        {% include 'main/includes/button_animated.html' with btn_link=article_page.url btn_text="Číst dále" %}
+    </div>
+{% endfor %}

main/templates/main/main_articles_page.html

@@ -15,16 +15,32 @@
                 </h2>
             </div>
         </div>
-
+        <div class="__js-root">
+            <ui-view-provider :initial="{timeline: true, articles: false}" :sync-location="true"
+                              v-slot="{ isCurrentView, toggleView }">
+                <div class="grid-container article-section mb-8">
+                    <div class="grid-full">
+                        <div class="flex justify-center">
+                            <div class="switch">
+                                <a @click="toggleView('timeline')" class="switch__item"
+                                   :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
+                                <a @click="toggleView('articles')" class="switch__item"
+                                   :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <template v-if="isCurrentView('timeline')">
+                    <div class="mt-20">
                         <div class="grid-container article-section">
                             <div class="grid-full mb-8">
-        <div id="searchResultWrapper">
-          {% include 'main/blocks/articles_block.html' with article_data_list=article_data_list %}
+                                <div id="showMoreTimelineResultsWrapper">
+                                    {% include 'main/blocks/articles_timeline_block.html' with article_data_list=article_timeline_list %}
                                 </div>
-        {% if show_next_articles %}
-          <div class="text-center">
+                            </div>
+                            <div class="flex justify-center">
                                 <a
-              onclick="showMoreArticles(event, this)"
+                                        onclick="showMoreTimelineArticles(event, this)"
                                         href="#"
                                         data-url="{{ page_url }}?months="
                                         data-months="2"
@@ -39,16 +55,47 @@
                                 </a>
                             </div>
                         </div>
-
-        {% endif %}
+                    </div>
+                </template>
+                <template v-if="isCurrentView('articles')">
+                    <section class="grid-container mb-3 justify-start xl:mb-14">
+                        <div class="grid-content-with-right-side">
+                            <div class="leading-6">
+                                <h2 class="head-4xl mb-5 xl:hidden">
+                                    Články
+                                </h2>
+                                <div id="searchArticleResultWrapper">
+                                    {% include 'main/includes/person_article_preview.html' with article_data_list=article_article_list %}
+                                </div>
+                                <div class="flex justify-center">
+                                    <a
+                                            onclick="showMoreArticles(event, this)"
+                                            href="#"
+                                            data-url="{{ page_url }}?page="
+                                            data-page="2"
+                                            class="btn btn__slide__wrap"
+                                    >
+                                          <span class="btn text-sm bg-black text-white w-32 lg:text-base">
+                                            Zobrazit další
+                                          </span>
+                                        <span class="btn text-sm bg-white text-black w-32 lg:text-base">
+                                            Zobrazit další
+                                          </span>
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
+                    </section>
+                </template>
+            </ui-view-provider>
         </div>
     </main>
 
     <script type="text/javascript">
-    async function showMoreArticles(event, btn) {
+        async function showMoreTimelineArticles(event, btn) {
             event.preventDefault()
 
-      const searchResultWrapper = document.getElementById('searchResultWrapper')
+            const showMoreTimelineResultsWrapper = document.getElementById('showMoreTimelineResultsWrapper')
             const url = btn.getAttribute('data-url') + btn.getAttribute('data-months')
 
             const response = await fetch(url, {
@@ -56,11 +103,25 @@
                 headers: {"X-Requested-With": "XMLHttpRequest"},
             })
             const data = await response.json()
+            showMoreTimelineResultsWrapper.innerHTML = data.html
+            btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
+        }
 
-      if (data.last_article) { btn.hide() }
+        async function showMoreArticles(event, btn) {
+            event.preventDefault()
 
-      searchResultWrapper.innerHTML = data.html
-      btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
+            let searchArticleResultWrapper = document.getElementById('searchArticleResultWrapper');
+            let url = btn.getAttribute('data-url') + btn.getAttribute('data-page')
+
+            const response = await fetch(url, {
+                method: "GET",
+                headers: {"X-Requested-With": "XMLHttpRequest"},
+            })
+            const data = await response.json()
+            searchArticleResultWrapper.innerHTML += data.html;
+            if (btn.getAttribute('data-page') === data.last_page)
+                btn.hide();
+            btn.setAttribute('data-page', parseInt(btn.getAttribute('data-page')) + 1)
         }
     </script>
 {% endblock content %}