From 845a68f96e4d33085e6734ea21a5e89a674cda17 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Fromme?= <fromme@dreipunktnull.com>
Date: Mon, 14 Mar 2022 16:59:41 +0100
Subject: [PATCH] Avoid error in case of missing image

---
 .../Private/Partials/City/Teaser.html         | 22 ++++++++++++++-----
 .../Private/Partials/Concept/Teaser.html      | 22 ++++++++++++++-----
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
index 5027fd62..309e4c66 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
@@ -9,12 +9,22 @@
                 <svg class="w-8 h-6 absolute top-0 left-0">
                     <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-flag-{city.country.code -> f:format.case(mode: 'lower')}"></use>
                 </svg>
-                <ep:lazyLoadImage image="{city.teaserImage}"
-                                  loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
-                                  class="block w-full h-full object-cover"
-                                  width="360c"
-                                  height="270c"
-                                  alt="{city.name}" />
+                <f:if condition="{city.teaserImage}">
+                    <f:then>
+                        <ep:lazyLoadImage image="{city.teaserImage}"
+                                          loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
+                                          class="block w-full h-full object-cover"
+                                          width="360c"
+                                          height="270c"
+                                          alt="{city.name}" />
+                    </f:then>
+                    <f:else>
+                        <f:image src="EXT:ep_theme/Resources/Public/images/lazy.png"
+                                 width="360c"
+                                 height="270c"
+                                 alt="{city.name}"/>
+                    </f:else>
+                </f:if>
             </div>
             <div class="flex-1 py-4 px-2 bg-white border-l border-r border-gray-200">
                 <span class="headline--3 mb-4">
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Concept/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Concept/Teaser.html
index d87a84bc..023b4d64 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Concept/Teaser.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Concept/Teaser.html
@@ -6,12 +6,22 @@
 <f:section name="Teaser">
     <a href="{f:uri.typolink(parameter: concept.detailPage)}" title="{concept.name}" class="flex flex-col">
         <div class="relative">
-            <ep:lazyLoadImage image="{concept.teaserImage}"
-                              loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
-                              class="block w-full h-full object-cover"
-                              width="360c"
-                              height="270c"
-                              alt="{concept.name}" />
+            <f:if condition="{concept.teaserImage}">
+                <f:then>
+                    <ep:lazyLoadImage image="{concept.teaserImage}"
+                                      loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
+                                      class="block w-full h-full object-cover"
+                                      width="360c"
+                                      height="270c"
+                                      alt="{concept.name}" />
+                </f:then>
+                <f:else>
+                    <f:image src="EXT:ep_theme/Resources/Public/images/lazy.png"
+                             width="360c"
+                             height="270c"
+                             alt="{concept.name}"/>
+                </f:else>
+            </f:if>
             <div class="absolute top-0 left-0 inset-0 bg-concept-{concept.code}-overlay">
                 <div class="flex h-full w-full p-4 items-end headline--3 text-white">
                     {concept.name}