Properly check for images

Do not check for models, but actual file.
They might be missing, e.g. cause not downloaded from production into
dev environment.

The new checks ensure the page will not break with an exception, but
show default images.

Resources/Private/Partials/Date/ListDefault.html

@@ -3,10 +3,10 @@
     <f:for each="{dates}" as="date">
         <div class="col-sm-12 col-md-6 col-lg-4 col-xl-4">
             <div class="menu-tile">
-                <f:if condition="{date.event.images}">
+                <f:if condition="{date.event.images.0}">
                     <f:then>
                         <f:link.action pageUid="{settings.showPID}" action="show" controller="Date" arguments="{date: date}">
-                            <f:image src="{date.event.images.originalResource.originalFile.uid}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                            <f:image image="{date.event.images.0}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                         </f:link.action>
                     </f:then>
                     <f:else>

Resources/Private/Partials/Date/ListTable.html

@@ -30,10 +30,10 @@
                 <f:format.crop maxCharacters="150">{date.event.details}</f:format.crop>
             </div>
             <div class="col-4">
-                <f:if condition="{date.event.images}">
+                <f:if condition="{date.event.images.0}">
                     <f:then>
                         <f:link.action pageUid="{settings.showPID}" action="show" controller="Date" arguments="{date: date}">
-                            <f:image src="{date.event.images.originalResource.originalFile.uid}" alt="" width="400c" height="280c" class="img-fluid img-thumbnail"/>
+                            <f:image image="{date.event.images.0}" alt="" width="400c" height="280c" class="img-fluid img-thumbnail"/>
                         </f:link.action>
                     </f:then>
                     <f:else>

Resources/Private/Templates/Date/Show.html

@@ -3,9 +3,9 @@
     <f:section name="content">
         <div class="row">
             <div class="col-6">
-                <f:if condition="{date.event.images}">
+                <f:if condition="{date.event.images.0}">
                     <f:then>
-                        <f:image src="{date.event.images.originalResource.originalFile.uid}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                        <f:image image="{date.event.images.0}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                     </f:then>
                     <f:else>
                         <img src="{settings.defaultImagePath}" alt="Dummy" width="480c" height="320c" class="img-fluid img-thumbnail"/>

Resources/Private/Templates/Date/Teaser.html

@@ -10,10 +10,10 @@
                     -->
                 </f:comment>
                 <div class="menu-tile">
-                    <f:if condition="{date.event.images}">
+                    <f:if condition="{date.event.images.0}">
                         <f:then>
                             <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
-                                <f:image src="{date.event.images.originalResource.originalFile.uid}" alt="{date.event.title}" title="{date.event.title}"  width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                                <f:image image="{date.event.images.0}" alt="{date.event.title}" title="{date.event.title}"  width="480c" height="320c" class="img-fluid img-thumbnail"/>
                             </f:link.action>
                         </f:then>
                         <f:else>

Resources/Private/Templates/Event/List.html

@@ -6,10 +6,10 @@
             <f:for each="{events}" as="event">
                 <div class="col-sm-12 col-md-6 col-lg-4 col-xl-4">
                     <div class="menu-tile">
-                        <f:if condition="{event.images}">
+                        <f:if condition="{event.images.0}">
                             <f:then>
                                 <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
-                                    <f:image src="{event.images.originalResource.originalFile.uid}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                                    <f:image image="{event.images.0}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                                 </f:link.action>
                             </f:then>
                             <f:else>

Resources/Private/Templates/Event/Search.html

@@ -4,10 +4,10 @@
     <f:for each="{events}" as="event">
         <div class="col-sm-12 col-md-6 col-lg-4 col-xl-4">
             <div class="menu-tile">
-                <f:if condition="{event.images}">
+                <f:if condition="{event.images.0}">
                     <f:then>
                         <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
-                            <f:image src="{event.images.originalResource.originalFile.uid}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                            <f:image image="{event.images.0}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                         </f:link.action>
                     </f:then>
                     <f:else>

Resources/Private/Templates/Event/Show.html

@@ -3,10 +3,10 @@
     <f:section name="content">
         <div class="row">
             <div class="col-6">
-                <f:if condition="{event.images}">
+                <f:if condition="{event.images.0}">
                     <f:then>
                         <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
-                            <f:image src="{event.images.originalResource.originalFile.uid}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                            <f:image image="{event.images.0}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                         </f:link.action>
                     </f:then>
                     <f:else>

Resources/Private/Templates/Event/Teaser.html

@@ -6,10 +6,10 @@
         <f:for each="{events}" as="event">
             <div class="col-sm-12 col-md-6 col-lg-4 col-xl-4">
                 <div class="menu-tile">
-                    <f:if condition="{event.images}">
+                    <f:if condition="{event.images.0}">
                         <f:then>
                             <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
-                                <f:image src="{event.images.originalResource.originalFile.uid}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
+                                <f:image image="{event.images.0}" alt="{date.event.title}" title="{date.event.title}" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                             </f:link.action>
                         </f:then>
                         <f:else>