1<#import "/blaues-gut-portal.web-resources_SERVLET_CONTEXT_/common_macros.ftl" as common>
2
3<#assign namespace = randomNamespace />
4<#assign assetCategoryLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetCategoryLocalService") /> 5<#assign layoutLocalService = serviceLocator.findService("com.liferay.portal.kernel.service.LayoutLocalService") /> 6
7<#function getDownloadLink content>
8 <#assign
9 dlAppService = serviceLocator.findService("com.liferay.document.library.kernel.service.DLAppService") 10 dlUrlHelperUtil = serviceLocator.findService("com.liferay.document.library.util.DLURLHelper") 11 json = jsonFactoryUtil.createJSONObject(content)
12 fileEntryGroupId = json.getLong("groupId") 13 fileEntryUuid = json.getString("uuid") 14 fileEntry = dlAppService.getFileEntryByUuidAndGroupId(fileEntryUuid, fileEntryGroupId)
15 >
16 <#return httpUtil.removeParameter(dlUrlHelperUtil.getDownloadURL(fileEntry, fileEntry.getLatestFileVersion(), themeDisplay, "", false, true), "download") />
17</#function>
18
19
20<#if entries?has_content>
21 <#assign
22 parentLayoutPlid = layout.getParentPlid()
23 parentLayout = layoutLocalService.fetchLayout(parentLayoutPlid)!""
24 parentAssetPublisherId = ""
25 />
26 <#if validator.isNotNull(parentLayout)>
27 <#if parentLayout.isTypePortlet()>
28 <#assign parentLayoutTypePortlet = parentLayout.getLayoutType() />
29 <#assign parentPortlets = parentLayoutTypePortlet.getExplicitlyAddedPortlets() />
30 <#list parentPortlets as parentPortlet>
31 <#if parentPortlet.getRootPortletId() == "com_liferay_asset_publisher_web_portlet_AssetPublisherPortlet">
32 <#assign parentAssetPublisherId = parentPortlet.getPortletId() />
33
34 <#break />
35 </#if>
36 </#list>
37 </#if>
38 </#if>
39
40<#-- <#list entries as entry>-->
41<#-- <#assign assetRenderer = entry.getAssetRenderer() />-->
42
43<#-- <#if assetRenderer.getClassName()=="com.liferay.journal.model.JournalArticle">-->
44<#-- <pre>-->
45<#-- ${assetRenderer.getArticle().getContent()}--> 46<#-- </pre>-->
47<#-- </#if>-->
48<#-- </#list>-->
49
50<#-- <div style="background-color: red;height: 50px;color:white;">-->
51<#-- ###########################################-->
52<#-- </div>-->
53
54 <section class="slider-related" id="slider_${namespace}"> 55 <h2 class="headline">Das könnte Sie auch interessieren</h2>
56
57 <div class="slides-wrapper">
58
59 <div class="slides-list">
60
61 <#list entries as curEntry>
62
63
64 <#assign docXml = saxReaderUtil.read(curEntry.getAssetRenderer().getArticle().getContent()) />
65 <#assign viewURL = assetPublisherHelper.getAssetViewURL(renderRequest, renderResponse, curEntry) />
66 <#assign renderer= curEntry.getAssetRenderer()/>
67
68 <#if assetLinkBehavior != "showFullContent">
69 <#assign viewURL = renderer.getURLViewInContext(renderRequest, renderResponse, viewURL) />
70 </#if>
71
72
73
74 <#assign
75 linkTarget = ""
76 linkHref= viewURL
77 headline = docXml.valueOf("//dynamic-element[@name='HeadlineArticle']/dynamic-content/text()") 78 imgUrlExisting = docXml.valueOf("//dynamic-element[@name='ExistingSlider']//dynamic-element[@name='Image']/dynamic-content/text()") 79 imgUrlNew = docXml.valueOf("//dynamic-element[@name='NeuerSlider']//dynamic-element[@name='Image']/dynamic-content/text()") 80 imgLarge = docXml.valueOf("//dynamic-element[@name='ImageLarge']/dynamic-content/text()") 81 imgUrl = ""
82 altText = ""
83 Copyright = ""
84 />
85
86 <#if imgUrlNew!="">
87 <#assign
88 imgUrl = getDownloadLink(imgUrlNew) + "&imageThumbnail=1"
89 altText = common.getAltText(imgUrlNew)
90 Copyright = common.getCopyrightTag("",imgUrlNew) 91 />
92
93 <#elseif imgUrlExisting!="">
94 <#assign
95 imgUrl = getDownloadLink(imgUrlExisting) + "&imageThumbnail=1"
96 altText = common.getAltText(imgUrlExisting)
97 Copyright = common.getCopyrightTag("",imgUrlExisting) 98 />
99 <#elseif imgLarge!="">
100 <#assign
101 imgUrl = getDownloadLink(imgLarge) + "&imageThumbnail=1"
102 altText = common.getAltText(imgLarge)
103 Copyright = common.getCopyrightTag("",imgLarge) 104 />
105 </#if>
106
107 <div class="slide" role="group" aria-label="Folie ${curEntry?index + 1} von ${entries?size}"> 108 <div class="slide-content">
109 <div class="slide-content-image image-with-caption">
110 <a href="${linkHref}" ${linkTarget}> 111 <#if imgUrl!="">
112 <img src="${imgUrl}" data-src="${imgUrl}" class="slide__image" alt="${altText}" loading="lazy" /> 113 <#else>
114 <img src="/o/blaues-gut-theme/images/no-image_blaues-gut.png" data-src="/o/blaues-gut-theme/images/logo_bg_mobile.svg"
115 class="slide__image no-image" alt=""/>
116 </#if>
117 </a>
118 ${Copyright} 119 </div>
120
121 <#assign assetCategories = assetCategoryLocalService.getAssetEntryAssetCategories(curEntry.entryId) />
122 <#if assetCategories?? && assetCategories?size gt 0>
123 <ul class="tags">
124 <#list assetCategories as assetCategory>
125 <#assign
126 categoryURL = portletURLFactory.create(renderRequest, parentAssetPublisherId, parentLayoutPlid, "RENDER_PHASE")
127 href = categoryURL.toString()
128 href = httpUtil.setParameter(href, "_" + parentAssetPublisherId + "_categoryId", assetCategory.getCategoryId()?string)
129 href = httpUtil.setParameter(href, "_" + parentAssetPublisherId + "_resetCur", "true")
130 />
131
132
133 <li class="tag">
134 <a href="${href}">${assetCategory.getTitle(locale)}</a> 135 </li>
136 </#list>
137 </ul>
138 </#if>
139 <h3 class="title"><a href="${linkHref}" ${linkTarget}>${headline}</a></h3> 140 </div>
141 </div>
142 </#list>
143 </div>
144 </div>
145 </section>
146
147 <script>
148 window.addEventListener("load", function () { 149 function ${namespace}_updateInfo(info) { 150 if (info.navItems) { 151 for (var i = 0; i < info.navItems.length; i++) { 152 info.navItems[i].setAttribute('aria-label', 'Folie ' + (i + 1)); 153 }
154
155 info.navItems[info.navCurrentIndex].setAttribute('aria-label', 'Folie ' + (info.navCurrentIndex + 1) + ' (aktuell)'); 156 }
157
158 if (info.controlsContainer) { 159 info.controlsContainer.setAttribute('aria-label', 'Navigationselemente'); 160 }
161 if (info.prevButton) { 162 info.prevButton.setAttribute('aria-label', 'zur vorhergehenden Folie springen'); 163 }
164 if (info.nextButton) { 165 info.nextButton.setAttribute('aria-label', 'zur nächsten Folie springen'); 166 }
167 if (info.navContainer) { 168 info.navContainer.setAttribute('aria-label', 'Auswahl der Folien') 169 }
170 }
171
172 var slider = tns({ 173 container: '#slider_${namespace} .slides-list', 174 items: 1.5,
175 slideBy: 'page',
176 lazyload: true,
177 lazyloadSelector: '.slide__image',
178 loop: false,
179 controls: false,
180 nav: false,
181 controlsPosition: 'bottom',
182 navPosition: 'bottom',
183 touch: true,
184 mouseDrag: true,
185 freezable: true,
186 speed: 600,
187 arrowKeys: true,
188 edgePadding: 16,
189 fixedWidth: 300,
190 // viewportMax: 1600,
191 controlsText: ['<span class="icon-bg icon-bg--arrow2-left"></span>', '<span class="icon-bg icon-bg--arrow2-right"></span>'],
192 responsive: { 193 768: { 194 items: 1.5,
195 edgePadding: 0,
196 gutter: 0
197 },
198 900: { 199 items: 3,
200 edgePadding: 0
201 },
202 1280: { 203 items: 4,
204 controls: true
205 },
206 1600: { 207 controls: true,
208 items: 5
209 }
210 },
211 onInit: function (info) { 212 ${namespace}_updateInfo(info); 213 }
214 });
215 slider.events.on('indexChanged', function(info) { 216 ${namespace}_updateInfo(info); 217 });
218 });
219 </script>
220</#if>
© Bild: Blaues Gut