1<#assign cache = cacheUtils.getCacheManager(themeDisplay.getScopeGroupId())! />
2
3<#if cache??>
4
5 <#macro initSupraMenus>
6 <#if shortcuts.shortcutsShortcut.getSiblings()?has_content>
7 <#assign
8 leftColumnShortcuts = []
9 rightColumnLeftBlockShortcuts = []
10 rightColumnRightBlockShortcuts = []
11 />
12
13 <#list shortcuts.shortcutsShortcut.getSiblings() as curShortcut>
14 <#assign pos = curShortcut.shortcutsShortcutPos.getData()/>
15 <#if pos == "C1">
16 <#assign leftColumnShortcuts = leftColumnShortcuts + [curShortcut] />
17 <#elseif pos == "C2">
18 <#assign rightColumnLeftBlockShortcuts = rightColumnLeftBlockShortcuts + [curShortcut] />
19 <#elseif pos == "C3">
20 <#assign rightColumnRightBlockShortcuts = rightColumnRightBlockShortcuts + [curShortcut] />
21 </#if>
22 </#list>
23
24 <@initSupramenuShortcuts leftColumnShortcuts true />
25 <@initSupramenuShortcuts rightColumnLeftBlockShortcuts rightColumnRightBlockShortcuts?has_content />
26 <@initSupramenuShortcuts rightColumnRightBlockShortcuts false />
27
28 <#assign
29 html = ""
30 icon = shortcuts.shortcutsCta.shortcutsCtaIcon.getData()
31 iconWidth = shortcuts.shortcutsCta.shortcutsCtaWidth.getData()
32 iconHeight = shortcuts.shortcutsCta.shortcutsCtaHeight.getData()
33 text = shortcuts.shortcutsCta.shortcutsCtaText.getData()
34 link = (shortcuts.shortcutsCta.shortcutsCtaLink.getData()?has_content)?string(cache.parseLinkURL(request, shortcuts.shortcutsCta.shortcutsCtaLink.getData()), "")
35 target = (link?has_content)?string((shortcuts.shortcutsCta.shortcutsCtaTargetLink.getData()?has_content)?string(shortcuts.shortcutsCta.shortcutsCtaTargetLink.getData(), cache.getLinkTarget(link)), "")
36 />
37
38 <#if link?has_content>
39 <#assign html += "<a class=\"supramenu__btn\" href=\"" + link + "\" target=\"" + target + "\">" />
40 </#if>
41 <#if icon?has_content>
42 <#assign style = "" />
43 <#if iconWidth?has_content && iconWidth != "0">
44 <#assign style += "width: " + iconWidth + "px;" />
45 </#if>
46 <#if iconHeight?has_content && iconHeight != "0">
47 <#assign style += "height: " + iconHeight + "px;" />
48 </#if>
49
50 <#if text?has_content>
51 <#assign html += "<img class=\"icon-right-space\" alt=\"" + shortcuts.shortcutsCta.shortcutsCtaIcon.getAttribute("alt") + "\" data-fileentryid=\"" + shortcuts.shortcutsCta.shortcutsCtaIcon.getAttribute("fileEntryId") + "\" src=\"" + icon + "\" title=\"" + text + "\" style=\"" + style + "\" />" /> 52 <#else>
53 <#assign html += "<img alt=\"" + shortcuts.shortcutsCta.shortcutsCtaIcon.getAttribute("alt") + "\" data-fileentryid=\"" + shortcuts.shortcutsCta.shortcutsCtaIcon.getAttribute("fileEntryId") + "\" src=\"" + icon + "\" title=\"" + shortcuts.shortcutsCta.shortcutsCtaIcon.getAttribute("alt") + "\" style=\"" + style + "\" />" /> 54 </#if>
55 </#if>
56 <#if text?has_content>
57 <#assign html += "<div><span>" + text + "</span></div>" />
58 </#if>
59 <#if link?has_content>
60 <#assign html += "</a>" />
61 </#if>
62
63
64 <#if html?has_content>
65 <#assign htmlCCta += html />
66 </#if>
67 </#if>
68 </#macro>
69
70 <#macro initSupramenuShortcuts supramenuShortcuts includeSeparator>
71 <#list supramenuShortcuts as curShortcut>
72 <#assign
73 pos = curShortcut.shortcutsShortcutPos.getData()
74 icon = curShortcut.shortcutsShortcutIcon.getData()
75 iconWidth = curShortcut.shortcutsShortcutWidth.getData()
76 iconHeight = curShortcut.shortcutsShortcutHeight.getData()
77 text = curShortcut.shortcutsShortcutText.getData()
78 link = (curShortcut.shortcutsShortcutLink.getData()?has_content)?string(cache.parseLinkURL(request, curShortcut.shortcutsShortcutLink.getData()), "")
79 target = (link?has_content)?string((curShortcut.shortcutsShortcutTargetLink.getData()?has_content)?string(curShortcut.shortcutsShortcutTargetLink.getData(), cache.getLinkTarget(link)), "")
80 isComparator = curShortcut.shortcutsShortcutComparator?? && getterUtil.getBoolean(curShortcut.shortcutsShortcutComparator.getData())
81 isFavorites = curShortcut.shortcutsShortcutFavorites?? && getterUtil.getBoolean(curShortcut.shortcutsShortcutFavorites.getData())
82 />
83
84 <#assign html = "" />
85 <#assign cssLiClass = "supramenu__item supramenu__shortcut" />
86
87 <#if isComparator>
88 <#assign
89 cssLiClass = cssLiClass + " comparator-icon"
90 />
91 <#elseif isFavorites>
92 <#assign
93 cssLiClass = cssLiClass + " favorites-icon"
94 />
95 </#if>
96
97 <#if includeSeparator && ((pos == "C1" && curShortcut?is_first) || (pos == "C2" && curShortcut?is_last))>
98 <#assign cssLiClass = cssLiClass + " supramenu__shortcut--separator" />
99 <#elseif pos == "C3">
100 <#assign cssLiClass = cssLiClass + " supramenu__shortcut--icon" />
101 </#if>
102
103 <#assign html += "<li class=\"${cssLiClass}\">" /> 104
105 <#if link?has_content>
106 <#assign html += "<a class=\"supramenu__link\" href=\"" + link + "\" target=\"" + target + "\">" />
107 </#if>
108 <#if isComparator>
109 <#assign html += "<i class=\"icon-cards\"></i>"/>
110 <#elseif isFavorites>
111 <#assign html += "<i class=\"icon-favourite\"></i>"/>
112 <#elseif icon?has_content>
113 <#assign style = "" />
114 <#if iconWidth?has_content && iconWidth != "0">
115 <#assign style += "width: " + iconWidth + "px;" />
116 </#if>
117 <#if iconHeight?has_content && iconHeight != "0">
118 <#assign style += "height: " + iconHeight + "px;" />
119 </#if>
120
121 <#if text?has_content>
122 <#assign html += "<img class=\"icon-right-space\" alt=\"" + curShortcut.shortcutsShortcutIcon.getAttribute("alt") + "\" data-fileentryid=\"" + curShortcut.shortcutsShortcutIcon.getAttribute("fileEntryId") + "\" src=\"" + icon + "\" title=\"" + text + "\" style=\"" + style + "\" />" /> 123 <#else>
124 <#assign html += "<img alt=\"" + curShortcut.shortcutsShortcutIcon.getAttribute("alt") + "\" data-fileentryid=\"" + curShortcut.shortcutsShortcutIcon.getAttribute("fileEntryId") + "\" src=\"" + icon + "\" title=\"" + curShortcut.shortcutsShortcutIcon.getAttribute("alt") + "\" style=\"" + style + "\" />" /> 125 </#if>
126 </#if>
127 <#if text?has_content>
128 <#assign html += "<div><span>" + text + "</span></div>" />
129 </#if>
130 <#if link?has_content>
131 <#assign html += "</a>" />
132 </#if>
133 <#assign html += "</li>" />
134
135
136 <#if html?has_content>
137 <#if pos == "C1">
138 <#assign htmlC1 += html />
139 <#elseif pos == "C2">
140 <#assign htmlC2 += html />
141 <#elseif pos == "C3">
142 <#assign htmlC3 += html />
143 </#if>
144 </#if>
145 </#list>
146 </#macro>
147
148 <#macro drawMainMenu>
149 <ul class="main-menu__list d-none d-lg-flex" id="laufen-main-menu-list">
150 <#list mainMenu.mainMenuItems.getSiblings() as curMenuItem>
151 <li class="main-menu__item js-collapse-sm">
152 <#assign
153 type = curMenuItem.mainMenuItemsType.getData()
154 text = curMenuItem.mainMenuItemsText.getData()
155 link = (curMenuItem.mainMenuLink.getData()?has_content)?string(cache.parseLinkURL(request, curMenuItem.mainMenuLink.getData()), "")
156 target = (link?has_content)?string((curMenuItem.mainMenuItemsTargetLink.getData()?has_content)?string(curMenuItem.mainMenuItemsTargetLink.getData(), cache.getLinkTarget(link)), "")
157 linkClass = (curMenuItem.mainMenuItemsButtonType.getData())!""
158 linkClass = (linkClass?has_content)?then(linkClass, "main-menu__link text-uppercase")
159
160 sideMenuCategoryIndex = curMenuItem?index + 1
161 sideMenuCategory = type + "-" + sideMenuCategoryIndex
162 />
163
164 <div class="link-wrapper">
165 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsOpenSide.getData())>
166 <a class="js-open-side-menu ${linkClass}" href="javascript:void(0);" data-category="${sideMenuCategory}" title="${text}"> 167 <#elseif link?has_content>
168 <a class="${linkClass}" href="${link}" target="${target}" title="${text}"> 169 </#if>
170
171 ${text} 172
173 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsOpenSide.getData()) || link?has_content>
174 </a>
175 </#if>
176 </div>
177
178 <#assign categoriesWithChildren = [] />
179 <#assign sectionsWithSubitems = [] />
180
181 <div id="sideMenuCategory--${sideMenuCategory}" class="side-menu__category js-side-category-move" data-level="1"> 182 <#if (type == "PRODUCTS")>
183 <#assign categoriesWithOnlyFirstLevel =
184 (curMenuItem.mainMenuItemsFirstLevelCategories??
185 && curMenuItem.mainMenuItemsFirstLevelCategories.getData()?has_content)
186 ?then(
187 curMenuItem.mainMenuItemsFirstLevelCategories.getData()?split(",")?map(x -> x?trim), 188 []
189 )
190 />
191
192 <div class="side-menu__body">
193 <span class="side-menu-back-btn js-side-menu-back-btn d-flex align-items-center d-lg-none">
194 <i class="icon-arrow-left"></i>
195 ${cache.translate(locale, "Back")} 196 </span>
197
198 <div class="side-menu__see-all <#if text?length gt 15>long-title</#if>">
199 <div class="side-menu__see-all-title-container">
200 <span class="side-menu__see-all-title">
201 ${text} 202 </span>
203 </div>
204
205 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsShowLink.getData())>
206 <div class="side-menu__see-all-link-container">
207 <a class="side-menu__see-all-link" href="${link}"> 208 <div>
209 <span>${cache.translate(locale, "Show all")}</span> 210 </div>
211
212 <i class="icon-arrow-right"></i>
213 </a>
214 </div>
215 </#if>
216 </div>
217
218 <ul class="side-menu__body-links">
219 <#list p_Map?sort_by("websort") as item> 220 <#assign currentItemChildren = "" />
221 <li class="side-menu__body-item">
222 <div class="link-wrapper">
223 <#if !categoriesWithOnlyFirstLevel?seq_contains(item.code)>
224 <#assign currentItemChildren = cache.getSecondLevelCategories(request, item.code)?eval />
225 </#if>
226
227 <#if currentItemChildren?? && getterUtil.getBoolean(currentItemChildren?has_content)>
228 <#-- Se incluye la categoria que tiene hijos en la lista de categorias con hijos-->
229 <#assign itemData = { 230 "original": item,
231 "parentSideCategoryMenu": sideMenuCategory,
232 "children": currentItemChildren
233 } />
234
235 <#assign categoriesWithChildren = categoriesWithChildren + [itemData] />
236
237 <a class="side-menu__body-link js-open-side-menu justify-content-between" href="javascript:void(0);" data-category="${item.code}"> 238 <#elseif item.url?has_content>
239 <a class="side-menu__body-link justify-content-between" href="${item.url}"> 240 <#else>
241 <a class="side-menu__body-link justify-content-between" href="javascript:void(0);">
242 </#if>
243
244 <div class="d-flex align-items-center justify-content-start">
245 <#if item.title?has_content>
246 <img src="${item.image!}" alt="${item.title}"> 247 <#else>
248 <img src="${item.image!}"> 249 </#if>
250
251 <#if item.title?has_content>
252 <span>${item.title}</span> 253 <#else>
254 <span></span>
255 </#if>
256 </div>
257
258 <#if getterUtil.getBoolean(currentItemChildren?has_content)>
259 <i class="icon-chevron-right"></i>
260 </#if>
261
262 </a>
263 </div>
264 </li>
265 </#list>
266 </ul>
267
268 <#if curMenuItem.mainMenuItemsBanners.getSiblings()?has_content>
269 <div class="side-menu__banner-section">
270 <div id="${sideMenuCategory}-banner" class="side-menu__banner-content"> 271 <div class="side-menu__banner-container">
272 <div class="side-menu__banner">
273 <div class="side-menu__banner-slider" id="${sideMenuCategory}-side-menu__banner-slider"> 274 <div class="side-menu__banner-slider-container">
275 <#if (curMenuItem.mainMenuItemsBanners.getSiblings()?filter(b -> b.mainMenuItemsBannersType?? && b.mainMenuItemsBannersType.getData() == "slider")?size > 0)>
276 <div class="side-menu__banner-slider-buttons">
277 <button class="side-menu__banner-slider-button prev icon-chevron-left disabled" onclick="showMenuCarouselItem('${sideMenuCategory}-side-menu__banner-slider', -1);"></button> 278 <button class="side-menu__banner-slider-button next icon-chevron-right" onclick="showMenuCarouselItem('${sideMenuCategory}-side-menu__banner-slider', 1);"></button> 279 </div>
280 </#if>
281
282 <div class="side-menu__banner-slider-content" data-index="0">
283 <#list curMenuItem.mainMenuItemsBanners.getSiblings()?filter(b -> b.mainMenuItemsBannersType?? && b.mainMenuItemsBannersType.getData() == "slider") as curBanner>
284 <#assign
285 bannerType = curBanner.mainMenuItemsBannersType.getData()
286 img = curBanner.mainMenuItemsBannersImage.getData()
287 text = curBanner.mainMenuItemsBannersText.getData()
288 link = (curBanner.mainMenuItemsBannersLink.getData()?has_content)?string(cache.parseLinkURL(request, curBanner.mainMenuItemsBannersLink.getData()), "")
289 target = (link?has_content)?string((curBanner.mainMenuItemsBannersTargetLink.getData()?has_content)?string(curBanner.mainMenuItemsBannersTargetLink.getData(), cache.getLinkTarget(link)), "")
290 />
291
292 <#if img?has_content>
293 <div class="side-menu__banner-item ${bannerType}" style="background-image: url('${img}')"> 294 <#if link?has_content>
295 <a href="${link}" target="${target}"> 296 </#if>
297
298 <#if text?has_content>
299 <div class="banner-text-container">
300 <span>${text}</span> 301 </div>
302 </#if>
303
304 <#if link?has_content>
305 </a>
306 </#if>
307 </div>
308 </#if>
309 </#list>
310 </div>
311 </div>
312 </div>
313
314 <#list curMenuItem.mainMenuItemsBanners.getSiblings()?filter(b -> b.mainMenuItemsBannersType?? && b.mainMenuItemsBannersType.getData() != "slider") as curBanner>
315 <#assign
316 bannerType = curBanner.mainMenuItemsBannersType.getData()
317 img = curBanner.mainMenuItemsBannersImage.getData()
318 text = curBanner.mainMenuItemsBannersText.getData()
319 link = (curBanner.mainMenuItemsBannersLink.getData()?has_content)?string(cache.parseLinkURL(request, curBanner.mainMenuItemsBannersLink.getData()), "")
320 target = (link?has_content)?string((curBanner.mainMenuItemsBannersTargetLink.getData()?has_content)?string(curBanner.mainMenuItemsBannersTargetLink.getData(), cache.getLinkTarget(link)), "")
321 />
322
323 <#if img?has_content>
324 <div class="side-menu__banner-item ${bannerType}" style="background-image: url('${img}')"> 325 <#if link?has_content>
326 <a href="${link}" target="${target}"> 327 </#if>
328
329 <#if text?has_content>
330 <div class="banner-text-container">
331 <span>${text}</span> 332 </div>
333 </#if>
334
335 <#if link?has_content>
336 </a>
337 </#if>
338 </div>
339 </#if>
340 </#list>
341 </div>
342 </div>
343 </div>
344 </div>
345 </#if>
346 </div>
347 <#elseif (type == "LINK")>
348 <#assign
349 type = curMenuItem.mainMenuItemsType.getData()
350 sideMenuCategoryIndex = curMenuItem?index + 1
351 sideMenuCategory = type + "-" + sideMenuCategoryIndex
352 />
353
354 <#if curMenuItem.mainMenuItemsSections.getSiblings()?has_content>
355 <div class="side-menu__body">
356 <span class="side-menu-back-btn js-side-menu-back-btn d-flex align-items-center d-lg-none">
357 <i class="icon-arrow-left"></i>
358 ${cache.translate(locale, "Back")} 359 </span>
360
361 <div class="side-menu__see-all <#if text?length gt 15>long-title</#if>">
362 <div class="side-menu__see-all-title-container">
363 <span class="side-menu__see-all-title">
364 ${text} 365 </span>
366 </div>
367
368 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsShowLink.getData())>
369 <div class="side-menu__see-all-link-container">
370 <a class="side-menu__see-all-link" href="${link}"> 371 <div>
372 <span>${cache.translate(locale, "Show all")}</span> 373 </div>
374
375 <i class="icon-arrow-right"></i>
376 </a>
377 </div>
378 </#if>
379 </div>
380
381 <ul class="side-menu__body-links">
382 <#list curMenuItem.mainMenuItemsSections.getSiblings() as curSection>
383 <#assign
384 text = curSection.mainMenuItemsSectionsText.getData()
385 link = (curSection.mainMenuItemsSectionsLink.getData()?has_content)?string(cache.parseLinkURL(request, curSection.mainMenuItemsSectionsLink.getData()), "")
386 target = (link?has_content)?string((curSection.mainMenuItemsSectionsTargetLink.getData()?has_content)?string(curSection.mainMenuItemsSectionsTargetLink.getData(), cache.getLinkTarget(link)), "")
387 sideMenuCategorySectionIndex = curSection?index + 1
388 sideMenuSectionCategory = type + "-" + sideMenuCategoryIndex + "-SECTION-" + sideMenuCategorySectionIndex
389 />
390
391 <li class="side-menu__body-item side-menu__section">
392 <div class="link-wrapper">
393 <#assign
394 sectionSubitems = curSection.mainMenuItemsSectionsSubitems.getSiblings()
395 hasSubitems = sectionSubitems?has_content &&
396 !(sectionSubitems?size == 1 &&
397 (!sectionSubitems[0]?has_content
398 || (sectionSubitems[0].mainMenuItemsSectionsSubitemsText.getData() == "" || (sectionSubitems[0].mainMenuItemsSectionsSubitemsLink.getData()?has_content)?string(cache.parseLinkURL(request, sectionSubitems[0].mainMenuItemsSectionsSubitemsLink.getData()), "") == "")))
399 />
400
401 <#if hasSubitems>
402 <#assign sectionData = { 403 "original": curSection,
404 "sideMenuCategory": sideMenuCategory,
405 "sideMenuSectionCategory": sideMenuSectionCategory
406 } />
407
408 <#assign sectionsWithSubitems = sectionsWithSubitems + [sectionData] />
409
410 <a class="side-menu__body-link js-open-side-menu justify-content-between" href="javascript:void(0);" data-category="${sideMenuSectionCategory}"> 411 <#elseif link?has_content>
412 <a class="side-menu__body-link" href="${link}" target="${target}"> 413 <#else>
414 <a class="side-menu__body-link" href="javascript:void(0);">
415 </#if>
416
417 <div class="d-flex align-items-center justify-content-start">
418 <span>
419 ${text} 420 </span>
421 </div>
422
423 <#if hasSubitems>
424 <i class="icon-chevron-right"></i>
425 </#if>
426
427 </a>
428 </div>
429 </li>
430 </#list>
431 </ul>
432
433 <#if curMenuItem.mainMenuItemsBanners.getSiblings()?has_content>
434 <div class="side-menu__banner-section">
435 <div id="${sideMenuCategory}-banner" class="side-menu__banner-content"> 436 <div class="side-menu__banner-container">
437 <div class="side-menu__banner" data-index="0">
438 <#list curMenuItem.mainMenuItemsBanners.getSiblings() as curBanner>
439 <#assign
440 bannerType = curBanner.mainMenuItemsBannersType.getData()
441 img = curBanner.mainMenuItemsBannersImage.getData()
442 text = curBanner.mainMenuItemsBannersText.getData()
443 link = (curBanner.mainMenuItemsBannersLink.getData()?has_content)?string(cache.parseLinkURL(request, curBanner.mainMenuItemsBannersLink.getData()), "")
444 target = (link?has_content)?string((curBanner.mainMenuItemsBannersTargetLink.getData()?has_content)?string(curBanner.mainMenuItemsBannersTargetLink.getData(), cache.getLinkTarget(link)), "")
445 />
446
447 <#if img?has_content>
448 <div class="side-menu__banner-item ${bannerType}" style="background-image: url('${img}')"> 449 <#if link?has_content>
450 <a href="${link}" target="${target}"> 451 </#if>
452
453 <#if text?has_content>
454 <div class="banner-text-container">
455 <span>${text}</span> 456 </div>
457 </#if>
458
459 <#if link?has_content>
460 </a>
461 </#if>
462 </div>
463 </#if>
464 </#list>
465 </div>
466 </div>
467 </div>
468 </div>
469 </#if>
470 </div>
471 </#if>
472 </#if>
473 </div>
474
475 <#-- PANELES DE SUBCATEGORIAS -->
476 <#if categoriesWithChildren?has_content>
477 <#list categoriesWithChildren as itemData>
478 <#assign
479 item = itemData.original
480 parentSideCategoryMenu = itemData.parentSideCategoryMenu
481 children = itemData.children
482 />
483
484 <div id="sideMenuCategory--${item.code}" class="side-menu__category js-side-category-move" data-level="2" data-parent-panel="${parentSideCategoryMenu}"> 485 <div class="side-menu__body">
486 <div class="side-menu__see-all <#if item.title?length gt 15>long-title</#if>">
487 <div class="side-menu__see-all-title-container side-menu__subcategories-title-container">
488 <span class="side-menu-back-btn js-side-menu-back-btn d-flex align-items-center d-lg-none">
489 <i class="icon-arrow-left"></i>
490 ${cache.translate(locale, "Back")} 491 </span>
492
493 <#if item.url?has_content>
494 <a class="side-menu__see-all-title" href="${item.url}"> 495 <div>
496 <span>${item.title}</span> 497 </div>
498
499 <i class="icon-arrow-right"></i>
500 </a>
501 <#else>
502 <span class="side-menu__see-all-title">
503 ${item.title} 504 </span>
505 </#if>
506 </div>
507 </div>
508
509 <ul class="side-menu__body-links">
510 <#if children?? && children?has_content>
511 <#list children?sort_by("websort") as child> 512 <li class="side-menu__body-item" data-websort="${child.websort}"> 513 <div class="link-wrapper">
514 <a class="side-menu__body-link" <#if child.url?has_content>href="${child.url}"</#if>> 515 <#if child.title?has_content>
516 <div class="d-flex align-items-center justify-content-start">
517 <span>${child.title}</span> 518 </div>
519 <#else>
520 <span></span>
521 </#if>
522 </a>
523 </div>
524 </li>
525 </#list>
526 </#if>
527 </ul>
528 </div>
529 </div>
530 </#list>
531 </#if>
532
533
534 <#-- PANELES DE SUBITEMS DE SECCION -->
535 <#if sectionsWithSubitems?has_content>
536 <#list sectionsWithSubitems as sectionData>
537 <#assign
538 curSection = sectionData.original
539 sideMenuCategory = sectionData.sideMenuCategory
540 sideMenuSectionCategory = sectionData.sideMenuSectionCategory
541 text = curSection.mainMenuItemsSectionsText.getData()
542 link = (curSection.mainMenuItemsSectionsLink.getData()?has_content)?string(cache.parseLinkURL(request, curSection.mainMenuItemsSectionsLink.getData()), "")
543 target = (link?has_content)?string((curSection.mainMenuItemsSectionsTargetLink.getData()?has_content)?string(curSection.mainMenuItemsSectionsTargetLink.getData(), cache.getLinkTarget(link)), "")
544 />
545
546 <div id="sideMenuCategory--${sideMenuSectionCategory}" class="side-menu__category js-side-category-move" data-level="2" data-parent-panel="${sideMenuCategory}"> 547 <div class="side-menu__body">
548 <span class="side-menu-back-btn js-side-menu-back-btn d-flex align-items-center d-lg-none">
549 <i class="icon-arrow-left"></i>
550 ${cache.translate(locale, "Back")} 551 </span>
552
553 <div class="side-menu__see-all <#if text?length gt 15>long-title</#if>">
554 <div class="side-menu__see-all-title-container">
555 <#if link?has_content>
556 <a class="side-menu__see-all-title" href="${link}" target="${target}"> 557 <div>
558 <span>${text}</span> 559 </div>
560
561 <i class="icon-arrow-right"></i>
562 </a>
563 <#else>
564 <span class="side-menu__see-all-title">
565 ${text} 566 </span>
567 </#if>
568 </div>
569 </div>
570
571 <ul class="side-menu__body-links">
572 <#if curSection.mainMenuItemsSectionsSubitems.getSiblings()?has_content>
573 <#list curSection.mainMenuItemsSectionsSubitems.getSiblings() as curSubitem>
574 <#assign
575 text = curSubitem.mainMenuItemsSectionsSubitemsText.getData()
576 link = (curSubitem.mainMenuItemsSectionsSubitemsLink.getData()?has_content)?string(cache.parseLinkURL(request, curSubitem.mainMenuItemsSectionsSubitemsLink.getData()), "")
577 target = (link?has_content)?string((curSubitem.mainMenuItemsSectionsSubitemsTargetLink.getData()?has_content)?string(curSubitem.mainMenuItemsSectionsSubitemsTargetLink.getData(), cache.getLinkTarget(link)), "")
578 />
579 <li class="side-menu__body-item">
580 <div class="link-wrapper">
581 <a class="side-menu__body-link" <#if link?has_content>href="${link}"</#if> <#if target?has_content>target="${target}"</#if>> 582 <#if text?has_content>
583 <div class="d-flex align-items-center justify-content-start">
584 <span>${text}</span> 585 </div>
586 </#if>
587 </a>
588 </div>
589 </li>
590 </#list>
591 </#if>
592 </ul>
593 </div>
594 </div>
595 </#list>
596 </#if>
597 </li>
598 </#list>
599 </ul>
600 </#macro>
601
602 <#macro drawSideMenu sideMenuType>
603 <#if sideMenuType == "MENU">
604 <div id="sideMenu" class="side-menu">
605 <div class="side-menu-container">
606 <div class="side-menu__body">
607 <div class="side-menu__close d-none d-lg-flex">
608 <img alt="Laufen Swiss Bathroom" class="laufen-logo-mini" src="${themeDisplay.getPathThemeImages()}/brand/brand-logo-mini.svg"/> 609 <i class="icon-close icon-close side-menu-close-btn js-side-menu-close-btn"></i>
610 </div>
611
612 <ul class="side-menu__body-links" id="laufen-side-menu-links">
613 <#list mainMenu.mainMenuItems.getSiblings() as curMenuItem>
614 <li class="side-menu__body-item">
615 <#assign
616 type = curMenuItem.mainMenuItemsType.getData()
617 text = curMenuItem.mainMenuItemsText.getData()
618 link = (curMenuItem.mainMenuLink.getData()?has_content)?string(cache.parseLinkURL(request, curMenuItem.mainMenuLink.getData()), "")
619 target = (link?has_content)?string((curMenuItem.mainMenuItemsTargetLink.getData()?has_content)?string(curMenuItem.mainMenuItemsTargetLink.getData(), cache.getLinkTarget(link)), "")
620 sideMenuCategoryIndex = curMenuItem?index + 1
621 sideMenuCategory = type + "-" + sideMenuCategoryIndex
622 />
623
624 <div class="link-wrapper">
625 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsOpenSide.getData())>
626 <a class="side-menu__body-link js-open-side-menu text-uppercase" href="javascript:void(0);" data-category="${sideMenuCategory}" title="${text}"> 627 <#elseif link?has_content>
628 <a class="side-menu__body-link text-uppercase" href="${link}" target="${target}" title="${text}"> 629 </#if>
630
631 <span>
632 ${text} 633 </span>
634
635 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsOpenSide.getData())>
636 <i class="icon-chevron-right"></i>
637 </#if>
638
639 <#if getterUtil.getBoolean(curMenuItem.mainMenuItemsOpenSide.getData()) || link?has_content>
640 </a>
641 </#if>
642 </div>
643 </#list>
644 </ul>
645 </div>
646
647 <#if (getterUtil.getBoolean(sideMenu.sideMenuShowCountry.getData()) || getterUtil.getBoolean(sideMenu.sideMenuShowLanguage.getData())) || (sideMenu.sideMenuLinks.sideMenuLink.getSiblings()?has_content && sideMenu.sideMenuLinks.sideMenuLink.getSiblings()[0].sideMenuLinkURL.getData()?has_content)>
648 <div class="side-menu__footer">
649 <ul class="side-menu__footer-links">
650 <#list sideMenu.sideMenuLinks.sideMenuLink.getSiblings() as curLink>
651 <#assign
652 icon = curLink.sideMenuLinkIcon.getData()
653 iconWidth = curLink.sideMenuLinkWidth.getData()
654 iconHeight = curLink.sideMenuLinkHeight.getData()
655 text = curLink.sideMenuLinkText.getData()
656 link = (curLink.sideMenuLinkURL.getData()?has_content)?string(cache.parseLinkURL(request, curLink.sideMenuLinkURL.getData()), "")
657 target = (link?has_content)?string((curLink.sideMenuLinkTarget.getData()?has_content)?string(curLink.sideMenuLinkTarget.getData(), cache.getLinkTarget(link)), "")
658 />
659
660 <li class="side-menu__footer-item">
661 <a class="side-menu__footer-link" href="${link}" target="${target}"> 662 <#if icon?has_content>
663 <#assign style = "" />
664 <#if iconWidth?has_content && iconWidth != "0">
665 <#assign style += "width: " + iconWidth + "px;" />
666 </#if>
667 <#if iconHeight?has_content && iconHeight != "0">
668 <#assign style += "height: " + iconHeight + "px;" />
669 </#if>
670
671 <#if text?has_content>
672 <img class="icon-right-space" alt="${curLink.sideMenuLinkIcon.getAttribute("alt")}" data-fileentryid="${curLink.sideMenuLinkIcon.getAttribute("fileEntryId")}" src="${icon}" title="${text}" style="${style}"/> 673 <#else>
674 <img alt="${curLink.sideMenuLinkIcon.getAttribute("alt")}" data-fileentryid="${curLink.sideMenuLinkIcon.getAttribute("fileEntryId")}" src="${icon}" style="${style}" /> 675 </#if>
676 </#if>
677
678 <div><span>${text}</span></div> 679 </a>
680 </li>
681 </#list>
682
683
684 <#if getterUtil.getBoolean(sideMenu.sideMenuShowCountry.getData()) || getterUtil.getBoolean(sideMenu.sideMenuShowLanguage.getData()) || getterUtil.getBoolean(sideMenu.sideMenuShowAdditionalLink.getData())>
685 <#assign linkLocation = "" />
686 <#if sideMenu.sideMenuAdditionalLink?? && sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkLocation??>
687 <#assign linkLocation = sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkLocation.getData() />
688 </#if>
689
690 <li class="side-menu__footer-item additional-info ${linkLocation}"> 691 <#if getterUtil.getBoolean(sideMenu.sideMenuShowCountry.getData()) || getterUtil.getBoolean(sideMenu.sideMenuShowLanguage.getData())>
692 <div class="side-menu__footer-item--country menu-country-trigger">
693 <a class="side-menu__footer-link menu-country-link js-open-side-menu" href="javascript:void(0)" data-category="LANGUAGE" data-groupid="${themeDisplay.getSiteGroupId()}" data-languageid="${themeDisplay.getLanguageId()}"> 694 <#if getterUtil.getBoolean(sideMenu.sideMenuShowCountry.getData())>
695 <span class="menu-country-text-link">
696 <i class="icon-language icon-right-space"></i>
697 <div><span>${currentCountry.getAssetCategory().getTitle(themeDisplay.getLocale())}</span></div> 698 </span>
699 </#if>
700
701 <#if getterUtil.getBoolean(sideMenu.sideMenuShowLanguage.getData()) && localeList?? && localeList?has_content && localeList?size gt 1>
702 <span class="menu-country-text-link">
703 <div>
704 <span class="text-uppercase">${themeDisplay.getLocale().getLanguage()}</span> 705 </div>
706 <i class="icon-chevron-down"></i>
707 </span>
708 </#if>
709 </a>
710 </div>
711 </#if>
712
713 <#if getterUtil.getBoolean(sideMenu.sideMenuShowAdditionalLink.getData())>
714 <#assign
715 icon = sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkIcon.getData()
716 iconWidth = sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkWidth.getData()
717 iconHeight = sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkHeight.getData()
718 text = sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkText.getData()
719 link = (sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkURL.getData()?has_content)?string(cache.parseLinkURL(request, sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkURL.getData()), "")
720 target = (link?has_content)?string((sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkTarget.getData()?has_content)?string(sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkTarget.getData(), cache.getLinkTarget(link)), "")
721 />
722
723 <a class="side-menu__footer-link" href="${link}" target="${target}"> 724 <#if icon?has_content>
725 <#assign style = "" />
726 <#if iconWidth?has_content && iconWidth != "0">
727 <#assign style += "width: " + iconWidth + "px;" />
728 </#if>
729 <#if iconHeight?has_content && iconHeight != "0">
730 <#assign style += "height: " + iconHeight + "px;" />
731 </#if>
732
733 <#if text?has_content>
734 <img class="icon-right-space" alt="${sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkIcon.getAttribute("alt")}" data-fileentryid="$sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkIcon.getAttribute("fileEntryId")}" src="${icon}" title="${text}" style="${style}"/> 735 <#else>
736 <img alt="${sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkIcon.getAttribute("alt")}" data-fileentryid="${sideMenu.sideMenuAdditionalLink.sideMenuAdditionalLinkIcon.getAttribute("fileEntryId")}" src="${icon}" style="${style}" /> 737 </#if>
738 </#if>
739
740 <div><span>${text}</span></div> 741 </a>
742 </#if>
743 </li>
744 </#if>
745 </ul>
746 </div>
747 </#if>
748 </div>
749 </div>
750
751 <div class="side-menu-overlay js-side-menu-overlay"></div>
752
753 <#elseif sideMenuType == "LANGUAGE"
754 && ((getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowLanguage.getData()))
755 || (getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowCountry.getData()) && currentCountry?? && currentCountry?has_content))>
756
757 <div id="sideMenuCategory--LANGUAGE" class="side-menu__category side-menu__language" data-level="0">
758 <div class="side-menu__body">
759 <div class="side-menu__close d-flex">
760 <span class="side-menu-back-btn js-side-menu-back-btn d-flex align-items-center d-lg-none">
761 <i class="icon-arrow-left"></i>
762 ${cache.translate(locale, "Back")} 763 </span>
764
765 <img alt="Laufen Swiss Bathroom" class="laufen-logo-mini" src="${themeDisplay.getPathThemeImages()}/brand/brand-logo-mini.svg"/> 766 <i class="icon-close icon-close side-menu-close-btn js-side-menu-close-btn d-none d-lg-block"></i>
767 </div>
768
769 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowLanguage.getData()) && localeList?? && localeList?has_content && localeList?size gt 1>
770 <div class="language-container">
771 <p class="language-selector-title text-uppercase">${cache.translate(locale, "Select language")}</p> 772
773 <ul class="language-list">
774 <#list localeList as marketLocale>
775 <#if themeDisplay.getLocale() != marketLocale>
776 <#assign lpath = "/" />
777 </#if>
778
779 <li class="language-list-item <#if themeDisplay.getLocale() == marketLocale>active</#if>">
780 <a href="${cache.getSiteURL(request, marketLocale, lpath, true)}"> 781 ${marketLocale.getDisplayLanguage(themeDisplay.getLocale())} 782 </a>
783 </li>
784 </#list>
785 </ul>
786 </div>
787 </#if>
788
789 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowCountry.getData()) && currentCountry?? && currentCountry?has_content>
790 <div class="country-selector-container">
791 <p class="language-selector-title text-uppercase">${cache.translate(locale, "Select your country")}</p> 792 </div>
793
794 <div id="continent-parent"></div>
795 </#if>
796 </div>
797 </div>
798 </#if>
799 </#macro>
800
801 <#macro drawSearchHeader>
802 <#assign searchLink = cache.parseLinkURL(request, cache.translate(locale, "/search" )) />
803
804 <div id="search-header" class="search-header">
805 <input id="header-search-input" class="search-input" data-url="${searchLink}" name="q" placeholder="${cache.translate(themeDisplay.getLocale(), 'Search')}" type="search" /> 806
807 <a id="header-search-icon" class="search-icon" href="javascript:void(0);" role="button" title="${cache.translate(themeDisplay.getLocale(), 'Search')}"> 808 <span class="icon-search"></span>
809 </a>
810
811 <i class="icon-close" id="header-search-close-icon"></i>
812 </div>
813 </#macro>
814
815 <#function getUserInitials>
816 <#local userInitials = "" />
817 <#if themeDisplay.getUser().getFirstName()?? && themeDisplay.getUser().getFirstName()?has_content>
818 <#local firstName = themeDisplay.getUser().getFirstName() />
819 <#local userInitials += firstName?substring(0, 1) />
820 </#if>
821 <#if themeDisplay.getUser().getLastName()?? && themeDisplay.getUser().getLastName()?has_content>
822 <#local lastName = themeDisplay.getUser().getLastName() />
823 <#local userInitials += lastName?substring(0, 1) />
824 </#if>
825
826 <#return userInitials?upper_case />
827 </#function>
828
829
830
831 <#assign
832 p_Map = productsMap?eval
833 u_Layouts = userLayouts?eval
834
835 profile_layouts = u_Layouts.profileLayouts
836
837 profile_url = u_Layouts.profileUrl
838 logout_url = u_Layouts.logoutUrl
839 login_url = u_Layouts.loginUrl
840
841 marketTree = cache.getMarketsTree()
842 hasCommerce = cache.checkCommerce(request)
843 currentMarket = cache.getCurrentMarket(request)
844 currentCountry = cache.getCurrentCountry(request)
845
846 htmlC1 = ""
847 htmlC2 = ""
848 htmlC3 = ""
849 htmlCCta = ""
850 />
851
852 <header id="laufen-restyle-header" class="laufen-restyle-header js-header <#if config.configAuxElements.configAuxElementsAlwaysSticky?? && getterUtil.getBoolean(config.configAuxElements.configAuxElementsAlwaysSticky.getData())>always-sticky</#if>">
853 <#if themeDisplay.isSignedIn()>
854 <input type="hidden" id="user-initials" value="${getUserInitials()}"> 855 </#if>
856
857 <#-- INIT PROMOTIONAL BANNER -->
858
859 <#if getterUtil.getBoolean(promoBanner.promoBannerShow.getData()) && promoBanner.promoBannerText.getData()??>
860 <div class="promoSubmenu">
861 <section class="promomenu-section">
862 <#if promoBanner.promoBannerPopup.getData()?? && promoBanner.promoBannerPopup.getData()?has_content>
863 <div class="promomenu-scroll-wrapper" id="promoScrollWrapper">
864 <a class="promomenu-link" data-toggle="modal" data-target="#promoBannerDisp" href="#">
865 ${promoBanner.promoBannerText.getData()} 866 </a>
867 </div>
868 <#else>
869 <div class="promomenu-scroll-wrapper" id="promoScrollWrapper">
870 <p class="promomenu-text">${promoBanner.promoBannerText.getData()}</p> 871 </div>
872 </#if>
873 <button class="promomenu-scroll-btn" id="promoScrollBtn" aria-label="${cache.translate(locale, "Ver mas")}" aria-hidden="true"> 874 <i class="icon-chevron-right"></i>
875 </button>
876 </section>
877 </div>
878
879 <script>
880 document.addEventListener("DOMContentLoaded", function() { 881 const scrollWrapper = document.getElementById('promoScrollWrapper'); 882 const scrollBtn = document.getElementById('promoScrollBtn'); 883
884 if (!scrollWrapper || !scrollBtn) return;
885
886 function checkScrollable() { 887 if (scrollWrapper.scrollWidth > scrollWrapper.clientWidth) { 888 scrollBtn.classList.add('is-visible'); 889 scrollBtn.setAttribute('aria-hidden', 'false'); 890 checkScrollPosition();
891 } else { 892 scrollBtn.classList.remove('is-visible'); 893 scrollBtn.setAttribute('aria-hidden', 'true'); 894 }
895 }
896
897 function checkScrollPosition() { 898 const isAtEnd = scrollWrapper.scrollLeft + scrollWrapper.clientWidth >= scrollWrapper.scrollWidth - 5;
899
900 if (isAtEnd) { 901 scrollBtn.classList.add('is-at-end'); 902 scrollBtn.setAttribute('aria-label', '${cache.translate(locale, "Volver al principio")}'); 903 } else { 904 scrollBtn.classList.remove('is-at-end'); 905 scrollBtn.setAttribute('aria-label', '${cache.translate(locale, "Ver mas")}'); 906 }
907 }
908
909 checkScrollable();
910 window.addEventListener('resize', checkScrollable); 911
912 scrollWrapper.addEventListener('scroll', checkScrollPosition); 913
914 scrollBtn.addEventListener('click', function() { 915 if (scrollBtn.classList.contains('is-at-end')) { 916 scrollWrapper.scrollTo({ left: 0, behavior: 'smooth' }); 917 } else { 918 scrollWrapper.scrollBy({ left: 150, behavior: 'smooth' }); 919 }
920 });
921 });
922 </script>
923 </#if>
924
925 <#-- END PROMOTIONAL BANNER -->
926
927 <div class="main-header__wrapper" id="laufen-main-header-wrapper">
928 <div class="main-navbar">
929 <#-- INIT SUPRA MENU -->
930 <@initSupraMenus />
931
932 <section class="supramenu">
933 <div class="container">
934 <div class="row">
935 <div class="col-12 supramenu-cols">
936 <div class="supramenu-left">
937 <ul class="supramenu__list supramenu__list--left">
938 <li class="supramenu__item supramenu__item--hamburger menu-hamburger-trigger">
939 <a class="supramenu__link menu-hamburger-link side-menu-btn-trigger js-side-menu-btn-trigger">
940 <span class="menu-hamburger-icon-link">
941 <i class="icon-hamburger"></i>
942 </span>
943 </a>
944 </li>
945
946 <#-- INIT LANGUAGE & COUNTRY SELECTOR -->
947 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowCountry.getData()) || getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowLanguage.getData())>
948 <li class="supramenu__item supramenu__item--country menu-country-trigger d-none d-lg-block">
949 <a class="supramenu__link menu-country-link js-open-side-menu" href="javascript:void(0)" data-category="LANGUAGE" data-groupid="${themeDisplay.getSiteGroupId()}" data-languageid="${themeDisplay.getLanguageId()}"> 950 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowCountry.getData())>
951 <span class="menu-country-text-link">
952 <i class="icon-language icon-right-space"></i>
953 <div><span>${currentCountry.getAssetCategory().getTitle(themeDisplay.getLocale())}</span></div> 954 </span>
955 </#if>
956
957 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowLanguage.getData()) && localeList?? && localeList?has_content && localeList?size gt 1>
958 <span class="menu-country-text-link">
959 <div>
960 <span class="text-uppercase">${themeDisplay.getLocale().getLanguage()}</span> 961 </div>
962 <i class="icon-chevron-down"></i>
963 </span>
964 </#if>
965 </a>
966 </li>
967 </#if>
968 <#-- END LANGUAGE & COUNTRY SELECTOR -->
969
970 <#-- INIT ADITIONAL SHORTCUTS -->
971 <#if htmlC1?has_content>
972 ${htmlC1} 973 </#if>
974 <#-- END ADDITIONAL SHORTCUTS -->
975 </ul>
976 </div>
977
978 <div class="supramenu-center">
979 <#if config.configLogo.configLogoImage.getData()?has_content>
980 <#assign
981 logoImg = config.configLogo.configLogoImage.getData()
982 logoImgWidth = config.configLogo.configLogoWidth.getData()
983 logoImgHeight = config.configLogo.configLogoHeight.getData()
984 link = (config.configLogo.configLogoLink.getData()?has_content)?string(cache.parseLinkURL(request, config.configLogo.configLogoLink.getData()), "")
985 target = (link?has_content)?string((config.configLogo.configLogoTargetLink.getData()?has_content)?string(config.configLogo.configLogoTargetLink.getData(), cache.getLinkTarget(link)), "")
986 />
987
988 <div class="logo-header">
989 <#if link?has_content>
990 <a href="${link}" target="${target}"> 991 </#if>
992
993 <#assign style = "" />
994 <#if logoImgWidth?has_content && logoImgWidth != "0">
995 <#assign style += "width: " + logoImgWidth + "px;" />
996 </#if>
997 <#if logoImgHeight?has_content && logoImgHeight != "0">
998 <#assign style += "height: " + logoImgHeight + "px;" />
999 </#if>
1000
1001 <img alt="${config.configLogo.configLogoImage.getAttribute("alt")}" data-fileentryid="${config.configLogo.configLogoImage.getAttribute("fileEntryId")}" src="${logoImg}" style="${style}" /> 1002 <#if link?has_content>
1003 </a>
1004 </#if>
1005 </div>
1006 </#if>
1007 </div>
1008
1009 <div class="supramenu-right">
1010 <ul class="supramenu__list supramenu__list--right">
1011 <#if htmlC2?has_content>
1012 ${htmlC2} 1013 </#if>
1014
1015 <#if htmlC3?has_content>
1016 ${htmlC3} 1017 </#if>
1018
1019 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowPrivate.getData())>
1020 <li id="userMenuLi" class="supramenu__item supramenu__item--login"
1021 data-group="${themeDisplay.getSiteGroupId()}" 1022 data-market="${currentMarket.getCode()}" 1023 data-language="${themeDisplay.getLanguageId()}" 1024 data-debug="${cache.debugMarginals()?c}" 1025 >
1026 <div class="loader-roca active">
1027 <div class="lds-css">
1028 </div>
1029 <div class="lds-load">
1030 <div></div>
1031 <div></div>
1032 <div></div>
1033 </div>
1034 </li>
1035 </#if>
1036
1037
1038 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowCart.getData()) && hasCommerce>
1039 <li class="supramenu__item js-h-cart">
1040 <a class="right-menu__link" id="cartIcon" href="${cache.getEcommerceURL(request, '/checkout/cart')}" title="${cache.translate(locale, 'Go to cart')}"> 1041 <span class="icon-cart"></span>
1042 <span class="items-cart">-</span>
1043 </a>
1044 </li>
1045 </#if>
1046
1047 <#if htmlCCta?has_content>
1048 <div class="supramenu__item--cta">
1049 ${htmlCCta} 1050 </div>
1051 </#if>
1052 </ul>
1053 </div>
1054 </div>
1055 </div>
1056 </div>
1057 </section>
1058 <#-- END SUPRA MENU -->
1059
1060 <#-- INIT MAIN MENU -->
1061 <#assign hideMainHeader = config.configAuxElements.configAuxElementsHideMainHeader?? && getterUtil.getBoolean(config.configAuxElements.configAuxElementsHideMainHeader.getData()) />
1062
1063
1064 <section class="main-nav js-main-nav <#if hideMainHeader>d-none</#if>">
1065 <div class="main-nav-container container">
1066 <div class="main-menu-container">
1067 <@drawMainMenu />
1068
1069 <div class="logo-search-header container" id="logo-search-header">
1070 <#if getterUtil.getBoolean(config.configAuxElements.configAuxElementsShowSearch.getData())>
1071 <@drawSearchHeader />
1072 </#if>
1073 </div>
1074 </div>
1075 </div>
1076 </section>
1077 <#-- END MAIN MENU -->
1078 </div>
1079
1080 <#-- INIT SEARCH MODAL -->
1081
1082 <div id="rs-search-modal" class="r-modal search-modal"></div>
1083
1084 <#-- END SEARCH MODAL -->
1085
1086 <#-- INIT MINI-CART MODAL -->
1087
1088 <div class="r-modal mini-cart-collapse">
1089 <div class="close-menu">
1090 <div class="wrapper">
1091 <a href="javascript:void(0)" class="js-close icon-close"></a>
1092 </div>
1093 </div>
1094
1095 <div class="r-modal__wrapper"></div>
1096 </div>
1097
1098 <#-- END MINI-CART MODAL -->
1099
1100 <#-- INIT PROMOTIONAL BANNER MODAL -->
1101
1102 <#if promoBanner.promoBannerPopup.getData()?? && promoBanner.promoBannerPopup.getData()?has_content>
1103 <div class="lightbox-wrapper">
1104 <div class="modal fade modal-lightbox" id="promoBannerDisp" tabindex="-1" role="dialog" aria-labelledby="" style="display: none;" aria-hidden="true">
1105 <div class="modal-dialog modal-lg" role="document" style="top: 20%;">
1106 <div class="container">
1107 <div class="close-menu">
1108 <div class="wrapper">
1109 <a role="button" data-dismiss="modal" id="promoBannerDisp" class="js-close icon-close"></a>
1110 </div>
1111 </div>
1112 </div>
1113 <div class="r-modal__wrapper">
1114 <div class="container">
1115 <section style="background-color:white !important;" class="form-modal">
1116 <div class="container">
1117 <div class="row">
1118 <div class="col-12 col-md-12 promomenu-modal">
1119 ${promoBanner.promoBannerPopup.getData()} 1120 </div>
1121 </div>
1122 </div>
1123 </section>
1124 </div>
1125 </div>
1126 </div>
1127 </div>
1128 </div>
1129 </#if>
1130
1131 <#-- END PROMOTIONAL BANNER MODAL -->
1132
1133 </div>
1134
1135 <#-- INIT SIDE MENU -->
1136
1137 <@drawSideMenu "MENU" />
1138
1139 <#-- END SIDE MENU -->
1140
1141 <#-- INIT LANGUAGE & COUNTRY MODAL -->
1142
1143 <@drawSideMenu "LANGUAGE" />
1144
1145 <#-- END LANGUAGE & COUNTRY MODAL -->
1146
1147 </header>
1148</#if>
