EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement fallback images for teasers

Browse Source
This commit is contained in:
Björn Fromme
2022-03-14 17:26:49 +01:00
parent bf1ff1e304
commit 1cd4d6c333
5 changed files with 65 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/typo3conf/ext/ep_products/Classes/Domain/Model/AbstractDestination.php
+2 -2
View File
@@ -355,7 +355,7 @@ class AbstractDestination extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity
return null;
}
return reset($this->teaserImages->toArray());
return $this->teaserImages->toArray()[0];
}
/**
@@ -385,7 +385,7 @@ class AbstractDestination extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity
return null;
}
return reset($headerImages->toArray());
return $headerImages->toArray()[0];
}
/**
public/typo3conf/ext/ep_products/Classes/Domain/Model/Concept.php
+2 -2
View File
@@ -287,7 +287,7 @@ class Concept extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity implements
return null;
}
return reset($this->teaserImages->toArray());
return $this->teaserImages->toArray()[0];
}
/**
@@ -315,7 +315,7 @@ class Concept extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity implements
return null;
}
return reset($this->headerImages->toArray());
return $this->headerImages->toArray()[0];
}
/**
public/typo3conf/ext/ep_theme/Resources/Private/Partials/City/Teaser.html
+26 -16
View File
@@ -9,22 +9,32 @@
<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>
<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>
<f:alias map="{teaserImage: city.teaserImage, defaultImage: city.images.0}">
<f:if condition="{teaserImage}">
<f:then>
<f:variable name="image" value="{teaserImage}"/>
</f:then>
<f:else>
<f:variable name="image" value="{defaultImage}"/>
</f:else>
</f:if>
<f:if condition="{image}">
<f:then>
<ep:lazyLoadImage image="{image}"
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>
</f:alias>
</div>
<div class="flex-1 py-4 px-2 bg-white border-l border-r border-gray-200">
<span class="headline--3 mb-4">
public/typo3conf/ext/ep_theme/Resources/Private/Partials/Concept/Teaser.html
+26 -16
View File
@@ -6,22 +6,32 @@
<f:section name="Teaser">
<a href="{f:uri.typolink(parameter: concept.detailPage)}" title="{concept.name}" class="flex flex-col">
<div class="relative">
<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>
<f:alias map="{teaserImage: concept.teaserImage, defaultImage: concept.headerImage}">
<f:if condition="{teaserImage}">
<f:then>
<f:variable name="image" value="{teaserImage}"/>
</f:then>
<f:else>
<f:variable name="image" value="{defaultImage}"/>
</f:else>
</f:if>
<f:if condition="{image}">
<f:then>
<ep:lazyLoadImage image="{image}"
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>
</f:alias>
<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}
public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/HeaderDetail.html
+9 -1
View File
@@ -2,7 +2,15 @@
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:alias map="{image: product.images.0}">
<f:alias map="{headerImage: product.headerImages.0, defaultImage: product.images.0}">
<f:if condition="{headerImage}">
<f:then>
<f:variable name="image" value="{headerImage}"/>
</f:then>
<f:else>
<f:variable name="image" value="{defaultImage}"/>
</f:else>
</f:if>
<div class="herounit h-80 lg:h-96 mb-8">
<picture>
<source srcset="{f:uri.image(image: image, width: '1370c', height: '380c')}" media="(min-width: 768px)">