Merge branch 'release/2019.12-11'

This commit is contained in:
Björn Fromme
2019-12-29 15:03:03 +01:00
8 changed files with 126 additions and 64 deletions
+1
View File
@@ -239,3 +239,4 @@ routeEnhancers:
'.ical': 1710
'sitemap.xml': 1533906435
'yoast-snippetpreview.json': 1480321830
'/pxa': 7378121
@@ -6,6 +6,7 @@ plugin.tx_pxasocialfeed {
templateRootPaths.100 = EXT:ep_theme/Resources/Private/Templates/SocialMedia/
partialRootPaths.100 = EXT:ep_theme/Resources/Private/Partials/SocialMedia/
}
settings.defaultAjaxUid = {$plugin.tx_eptheme.settings.defaultAjaxUid}
}
page.includeCSS {
@@ -5,7 +5,8 @@ import Vue from 'vue'
import $ from 'jquery'
import dayjs from 'dayjs'
import 'dayjs/locale/de'
import fancybox from '@fancyapps/fancybox'
import '@fancyapps/fancybox'
import axios from 'axios'
global.$ = global.jQuery = $;
@@ -144,39 +145,9 @@ new Vue({
},
initCarousels () {
let $carouselItemWrappers = $('.slider--teasers > .slider__items').not('.slick-initialized');
let initCallback = this.initTeaserSlider;
$.each($carouselItemWrappers, function () {
let maxNumberOfSlides = $(this).parent('.slider').hasClass('in-column') ? 3 : 4;
$(this).slick({
accessibility: false, // This is a hack to avoid a slick carousel bug. see: https://github.com/kenwheeler/slick/issues/1407#issuecomment-325228683
mobileFirst: true,
infinite: false,
slidesToShow: 1.25,
slidesToScroll: 1,
arrows: false,
responsive: [
{
breakpoint: 1200,
settings: {
slidesToShow: maxNumberOfSlides,
arrows: true,
prevArrow: sliderPrevArrow,
nextArrow: sliderNextArrow
}
},
{
breakpoint: 992,
settings: {
slidesToShow: maxNumberOfSlides - 0.5,
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 2.25,
}
}
]
});
initCallback($(this));
});
$carouselItemWrappers = $('.slider--thirds > .slider__items').not('.slick-initialized');
$.each($carouselItemWrappers, function () {
@@ -215,6 +186,40 @@ new Vue({
});
});
},
initTeaserSlider ($element) {
let maxNumberOfSlides = $element.parent('.slider').hasClass('in-column') ? 3 : 4;
$element.slick({
accessibility: false, // This is a hack to avoid a slick carousel bug. see: https://github.com/kenwheeler/slick/issues/1407#issuecomment-325228683
mobileFirst: true,
infinite: false,
slidesToShow: 1.25,
slidesToScroll: 1,
arrows: false,
responsive: [
{
breakpoint: 1200,
settings: {
slidesToShow: maxNumberOfSlides,
arrows: true,
prevArrow: sliderPrevArrow,
nextArrow: sliderNextArrow
}
},
{
breakpoint: 992,
settings: {
slidesToShow: maxNumberOfSlides - 0.5,
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 2.25,
}
}
]
});
},
initContentsliders () {
$('.slider--content > .slider__items, .slider--product > .slider__items').not('.slick-initialized').slick({
dots: true,
@@ -352,6 +357,21 @@ new Vue({
url += separator + 'agenturcode=' + paCode;
$(this).attr('href', url);
});
},
loadSocialFeed () {
const $feedWrapper = $('[data-social-feed]');
if ($feedWrapper.length) {
const uri = $feedWrapper.data('uri');
axios.get(uri)
.then(response => {
$feedWrapper.html(response.data.html);
const $slider = $feedWrapper.find('.slider__items');
this.initTeaserSlider($slider);
})
.catch(error => {
$feedWrapper.html('<p>Social feed konnte nicht geladen werden.</p>')
})
}
}
},
created () {
@@ -389,6 +409,7 @@ new Vue({
this.initPartnerIdSelect();
this.initFaqFilter();
this.appendPaCode();
this.loadSocialFeed();
});
}
});
@@ -0,0 +1,38 @@
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
xmlns:pxa="http://typo3.org/ns/Pixelant/PxaSocialFeed/ViewHelpers"
xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers"
data-namespace-typo3-fluid="true">
<ep:container data="{data}" cssClasses="slider slider--teasers">
<div class="row slider__items">
<f:for each="{feeds}" as="feed">
<f:if condition="{feed.image} and {feed.message}">
<div class="col-md-3">
<f:link.typolink class="teaserbox teaserbox--social" parameter="{feed.postUrl}" target="_blank" title="{feed.title}">
<div class="teaserbox__image teaserbox__image--social-media" style="background-image: url({feed.image})">
<f:switch expression="{feed.configuration.token.socialType}">
<f:case value="1">
<div class="teaserbox__icon">
<i class="fa fa-facebook"></i>
</div>
</f:case>
<f:case value="2">
<div class="teaserbox__icon">
<i class="fa fa-instagram"></i>
</div>
</f:case>
</f:switch>
</div>
<div class="teaserbox__main teaserbox__main--fixed-height">
<p>{feed.postDate -> f:format.date(format: 'd.m.Y')} @{feed.configuration.name}</p>
<f:format.raw>{feed.decodedMessage -> f:format.crop(maxCharacters: '120') -> pxa:parseMessage(type: feed.configuration.token.type) -> f:format.nl2br()}</f:format.raw>
</div>
<button class="button button--full teaserbox__button">{f:translate(key: 'tx_eptheme.label.teaserbutton.to_post', extensionName: 'ep_theme')}</button>
</f:link.typolink>
</div>
</f:if>
</f:for>
</div>
</ep:container>
</html>
@@ -87,10 +87,8 @@
<f:case value="pxasocialfeed_showfeed">
<f:render section="Header" arguments="{_all}"/>
<div>
<ep:container data="{data}" cssClasses="slider slider--teasers">
<div class="row slider__items">
<f:cObject typoscriptObjectPath="tt_content.list.20.{data.list_type}" data="{data}"/>
</div>
<ep:container data="{data}">
<f:cObject typoscriptObjectPath="tt_content.list.20.{data.list_type}" data="{data}"/>
</ep:container>
</div>
</f:case>
@@ -5,32 +5,6 @@
<f:layout name="Default"/>
<f:section name="main">
<f:for each="{feeds}" as="feed">
<f:if condition="{feed.image} and {feed.message}">
<div class="col-md-3">
<f:link.typolink class="teaserbox teaserbox--social" parameter="{feed.postUrl}" target="_blank" title="{feed.title}">
<div class="teaserbox__image teaserbox__image--social-media" style="background-image: url({feed.image})">
<f:switch expression="{feed.configuration.token.socialType}">
<f:case value="1">
<div class="teaserbox__icon">
<i class="fa fa-facebook"></i>
</div>
</f:case>
<f:case value="2">
<div class="teaserbox__icon">
<i class="fa fa-instagram"></i>
</div>
</f:case>
</f:switch>
</div>
<div class="teaserbox__main teaserbox__main--fixed-height">
<p>{feed.postDate -> f:format.date(format: 'd.m.Y')} @{feed.configuration.name}</p>
<f:format.raw>{feed.decodedMessage -> f:format.crop(maxCharacters: '120') -> pxa:parseMessage(type: feed.configuration.token.type) -> f:format.nl2br()}</f:format.raw>
</div>
<button class="button button--full teaserbox__button">{f:translate(key: 'tx_eptheme.label.teaserbutton.to_post', extensionName: 'ep_theme')}</button>
</f:link.typolink>
</div>
</f:if>
</f:for>
<f:render partial="Frontend/FeedsItems" arguments="{_all}"/>
</f:section>
</div>
@@ -0,0 +1,20 @@
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers">
<f:layout name="Default"/>
<f:section name="main">
<div data-social-feed data-uri="{f:render(section: 'uri') -> f:spaceless()}">
<f:image src="EXT:ep_theme/Resources/Public/images/ajax-loader-white.gif" alt="Loading..." />
</div>
</f:section>
<f:section name="uri">
<f:uri.action action="loadFeedAjax"
pageType="7378121"
absolute="1"
pageUid="{settings.defaultAjaxUid}"
arguments="{configuration: settings.configuration, feedsLimit: settings.feedsLimit, partial: settings.partial, presentation: settings.presentation}"
/>
</f:section>
</div>
@@ -0,0 +1,9 @@
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers">
<f:layout name="Empty"/>
<f:section name="main">
<f:render partial="Frontend/FeedsItems" arguments="{feeds: feeds}" />
</f:section>
</div>