1<#-- OUCampagne.ftl -->
2<#-- VERSIE 08-05-2026 -->
3
4<style>
5 .icon-x {
6 width: 1em;
7 height: 1em;
8 vertical-align: -0.125em;
9 }
10
11 .sub-navigation {
12 display: block;
13
14 .lfr-nav-item {
15 width: -webkit-fill-available;
16 max-width: -webkit-fill-available;
17 text-overflow: ellipsis;
18 white-space: nowrap;
19 overflow: hidden;
20 }
21 }
22 .faq {
23 border-bottom: 1px solid grey;
24 padding-top: 3px;
25 margin-top: 2px;
26 }
27
28 .faq .text.short {
29 overflow: hidden;
30 }
31 .faq .text.full {
32 display: none;
33 }
34
35 .read-more span{
36 color: grey;
37 }
38</style>
39<#assign journalArticleLocalService = serviceLocator.findService("com.liferay.journal.service.JournalArticleLocalService") />
40<#assign journalArticle = journalArticleLocalService.getArticle(getterUtil.getLong(groupId), .vars['reserved-article-id'].data) />
41
42<#assign extra_sfeerbeeld = journalArticle.getExpandoBridge().getAttribute("extra_sfeerbeeld") />
43<@liferay_util["html-top"] outputKey="metaog">
44 <#if extra_sfeerbeeld?has_content>
45 <meta property="og:image" content="${extra_sfeerbeeld}" />
46 </#if>
47 <meta property="og:type" content="article" />
48 <meta property="og:locale" content="${locale}" />
49</@>
50<#assign articlePrimKey = journalArticle.getResourcePrimKey() />
51<#assign assetEntryLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetEntryLocalService") />
52<#assign asset = assetEntryLocalService.getEntry('com.liferay.journal.model.JournalArticle', journalArticle.resourcePrimKey) />
53<#assign dlfileEntryLocalServiceUtil = serviceLocator.findService("com.liferay.document.library.kernel.service.DLFileEntryLocalService") />
54
55<#assign groupService = serviceLocator.findService("com.liferay.portal.kernel.service.GroupLocalService") />
56<#assign group = themeDisplay.getScopeGroup() />
57<#assign userpics_url = group.getExpandoBridge().getAttribute("base_url_voor_userpics") />
58<#assign link_contact_formulier = group.getExpandoBridge().getAttribute("link_contact_formulier") />
59<#assign Pagina_Koppeling = Pagina_Koppeling.getFriendlyUrl() />
60<#assign Link_Koppeling = Link_Koppeling.getData() />
61
62<#assign Current_URL = request.getAttribute("CURRENT_COMPLETE_URL") />
63
64<#if Current_URL?starts_with("http://")>
65 <#assign Current_URL = Current_URL?replace("http://", "https://") />
66</#if>
67
68<#assign facebook_URL = Current_URL />
69<#assign titleLinkedIn = htmlUtil.stripHtml(.vars['reserved-article-title'].data) />
70<#assign InleidingLinkedIn = htmlUtil.stripHtml(Inleiding.getData()) />
71<#assign InleidingLinkedIn = InleidingLinkedIn[0..*265] />
72<#assign linkedin_URL = httpUtil.encodeURL(Current_URL) + "&title=" + httpUtil.encodeURL(titleLinkedIn) + "+&summary=+" + httpUtil.encodeURL(InleidingLinkedIn) + "+&source=+" + httpUtil.encodeURL("Open Universiteit") />
73<#assign InleidingAsPlainText = Inleiding.getData()?replace("<.*?>","","r") />
74<#assign mailto = "mailto:?subject=" + languageUtil.get(locale, 'GELEZEN_OP_OU_NL') + " " + .vars['reserved-article-title'].data + "&body=" + InleidingAsPlainText + " [" + Current_URL + "]" />
75
76<#if locale.toString() == "nl_NL">
77 <#assign belafspraak = "Maak een belafspraak" />
78<#else>
79 <#assign belafspraak = "Make a call appointment" />
80</#if>
81
82<#-- Check and decide if fe display one or two columns -->
83<#assign width_left_column_ccs_class = "content__left col-xs-12 col-md-8" />
84<#assign showRightColumn = true />
85
86<#if getterUtil.getBoolean((content_full_width.getData())!false)>
87 <#assign width_left_column_ccs_class = "content__left col-xs-12 col-md-12" />
88 <#assign showRightColumn = false />
89</#if>
90
91<#-- Contact persoon informatie ophalen -->
92<#assign Persoon_Tonen = "false" />
93
94<#if Persoon.getChild("Persoon_Tonen").getData()=="true">
95 <#assign Persoon_Tonen = "true" />
96 <#assign Persoon_Gebruikersacroniem = Persoon.getChild("Persoon_Gebruikersacroniem").getData() />
97 <#assign Persoon_Naam = Persoon.getChild("Persoon_Naam").getData() />
98 <#assign Persoon_Titel = Persoon.getChild("Persoon_Titel").getData() />
99 <#assign Persoon_Functie = Persoon.getChild("Persoon_Functie").getData() />
100 <#if Persoon.Persoon_Gebruikersacroniem.getData() != "">
101 <#assign Persoon_Foto_URL = userpics_url + Persoon.Persoon_Foto_Url.getData() />
102 <#else>
103 <#assign Persoon_Foto_URL = Persoon.Persoon_Foto_Url.getData() />
104 </#if>
105 <#if Persoon_Functie?has_content && Persoon_Functie != "">
106 <#assign Persoon_Functie = Persoon.Persoon_Functie.getData() />
107 </#if>
108</#if>
109
110<#-- category name -->
111<#assign vocLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetVocabularyLocalService") />
112<#assign catLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetCategoryLocalService") />
113<#assign companyGroupId = themeDisplay.getCompanyGroupId() />
114<#assign vocabulary = vocLocalService.getGroupVocabulary(companyGroupId,"Wetenschapsgebied") />
115<#assign vocabularyId = vocabulary.vocabularyId />
116<#assign articleCatNames = catLocalService.getCategoryNames("com.liferay.journal.model.JournalArticle", getterUtil.getLong(articlePrimKey)) />
117<#assign categories = catLocalService.getCategories("com.liferay.journal.model.JournalArticle", getterUtil.getLong(articlePrimKey)) />
118<#assign categoryName = "corporate" />
119<#list categories as category>
120 <#if category.vocabularyId == vocabularyId>
121 <#assign categoryName = category.getName() />
122 <#assign filterName = category.getName()?replace("\\s+", "+", "r") />
123 <#assign categoryName = categoryName?replace("\\W", " ", "r")?replace("\\s+", "-", "r")?lower_case />
124 <#if categoryName?starts_with("-")>
125 <#assign categoryName = categoryName?string[1] />
126 </#if>
127 </#if>
128</#list>
129
130
131<#-- Alternate colourkeys for agenda -->
132<#-- Color codes & images ophalen for each wetenschapsgebied -->
133<#assign colorKey = "corporate " />
134<#assign link_header_image = "" />
135<#if categoryName == "cultuurwetenschappen">
136 <#assign colorKey = "cw " />
137<#elseif categoryName == "milieu-natuurwetenschappen" || categoryName == "natuurwetenschappen" />
138 <#assign colorKey = "nw " />
139<#elseif categoryName == "informatica" || categoryName == "informatiekunde" />
140 <#assign colorKey = "inf " />
141<#elseif categoryName == "managementwetenschappen" />
142 <#assign colorKey = "mw " />
143<#elseif categoryName == "onderwijswetenschappen" />
144 <#assign colorKey = "ow " />
145<#elseif categoryName == "psychologie" />
146 <#assign colorKey = "psy " />
147<#elseif categoryName == "rechtswetenschappen" />
148 <#assign colorKey = "rw " />
149<#elseif categoryName == "gezondheidswetenschappen" />
150 <#assign colorKey = "gw " />
151</#if>
152
153<#-- Contactformulier URL -->
154<#assign linkcontactformulierurl = "/web/open-universiteit/" + link_contact_formulier />
155<#if Pagina_Koppeling != "">
156 <#assign linkcontactformulierurl = Pagina_Koppeling />
157<#elseif Link_Koppeling != "">
158 <#assign linkcontactformulierurl = Link_Koppeling />
159</#if>
160<#assign textcontactformulier = "" />
161<#if Tekst_Koppeling?has_content>
162 <#assign textcontactformulier = Tekst_Koppeling.getData() />
163</#if>
164
165<#-- BEELAFSPRAAK URL -->
166<#assign isBelafspraak = false />
167<#list asset.getTags() as tag>
168 <#if tag.name == "belafspraak">
169 <#assign isBelafspraak = true />
170 <#assign link_belafspraak = group.getExpandoBridge().getAttribute("link_belafspraak") />
171 </#if>
172</#list>
173
174<#assign showSfeerbeeld = false />
175<#-- Sfeerbeeld -->
176<#if (Sfeerbeeld.getData())?has_content>
177 <#assign picURL = Sfeerbeeld.getData() />
178 <#assign altText = "" />
179
180 <#if picURL?has_content>
181 <#assign showSfeerbeeld = true />
182 <#assign image_url = picURL?split("_head_large.")[0] + "_head_small.jpg" />
183 <#assign uuid = ((picURL?split(".jpg/")[1])!"")?split("?")[0] />
184 <#if uuid?has_content && groupId != 0>
185 <#assign dlfileEntry = dlfileEntryLocalServiceUtil.fetchDLFileEntryByUuidAndGroupId(uuid,getterUtil.getLong(groupId)) />
186 <#assign altText = dlfileEntry.getDescription() />
187 <#if altText == "">
188 <#assign altText = dlfileEntry.getTitle() />
189 </#if>
190 </#if>
191 </#if>
192</#if>
193
194<#assign titleFlipped = false />
195<#list asset.getTags() as tag>
196 <#if tag.name == "fliptitle">
197 <#assign titleFlipped = true />
198 </#if>
199</#list>
200
201<#-- Create link for meer lezen -->
202<#assign overzichtlink = group.getExpandoBridge().getAttribute("link_naar_doorzetters_pagina") />
203<#assign currentDoorzettersUrl = request.getAttribute("CURRENT_COMPLETE_URL") />
204<#if currentDoorzettersUrl?starts_with("http://")>
205 <#assign currentDoorzettersUrl = currentDoorzettersUrl?replace("http://", "https://") />
206</#if>
207<#assign tekstInBreadcrumb = "Doorzetters" />
208
209<#assign showBreadCrumbs = false />
210<#list asset.getTags() as tag>
211 <#if tag.name == "doorzetter">
212 <#assign showBreadCrumbs = true />
213 </#if>
214</#list>
215
216<#-- Studie tab functies -->
217<#function getChangedParagraph paragraph item>
218 <#local image = "">
219 <#if item.testimonialNaam?has_content>
220 <#local image =
221 '<div class="testimonial-slider">' +
222 '<div class="testimonial-slider__item" style="margin-top: 20px">' +
223 '<div class="testimonial-slider__img" style="background: url(' + item.testimonialFoto + ') no-repeat center; background-size: cover;"></div>' +
224 '<div class="testimonial-slider__content">' +
225 '<div class="testimonial-slider__arrow"></div>' +
226 '<div class="testimonial-slider__content__inner bg__gray p-block">' +
227 '<strong class="testimonial-slider__name">'+ item.testimonialNaam +'</strong>' +
228 '<p class="testimonial-slider__function">'+ item.testimonialFunctie +'</p>' +
229 '<p class="testimonial-slider__text">'+ item.testimonialCitat +'</p>' +
230 '</div>' +
231 '</div>' +
232 '</div>' +
233 '</div>'>
234 </#if>
235
236<#-- Insert media immediately after the </p> tag, not at the end of the paragraph string -->
237 <#if image?has_content && paragraph?contains('</p>')>
238 <#local closingPIndex = paragraph?index_of('</p>') + 4 />
239 <#return paragraph?substring(0, closingPIndex) + image + paragraph?substring(closingPIndex)>
240 <#else>
241 <#return paragraph + image>
242 </#if>
243</#function>
244
245<#function updateParagraphs list mediamap>
246 <#local piminfo = '<p>' />
247 <#local result = "">
248
249<#-- If list is not empty -->
250 <#if list?has_content>
251 <#assign usedMediaMap = {}>
252 <#list list as p>
253 <#assign paragraph = p>
254 <#assign openDivs = paragraph?matches("<p>")?size>
255 <#assign closeDivs = paragraph?matches("</p>")?size>
256
257 <#assign pIndex = p?index?string>
258 <#if mediamap[p?index?string]??>
259 <#-- Handle multiple media items for the same paragraph -->
260 <#-- First, build all media HTML -->
261 <#local allMediaHtml = "">
262 <#list mediamap[p?index?string] as mediaItem>
263 <#local mediaHtml = "">
264 <#if mediaItem.testimonialNaam?has_content>
265 <#local mediaHtml =
266 '<div class="testimonial-slider">' +
267 '<div class="testimonial-slider__item" style="margin-top: 20px">' +
268 '<div class="testimonial-slider__img" style="background: url(' + mediaItem.testimonialFoto + ') no-repeat center; background-size: cover;"></div>' +
269 '<div class="testimonial-slider__content">' +
270 '<div class="testimonial-slider__arrow"></div>' +
271 '<div class="testimonial-slider__content__inner bg__gray p-block">' +
272 '<strong class="testimonial-slider__name">'+ mediaItem.testimonialNaam +'</strong>' +
273 '<p class="testimonial-slider__function">'+ mediaItem.testimonialFunctie +'</p>' +
274 '<p class="testimonial-slider__text">'+ mediaItem.testimonialCitat +'</p>' +
275 '</div>' +
276 '</div>' +
277 '</div>' +
278 '</div>'>
279 </#if>
280 <#local allMediaHtml = allMediaHtml + mediaHtml>
281 </#list>
282 <#-- Now insert all media after the </p> tag -->
283 <#if allMediaHtml?has_content && paragraph?contains('</p>')>
284 <#local closingPIndex = paragraph?index_of('</p>') + 4 />
285 <#if openDivs == closeDivs>
286 <#local result = result + paragraph?substring(0, closingPIndex) + allMediaHtml + paragraph?substring(closingPIndex)>
287 <#else>
288 <#local result = result + piminfo + paragraph?substring(0, closingPIndex) + allMediaHtml + paragraph?substring(closingPIndex)>
289 </#if>
290 <#else>
291 <#if openDivs == closeDivs>
292 <#local result = result + paragraph + allMediaHtml>
293 <#else>
294 <#local result = result + piminfo + paragraph + allMediaHtml>
295 </#if>
296 </#if>
297 <#-- Add the used media items to a list to keep track of what is displayed -->
298 <#assign usedMediaMap = usedMediaMap + {p?index?string: mediamap[p?index?string]}>
299 <#else>
300 <#if openDivs == closeDivs>
301 <#local result = result + p>
302 <#else>
303 <#-- Add starting piminfo div if necessary -->
304 <#local result = result + piminfo + p>
305 </#if>
306 </#if>
307 </#list>
308 <#-- Show all media items that have not been used -->
309 <#list mediamap?keys as key>
310 <#if !usedMediaMap[key?string]??>
311 <#list mediamap[key] as mediaItem>
312 <#if mediaItem.testimonialNaam?has_content>
313 <#local result = result +
314 '<div class="testimonial-slider">' +
315 '<div class="testimonial-slider__item" style="margin-top: 20px">' +
316 '<div class="testimonial-slider__img" style="background: url(' + mediaItem.testimonialFoto + ') no-repeat center; background-size: cover;"></div>' +
317 '<div class="testimonial-slider__content">' +
318 '<div class="testimonial-slider__arrow"></div>' +
319 '<div class="testimonial-slider__content__inner bg__gray p-block">' +
320 '<strong class="testimonial-slider__name">'+ mediaItem.testimonialNaam +'</strong>' +
321 '<p class="testimonial-slider__function">'+ mediaItem.testimonialFunctie +'</p>' +
322 '<p class="testimonial-slider__text">'+ mediaItem.testimonialCitat +'</p>' +
323 '</div>' +
324 '</div>' +
325 '</div>' +
326 '</div>'>
327 </#if>
328 </#list>
329 </#if>
330 </#list>
331 </#if>
332
333 <#return result>
334</#function>
335
336<#-- Adding testimonials to tabs -->
337<#assign Body_Content = (Artikel.getData())!"" />
338<#if (Media.getChild("Media_Item").getSiblings())??>
339 <#function newMediaMap medialist>
340 <#local mediaMap={}>
341 <#list medialist as media>
342 <#if media.Paragraaf_Nummer.getData()?has_content>
343 <#if media.Testimonial_Naam??>
344 <#assign testimonialNaam = media.Testimonial_Naam.getData()!""/>
345 </#if>
346 <#if media.Testimonial_Functie??>
347 <#assign testimonialFunctie = media.Testimonial_Functie.getData()!""/>
348 </#if>
349 <#if media.Testimonial_Foto??>
350 <#assign testimonialFoto = media.Testimonial_Foto.getData()!""/>
351 </#if>
352 <#if media.Testimonial_Citaat??>
353 <#assign testimonialCitat = media.Testimonial_Citaat.getData()!""/>
354 </#if>
355
356 <#local paraNumber = media.Paragraaf_Nummer.getData()?number?string>
357 <#local mediaItem = {
358 "testimonialNaam": testimonialNaam!"",
359 "testimonialFunctie": testimonialFunctie!"",
360 "testimonialFoto": testimonialFoto!"",
361 "testimonialCitat": testimonialCitat!""
362 }>
363
364 <#if mediaMap[paraNumber]??>
365 <#local existingItems = mediaMap[paraNumber]>
366 <#local mediaMap = mediaMap + {paraNumber: existingItems + [mediaItem]}>
367 <#else>
368 <#local mediaMap = mediaMap + {paraNumber: [mediaItem]}>
369 </#if>
370 </#if>
371 </#list>
372 <#return mediaMap>
373 </#function>
374 <#assign notFilteredResultFromArtikel = Artikel.getData()?split('<p>') />
375 <#assign paragraphsFromArtikel = notFilteredResultFromArtikel?filter(item -> item?trim != "")>
376 <#assign mediaMap = newMediaMap((Media.getChild("Media_Item").getSiblings()))!{} />
377 <#assign Body_Content = updateParagraphs(paragraphsFromArtikel mediaMap) />
378</#if>
379
380<#if showBreadCrumbs>
381 <!-- START BREADCRUMB -->
382 <section class="container-fluid section breadcrumbs">
383 <div class="layout__content-container">
384 <ul aria-label="Klikpad" class="breadcrumb breadcrumb-horizontal">
385 <#if currentDoorzettersUrl?contains("www.two.ou.nl")>
386 <li class="first breadcrumb-truncate"><a href="/web@group_friendly_url">Open Universiteit</a><span class="divider">/</span></li>
387 <li class="current-parent breadcrumb-truncate"><a href="/web/open-universiteit${overzichtlink}">${tekstInBreadcrumb}</a><span class="divider">/</span></li>
388 <#elseif currentDoorzettersUrl?contains("www.awo.ou.nl")>
389 <li class="first breadcrumb-truncate"><a href="/web@group_friendly_url">Open Universiteit</a><span class="divider">/</span></li>
390 <li class="current-parent breadcrumb-truncate"><a href="/web/open-universiteit${overzichtlink}">${tekstInBreadcrumb}</a><span class="divider">/</span></li>
391 <#elseif currentDoorzettersUrl?contains("www.ou.nl")>
392 <li class="first breadcrumb-truncate"><a href="/">Open Universiteit</a><span class="divider">/</span></li>
393 <li class="current-parent breadcrumb-truncate"><a href="${overzichtlink}">${tekstInBreadcrumb}</a><span class="divider">/</span></li>
394 <#else>
395 <li class="first breadcrumb-truncate"><a href="/web@group_friendly_url">Open Universiteit</a><span class="divider">/</span></li>
396 <li class="current-parent breadcrumb-truncate"><a href="/web/open-universiteit${overzichtlink}">${tekstInBreadcrumb}</a><span class="divider">/</span></li>
397 </#if>
398 <li class="active last breadcrumb-truncate"><a href="${currentDoorzettersUrl}">${htmlUtil.stripHtml(.vars['reserved-article-title'].data)} </a><span class="divider">/</span></li>
399 </ul>
400 </div>
401 </section>
402</#if>
403
404<!-- START FULL IMAGE -->
405<#if showSfeerbeeld>
406 <section class="container-fluid section padding-top padding-bottom">
407 <div class="full-image full-image--smaller">
408 <div class="full-image__bg">
409 <img src="${image_url}" alt="${altText}" style="display:none" />
410 <div class="full-image__bg__img" id="Article_${.vars['reserved-article-id'].data}" style="background: url('${image_url}') no-repeat center; background-size: cover;"></div>
411 </div>
412 <#if !titleFlipped>
413 <div class="full-image__content">
414 <div class="layout__content-container">
415 <div class="row">
416 <div class="col-md-12">
417 <#if showSfeerbeeld && !getterUtil.getBoolean((Titel_Verbergen.getData())!false)>
418 <div class="full-image__content__title">${.vars['reserved-article-title'].data}</div>
419 <div class="full-image__content__stripe bg--${colorKey}"></div>
420 </#if>
421 </div>
422 </div>
423 </div>
424 </div>
425 </#if>
426 </div>
427 </section>
428</#if>
429
430<!-- START SECTION - CONTENT -->
431<section class="container-fluid section padding-top padding-bottom">
432 <div class="layout__content-container">
433 <div class="content">
434 <div class="row">
435 <div class="${width_left_column_ccs_class}">
436 <#if showSfeerbeeld>
437 <#if !titleFlipped && !getterUtil.getBoolean((Titel_Verbergen.getData())!false)>
438 <h1 class="content__page__title">${.vars['reserved-article-title'].data}</h1>
439 <div class="content__page__stripe bg--${colorKey}"></div>
440 </#if>
441 </#if>
442 <#if titleFlipped>
443 <div>
444 <#if !getterUtil.getBoolean((Titel_Verbergen.getData())!false)>
445 <h1 style="margin: 0 20px 20px 0">${.vars['reserved-article-title'].data}</h1>
446 </#if>
447 </div>
448 </#if>
449 <div class="paragraph--intro">
450 <#if extraAlgemeneInfo?has_content>
451 <div>
452 ${extraAlgemeneInfo}
453 </div>
454 </#if>
455 ${Inleiding.getData()}
456 </div>
457 <div>
458 ${Body_Content}
459 </div>
460 <div>
461 <#if (Faq_Vraag.getData())?has_content>
462 <#if Faq_Vraag.getSiblings()?has_content>
463 <h3>Veelgestelde Vragen</h3>
464 <#list Faq_Vraag.getSiblings() as cur_Faq_Vraag>
465 <#if cur_Faq_Vraag.Faq_Antwoord?has_content>
466 <div class="faq">
467 <h4>${cur_Faq_Vraag.getData()}</h4>
468 <div class="text short"></div>
469 <div class="text full">${cur_Faq_Vraag.Faq_Antwoord.getData()}</div>
470 <a class="read-more"><span>Lees meer</span></a>
471 </div>
472 </#if>
473 </#list>
474 </#if>
475 </#if>
476 </div>
477 <div class="social-media social-media__intro">
478 <ul class="social-media__container">
479 <li class="social-media__item"><a href="https://www.facebook.com/share.php?u=${facebook_URL}" class="fa fa-facebook" target="_blank"></a></li>
480 <li class="social-media__item"><a href="https://www.linkedin.com/shareArticle?mini=true&url=${linkedin_URL}" class="fa fa-linkedin" target="_blank"></a></li>
481 <li class="social-media__item"><a href="${mailto}" class="fa fa-envelope-o" target="_blank"></a></li>
482 <li class="social-media__item"><a onclick="printFunction()" class="fa fa-print" target="_blank"></a></li>
483 </ul>
484 </div>
485 </div>
486 <#if showRightColumn>
487 <div class="content__right padding-top-resp col-padding-left col-xs-12 col-md-4">
488 <#if Persoon_Tonen=="true" || textcontactformulier != "" || isBelafspraak >
489 <div class="person person--small bg__gray padding-top-resp padding-bottom-resp sidebar-widget">
490 <#if Persoon_Tonen=="true">
491 <div class="person__container">
492 <#if Persoon_Foto_URL != "">
493 <div class="person__photo person__photo__large" style="background: url(${Persoon_Foto_URL}) no-repeat center; background-size: cover;"></div>
494 </#if>
495
496 <div class="person__content">
497 <div class="person__name">${Persoon_Titel} ${Persoon_Naam}</div>
498 <#if Persoon_Functie?has_content && Persoon_Functie != "">
499 <div class="person__function">${Persoon_Functie}</div>
500 </#if>
501 </div>
502 </div>
503 </#if>
504 <#if textcontactformulier != "">
505 <div class="content__right__actions">
506 <a href="${linkcontactformulierurl}" class="btn btn--wide btn--center btn--primary" target="_blank"> ${textcontactformulier} <span class="fa fa-chevron-right"></span></a>
507 </div>
508 </#if>
509 <#if isBelafspraak>
510 <a href="${link_belafspraak}" class="btn btn--center btn--tertiary">${belafspraak}</a>
511 </#if>
512 </div>
513 </#if>
514 <#if Publicatie?has_content && Publicatie.getSiblings()?first.Publicatie_Titel.getData()?has_content>
515 <div class="publications-widget bg__gray sidebar-widget">
516 <div class="publications-widget__container">
517 <div class="section-title sidebar-widget__title">
518 <h4>Publicaties </h4>
519 <div class="section-title__stripe"></div>
520 </div>
521 <div class="list list-navigation">
522 <ul>
523 <#list Publicatie.getSiblings() as Publicatie>
524 <li>
525 <a class="list-navigation__item" href="${Publicatie.Publicatie_Link.getData()}">
526 <div class="list-navigation__item__content">
527 <div class="publications-widget__title">
528 ${Publicatie.Publicatie_Titel.getData()}
529 </div>
530 <div class="publications-widget__content">
531 ${Publicatie.Publicatie_Beschrijving.getData()}
532 </div>
533 </div>
534 <div class="list-navigation__item__arrow">
535 <span class="fa fa-chevron-right"></span>
536 </div>
537 </a>
538 </li>
539 </#list>
540 </ul>
541 </div>
542 </div>
543 </div>
544 </#if>
545 <#if Gerelateerde_studies?has_content && Gerelateerde_studies.getChild("Opleidingcode").getData()?has_content>
546 <#assign Gerelateerde_studies = Gerelateerde_studies.getChild("Opleidingcode").getSiblings() />
547
548 <div class="related-education-widget bg__gray sidebar-widget">
549 <div class="publications-widget__container">
550 <div class="section-title sidebar-widget__title">
551 <h4>Gerelateerde studies</h4>
552 <div class="section-title__stripe"></div>
553 </div>
554 <div class="list list-navigation">
555 <ul>
556 <#list Gerelateerde_studies as studieCode>
557 <#assign Sku = studieCode.getData() />
558 <#assign Opleidinglink = "/opleiding?sku=" + Sku />
559 <#assign opleidingArticle = "" />
560 <#assign opleidingArticle = (journalArticleLocalService.fetchArticle(getterUtil.getLong(groupId), Sku))! />
561
562 <#if opleidingArticle?has_content>
563 <#assign Opleidingnaam = "" />
564 <#assign Opleidingnaam = opleidingArticle.getTitle(locale) />
565 <#assign document = saxReaderUtil.read(opleidingArticle.getContentByLocale(locale)) />
566 <#assign rootElement = document.getRootElement() />
567 <#assign Studievorm = "" />
568 <#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='Studievorm']") />
569 <#assign Studievorm = xPathSelector.selectSingleNode(rootElement).getStringValue() />
570 <#assign Studiepunten = "" />
571 <#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='Studiepunten']") />
572 <#assign Studiepunten = xPathSelector.selectSingleNode(rootElement).getStringValue() />
573 <#assign Wetenschapsgebied = "" />
574 <#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='Wetenschapsgebied']") />
575 <#assign Wetenschapsgebied = xPathSelector.selectSingleNode(rootElement).getStringValue() />
576 <#assign Wetenschapsgebied = Wetenschapsgebied?replace("\\W", " ", "r")?trim?replace("\\s+", "-", "r")?lower_case />
577 <#assign SkuColor = " bg--corporate " />
578 <#if Wetenschapsgebied == "cultuurwetenschappen">
579 <#assign SkuColor = " bg--cw " />
580 <#elseif Wetenschapsgebied == "milieu-natuurwetenschappen" || categoryName == "natuurwetenschappen" />
581 <#assign SkuColor = " bg--nw " />
582 <#elseif Wetenschapsgebied == "informatica-en-informatiekunde" />
583 <#assign SkuColor = " bg--inf " />
584 <#elseif Wetenschapsgebied == "managementwetenschappen" />
585 <#assign SkuColor = " bg--mw " />
586 <#elseif Wetenschapsgebied == "onderwijswetenschappen" />
587 <#assign SkuColor = " bg--ow " />
588 <#elseif Wetenschapsgebied == "psychologie" />
589 <#assign SkuColor = " bg--psy " />
590 <#elseif Wetenschapsgebied == "rechtswetenschappen" />
591 <#assign SkuColor = " bg--rw " />
592 <#elseif Wetenschapsgebied == "gezondheidswetenschappen" />
593 <#assign SkuColor = " bg--gw " />
594 </#if>
595
596 <li>
597 <#if Sku?contains("-")>
598 <a href="${Opleidinglink}" class="list-navigation__item list__item" style="display:table;">
599 <div class="related-education-widget__tile ${SkuColor}" style="line-height:20px; display:table-cell; vertical-align:middle;" data-wg="${Wetenschapsgebied}">
600 <#assign index = Sku?index_of("-") + 1 />
601 <#assign sku1 = Sku?substring(0, index) />
602 <#assign sku2 = Sku?substring(index, Sku?length) />
603 ${sku1}</br>
604 ${sku2}
605 </div>
606 <div class="related-education-widget__content" style="margin-left:10px;">
607 <div class="list__item__description">${Studievorm}| ${Studiepunten}</div>
608 <h4 class="list__item__title">${Opleidingnaam}</h4>
609 </div>
610 <div class="list-navigation__item__arrow">
611 <span class="fa fa-chevron-right"></span>
612 </div>
613 </a>
614 <#else>
615 <a href="${Opleidinglink}" class="list-navigation__item list__item">
616 <div class="related-education-widget__tile ${SkuColor}" data-wg="${Wetenschapsgebied}">
617 ${Sku}
618 </div>
619 <div class="related-education-widget__content">
620 <div class="list__item__description">${Studievorm}| ${Studiepunten}</div>
621 <h4 class="list__item__title">${Opleidingnaam}</h4>
622 </div>
623 <div class="list-navigation__item__arrow">
624 <span class="fa fa-chevron-right"></span>
625 </div>
626 </a>
627 </#if>
628 </li>
629 </#if>
630 </#list>
631 </ul>
632 </div>
633 </div>
634 </div>
635 </#if>
636 <#if GerelateerdOnderzoek?has_content && GerelateerdOnderzoek.getSiblings()?first.Onderzoek_Titel.getData()?has_content>
637 <div class="publications-widget bg__gray sidebar-widget">
638 <div class="publications-widget__container">
639 <div class="section-title sidebar-widget__title">
640 <h4>Gerelateerd onderzoek </h4>
641 <div class="section-title__stripe"></div>
642 </div>
643 <div class="list list-navigation">
644 <ul>
645 <#list GerelateerdOnderzoek.getSiblings() as GerelateerdOnderzoek>
646 <li>
647 <a class="list-navigation__item" href="${GerelateerdOnderzoek.Onderzoek_Link.getData()}">
648 <div class="list-navigation__item__content">
649 <div class="publications-widget__title">
650 ${GerelateerdOnderzoek.Onderzoek_Titel.getData()}
651 </div>
652 <div class="publications-widget__content">
653 ${GerelateerdOnderzoek.Onderzoek_Beschrijving.getData()}
654 </div>
655 </div>
656 <div class="list-navigation__item__arrow">
657 <span class="fa fa-chevron-right"></span>
658 </div>
659 </a>
660 </li>
661 </#list>
662 </ul>
663 </div>
664 </div>
665 </div>
666 </#if>
667 <#if (Opleidingsmomenten.getChild("Moment").Moment_Titel.getData())?has_content>
668 <#assign momentIsVisible = false />
669
670 <#assign originalLocale = locale>
671 <#setting locale = localeUtil.getDefault()>
672 <#setting datetime_format = "long">
673 <#assign nowDate = .now />
674
675
676 <#list Opleidingsmomenten.getChild("Moment").getSiblings() as Moment>
677 <#if (Moment.Moment_Datum.getData())?has_content>
678 <#assign Datum_Activiteit_Data = (Moment.Moment_Datum.getData())!?datetime("yyyy-MM-d") />
679 <#assign Datum_Activiteit_Data_EoD = (Datum_Activiteit_Data?long + 1 * 86399000)?number_to_datetime />
680 <#if Datum_Activiteit_Data?has_content && (Datum_Activiteit_Data_EoD >= nowDate) && Moment.Moment_Titel.getData() != "">
681 <#assign momentIsVisible = true />
682 </#if>
683 </#if>
684 </#list>
685 <#if momentIsVisible == true>
686 <div class="agenda-widget bg__gray sidebar-widget">
687 <div class="section-title sidebar-widget__title">
688 <#if articleCatNames?seq_contains("Professional Program")>
689 <h4>Nieuws</h4>
690 <#else>
691 <h4>Agenda</h4>
692 </#if>
693 <div class="section-title__stripe"></div>
694 </div>
695
696 <div class="list list-navigation">
697 <ul>
698
699 <#list Opleidingsmomenten.getChild("Moment").getSiblings() as Moment>
700 <#assign Datum_Activiteit_Data = "" />
701 <#assign Datum_Activiteit_Data_EoD = "" />
702 <#assign Dag_Activiteit = "" />
703 <#assign Maand_Activiteit = ""/>
704 <#assign momentIsVisible = false />
705
706 <#if (Moment.Moment_Datum.getData())?has_content>
707 <#assign Datum_Activiteit_Data = (Moment.Moment_Datum.getData())!?datetime("yyyy-MM-d") />
708 <#assign Datum_Activiteit_Data_EoD = (Datum_Activiteit_Data?long + 1 * 86399000)?number_to_datetime />
709 <#if Datum_Activiteit_Data?has_content && (Datum_Activiteit_Data_EoD >= nowDate) && Moment.Moment_Titel.getData() != "">
710 <#assign Dag_Activiteit = dateUtil.getDate(Datum_Activiteit_Data, "d", locale) />
711 <#assign Maand_Activiteit = dateUtil.getDate(Datum_Activiteit_Data, "MMM", locale) />
712 <#assign momentIsVisible = true />
713 </#if>
714 </#if>
715 <#if momentIsVisible>
716 <li class="list__item color--${colorKey}">
717 <#if Moment.Moment_Link.getData()?has_content && Moment.Moment_Link.getData()?has_content>
718
719 <a href="${Moment.Moment_Link.getData()}" class="list-navigation__item " target="_blank">
720 <div class="agenda-widget__tile">
721 <div class="tile tile__date">
722 <div class="tile__date__content">
723 <div class="tile__date__day">${Dag_Activiteit}</div>
724 <div class="tile__date__month">${Maand_Activiteit}</div>
725 </div>
726 </div>
727 </div>
728
729 <div class="o-list-tile__item__container">
730 <div class="list__item__description">
731 <#if Moment.Moment_Tijd.getData()?has_content>
732 ${Moment.Moment_Tijd.getData()} uur
733 </#if>
734 </div>
735 <h4 class="list__item__title">
736 ${Moment.Moment_Titel.getData()}
737 </h4>
738 </div>
739 <div class="list-navigation__item__arrow">
740 <span class="fa fa-chevron-right"></span>
741 </div>
742 </a>
743 <#else>
744 <div class="list-navigation__item ">
745 <div class="agenda-widget__tile">
746 <div class="tile tile__date">
747 <div class="tile__date__content">
748 <div class="tile__date__day">${Dag_Activiteit}</div>
749 <div class="tile__date__month">${Maand_Activiteit}</div>
750 </div>
751 </div>
752 </div>
753
754 <div class="o-list-tile__item__container">
755 <div class="list__item__description">
756 <#if Moment.Moment_Tijd.getData()?has_content>
757 ${Moment.Moment_Tijd.getData()} uur
758 </#if>
759 </div>
760 <h4 class="list__item__title">
761 ${Moment.Moment_Titel.getData()}
762 </h4>
763 </div>
764 </div>
765 </#if>
766 </li>
767 </#if>
768 </#list>
769 </ul>
770 </div>
771 </div>
772 </#if>
773 </#if>
774 <#if interestingLink?has_content && interestingLink.LinkText.getSiblings()?first.LinkUrl.getData()?has_content>
775 <div class="publications-widget bg__gray sidebar-widget">
776 <div class="publications-widget__container">
777 <div class="section-title sidebar-widget__title">
778 <h4>Ook interessant </h4>
779 <div class="section-title__stripe"></div>
780 </div>
781 <div class="list list-navigation">
782 <ul>
783 <#list interestingLink.LinkText.getSiblings() as cur_interestingLink_LinkText>
784 <li>
785 <a class="list-navigation__item" href="${cur_interestingLink_LinkText.LinkUrl.getData()}">
786 <div class="list-navigation__item__content">
787 <div class="publications-widget__title">
788 ${cur_interestingLink_LinkText.getData()}
789 </div>
790 </div>
791 <div class="list-navigation__item__arrow">
792 <span class="fa fa-chevron-right"></span>
793 </div>
794 </a>
795 </li>
796 </#list>
797 </ul>
798 </div>
799 </div>
800 </div>
801 </#if>
802 </div>
803 </#if>
804 <!-- row closing div -->
805 </div>
806 </div>
807 </div>
808</section>
809<script>
810 history.scrollRestoration = "manual";
811 $(document).ready(function() {
812 $("html,body").animate({scrollTop: 0}, 100); //100ms for example
813 });
814</script>
815<script>
816 $(document).ready(function(){
817 var maxChars = 240;
818 var ellipsis = "...";
819 $(".faq").each(function() {
820 var text = $(this).find(".text.full").text();
821 var html = $(this).find(".text.full").html();
822 if(text.length > maxChars)
823 {
824 var shortHtml = html.substring(0, maxChars - 3) + "<span class='ellipsis'>" + ellipsis + "</span>";
825 $(this).find(".text.short").html(shortHtml);
826 }
827 });
828 $(".read-more").click(function(e){
829 e.preventDefault();
830 var readMoreText = "<span>Lees meer</span>";
831 var readLessText = "<span>Lees minder</span>";
832 var $shortElem = $(this).parent().find(".text.short");
833 var $fullElem = $(this).parent().find(".text.full");
834
835 if($shortElem.is(":visible"))
836 {
837 $shortElem.hide();
838 $fullElem.show();
839 $(this).html(readLessText);
840 }
841 else
842 {
843 $shortElem.show();
844 $fullElem.hide();
845 $(this).html(readMoreText);
846 }
847 });
848 });
849</script>