Si è verificato un errore nell'elaborarazione del modello.
The following has evaluated to null or missing:
==> coordinateTestuali  [in template "1315478#1315513#1688155" at line 33, column 6]

----
Tip: If the failing expression is known to be legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----

----
FTL stack trace ("~" means nesting-related):
	- Failed at: #if coordinateTestuali.getData()?has_...  [in template "1315478#1315513#1688155" at line 33, column 1]
----
1<#include "_TEMPLATE_CONTEXT_/1315478/1331017/23609/1656602"> 
2 
3<#assign 
4    articleId = .vars['reserved-article-id'].data 
5    territorioCategories = getContentVocabularyCategories(articleId, "TERRITORIO", groupId) 
6    stagioneCategories = getContentVocabularyCategories(articleId, "STAGIONI", groupId) 
7    targetCategories = getContentVocabularyCategories(articleId, "TARGET", groupId) 
8    groupedCategories = getNavCircCategories(articleId, groupId) 
9    sliderCategories = [] 
10    slides = 0 
11    hasSlides = false 
12    hasGallery = false 
13    hasTappe = false 
14    hasGPX = false 
15    lat = 0 
16    lng = 0 
17/> 
18 
19<#list territorioCategories as tCat> 
20    <#if tCat.parentCategoryId != 0> 
21        <#assign sliderCategories += [tCat.name]> 
22    </#if> 
23</#list> 
24 
25<#if geoRef?? && geoRef.getData()?has_content> 
26    <#assign 
27        geolocationJSONObject = jsonFactoryUtil.createJSONObject(geoRef.getData()) 
28        lat = geolocationJSONObject.getDouble("latitude") 
29        lng = geolocationJSONObject.getDouble("longitude") 
30    /> 
31</#if> 
32 
33<#if coordinateTestuali.getData()?has_content> 
34    <#assign 
35        lat = coordinateTestuali.getData()?keep_before(",")?number 
36        lng = coordinateTestuali.getData()?keep_after(",")?number 
37    /> 
38</#if> 
39 
40<#list tappa.getSiblings() as t> 
41    <#if t.titolo.getData()?has_content> 
42        <#assign hasTappe = true> 
43        <#break> 
44    </#if> 
45</#list> 
46 
47<#if slideHeader?? && slideHeader.getSiblings()?has_content> 
48    <#list slideHeader.getSiblings() as slide> 
49        <#if slide.getData()?has_content> 
50            <#assign 
51                hasSlides = true 
52                slides = slideHeader.getSiblings()?size 
53            /> 
54            <#break> 
55        </#if> 
56    </#list> 
57</#if> 
58 
59<#if ImmagineGallery?? && ImmagineGallery.getSiblings()?has_content> 
60    <#list ImmagineGallery.getSiblings() as item> 
61        <#if item.getData()?has_content> 
62            <#assign hasGallery = true> 
63            <#break> 
64        </#if> 
65    </#list> 
66</#if> 
67 
68<style> 
69    .no-shadow{ 
70        box-shadow: none; 
71
72</style> 
73 
74<!-- Modello itinerario --> 
75 
76<div id="${portletNamespace}" v-cloak> 
77    <section id="slideshow" class="diagonal-divider tw:h-partial-screen"> 
78        <div class="swiper-container tw:h-full"> 
79            <div class="swiper-wrapper"> 
80                <#if hasSlides> 
81                    <#list slideHeader.getSiblings() as slide> 
82                        <div class="swiper-slide"> 
83                            <img data-src="${getPrefix(slide.getData(), 1920, 730)}" loading="lazy" class="lazyload tw:object-cover tw:h-full tw:w-full" alt="${slide.getAttribute('alt')}"/> 
84                            <div class="card-img-overlay tw:bg-dark tw:bg-opacity-40"></div> 
85                             
86                            <div class="carousel-caption tw:flex tw:text-left tw:transform lg:tw:top-2/4 lg:tw:-translate-y-2/4"> 
87                                <#if testoHeader?? && testoHeader.getData()?has_content> 
88                                    <#assign locationClass = "tw:my-auto"> 
89                                <#else> 
90                                    <#assign locationClass = "tw:mt-auto tw:mb-20"> 
91                                </#if> 
92                                 
93                                <div class="tw:flex tw:flex-col ${locationClass}"> 
94                                    <div class="hcm-bg-capable tw:text-white tw:font-heading tw:uppercase tw:text-2xl tw:mr-auto tw:p-4 tw:rounded-md lg:tw:text-4xl"> 
95                                        <#if testoHeader?? && testoHeader.getData()?has_content> 
96                                            <p>${testoHeader.getData()}</p> 
97                                            <div class="dropdown-divider tw:border-green tw:border-t-3 tw:w-3/5 tw:mt-5 tw:mr-auto lg:tw:w-1/5 lg:tw:mt-10"></div> 
98                                        </#if> 
99                                    </div> 
100                                    <#if sliderCategories?has_content> 
101                                        <div class="tw:flex tw:mt-7"> 
102                                            <i class="fas fa-map-marker-alt fa-2x tw:text-white"></i> 
103                                            <p class="tw:text-white tw:uppercase tw:font-heading tw:font-medium tw:my-auto tw:ml-3"> 
104                                                ${sliderCategories?join(", ")} 
105                                            </p> 
106                                        </div> 
107                                    </#if> 
108                                </div> 
109                            </div> 
110                        </div> 
111                    </#list> 
112                <#else> 
113                    <div class="swiper-slide"> 
114                        <img data-src="https://via.placeholder.com/1920x730" loading="lazy" class="lazyload tw:object-cover tw:h-full tw:w-full" alt=""/> 
115                        <div class="card-img-overlay tw:bg-dark tw:bg-opacity-40"></div> 
116     
117                        <div class="carousel-caption tw:flex tw:text-left tw:transform lg:tw:top-2/4 lg:tw:-translate-y-2/4"> 
118                            <#if testoHeader?? && testoHeader.getData()?has_content> 
119                                <#assign locationClass = "tw:my-auto"> 
120                            <#else> 
121                                <#assign locationClass = "tw:mt-auto tw:mb-20"> 
122                            </#if> 
123                                 
124                            <div class="tw:flex tw:flex-col ${locationClass}"> 
125                                <div class="hcm-bg-capable tw:text-white tw:font-heading tw:uppercase tw:text-2xl tw:mr-auto tw:p-4 tw:rounded-md lg:tw:text-4xl"> 
126                                    <#if testoHeader?? && testoHeader.getData()?has_content> 
127                                        <p>${testoHeader.getData()}</p> 
128                                        <div class="dropdown-divider tw:border-green tw:border-t-3 tw:w-3/5 tw:mt-5 tw:mr-auto lg:tw:w-1/5 lg:tw:mt-10"></div> 
129                                    </#if> 
130                                </div> 
131     
132                                <#if territorioCategories?has_content> 
133                                    <div class="tw:flex tw:mt-7"> 
134                                        <i class="fas fa-map-marker-alt fa-2x tw:text-white"></i> 
135                                        <p class="tw:text-white tw:uppercase tw:font-heading tw:font-medium tw:my-auto tw:ml-3"> 
136                                            <#list territorioCategories as cat> 
137                                                <#if cat.parentCategoryId != 0> 
138                                                    ${cat.name} 
139     
140                                                    <#if cat?has_next>,</#if> 
141                                                </#if> 
142                                            </#list> 
143                                        </p> 
144                                    </div> 
145                                </#if> 
146                            </div> 
147                        </div> 
148                    </div> 
149                </#if> 
150            </div> 
151        </div> 
152    </section> 
153     
154    <#if themeDisplay.getLayout().getAncestors()?has_content> 
155        <section id="breadcrumb" class="tw:font-heading tw:text-base tw:mt-4 <lg:tw:hidden"> 
156            <div class="container tw:flex tw:flex-row tw:justify-between"> 
157                <ol class="breadcrumb tw-space-x-2"> 
158                    <li class="breadcrumb-item"> 
159                        <a href="/" class="breadcrumb-link" title="Home"> 
160                            <span class="breadcrumb-text-truncate tw:text-dark tw:uppercase">Home</span> 
161                        </a> 
162                    </li> 
163                     
164                    <#list themeDisplay.getLayout().getAncestors()?reverse as ancestor> 
165                        <li class="breadcrumb-item"> 
166                            <a href="${ancestor.getFriendlyURL()}" class="breadcrumb-link" title="${escape(ancestor.getHTMLTitle(themeDisplay.getLocale()))}"> 
167                                <span class="breadcrumb-text-truncate tw:text-dark tw:uppercase">${escape(ancestor.getHTMLTitle(themeDisplay.getLocale()))}</span> 
168                            </a> 
169                        </li> 
170                    </#list> 
171                     
172                    <li class="breadcrumb-item active"> 
173                        <span class="tw:text-green tw:uppercase" title="${title.getData()?js_string}"> 
174                            ${title.getData()} 
175                        </span> 
176                    </li> 
177                </ol> 
178                 
179                <div class="tw:flex tw:align-center"> 
180                    <button type="button" @click="isFavorite(item.id) ? removeFavorite(item) : setFavorite(item);" class="btn btn-link tw:no-underline" :title="isFavorite(item.id) ? `${getLabel('rimuovi_preferiti', groupId)}` : `${getLabel('aggiungi_preferiti', groupId)}`"> 
181                        <i :class="(isFavorite(item.id) ? 'fas' : 'fal') + ' fa-heart fa-2x tw:text-green'"></i> 
182                    </button> 
183                     
184                    <div class="btn dropdown tw:px-0"> 
185                        <button type="button" class="btn btn-link dropdown-toggle tw:no-underline tw:text-green" data-toggle="dropdown"> 
186                            <i class="fas fa-share-alt fa-2x"></i> 
187                        </button> 
188                        <div class="dropdown-menu dropdown-menu-center"> 
189                            <button type="button" @click="customShare('facebook', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
190                                <i class="fab fa-facebook-f fa-lg tw:text-green"></i> 
191                                <span class="tw:text-dark"> 
192                                    Facebook 
193                                </span> 
194                            </button> 
195                             
196                            <button type="button" @click="customShare('twitter', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
197                                <i class="fab fa-twitter fa-lg tw:text-green"></i> 
198                                <span class="tw:text-dark"> 
199                                    Twitter 
200                                </span> 
201                            </button> 
202                             
203                            <button type="button" @click="customShare('pinterest', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
204                                <i class="fab fa-pinterest fa-lg tw:text-green"></i> 
205                                <span class="tw:text-dark"> 
206                                    Pinterest 
207                                </span> 
208                            </button> 
209                             
210                            <button type="button" @click="customShare('whatsapp', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
211                                <i class="fab fa-whatsapp fa-lg tw:text-green"></i> 
212                                <span class="tw:text-dark"> 
213                                    WhatsApp 
214                                </span> 
215                            </button> 
216                             
217                            <button type="button" @click="customShare('telegram', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
218                                <i class="fab fa-telegram fa-lg tw:text-green"></i> 
219                                <span class="tw:text-dark"> 
220                                    Telegram 
221                                </span> 
222                            </button> 
223                             
224                            <button type="button" @click="customShare('print', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
225                                <i class="fas fa-print fa-lg tw:text-green"></i> 
226                                <span class="tw:text-dark"> 
227                                    Print 
228                                </span> 
229                            </button> 
230                             
231                            <a :href="'mailto:inserisci indirizzo email?subject=' + item.contentJSON.title + '&body=${currentUrl} ' + item.contentJSON.description" class="dropdown-item tw:space-x-2"> 
232                                <i class="fas fa-envelope fa-lg tw:text-green"></i> 
233                                <span class="tw:text-dark"> 
234                                    Email 
235                                </span> 
236                            </a> 
237                             
238                            <button type="button" @click="customShare('link', item.contentJSON.title, item.contentJSON.description, item.contentJSON.previewPicture)" class="dropdown-item tw:space-x-2"> 
239                                <i class="fas fa-link fa-lg tw:text-green"></i> 
240                                <span class="tw:text-dark"> 
241                                    Link 
242                                </span> 
243                            </button> 
244                        </div> 
245                    </div> 
246                </div> 
247            </div> 
248        </section> 
249    </#if> 
250     
251    <section id="intro-description" class="tw:font-text tw:mt-5"> 
252        <div class="container tw:flex tw:flex-row tw:space-x-2 tw:justify-between tw:border-t-2 tw:border-gray-50"> 
253            <div class="tw:mt-10"> 
254                <#if title?? && title.getData()?has_content> 
255                    <p class="tw:text-green tw:font-heading tw:font-extrabold tw:text-2xl tw:uppercase lg:tw:text-4xl">${title.getData()}</p> 
256                </#if> 
257                 
258                <#if subTitle?? && subTitle.getData()?has_content> 
259                    <p class="tw:text-dark tw:font-heading tw:font-light tw:text-2xl tw:uppercase lg:tw:text-4xl"> 
260                    ${subTitle.getData()} 
261                    </p> 
262                </#if>   
263            </div> 
264            <div class="tw:flex tw:mt-9 lg:tw:hidden"> 
265                <button type="button" @click="isFavorite(item.id) ? removeFavorite(item) : setFavorite(item);" class="btn btn-link tw:no-underline" :title="isFavorite(item.id) ? `${getLabel('rimuovi_preferiti', groupId)}` : `${getLabel('aggiungi_preferiti', groupId)}`"> 
266                    <i :class="(isFavorite(item.id) ? 'fas' : 'fal') + ' fa-heart fa-lg tw:text-green'"></i> 
267                </button> 
268                <button type="button" @click="share(item.contentJSON.title, item.contentJSON.description)" class="btn btn-link tw:no-underline"> 
269                    <i class="fas fa-share-alt fa-lg tw:text-green"></i> 
270                </button> 
271            </div> 
272        </div> 
273        <div class="tw:flex tw:justify-end tw:mt-5 lg:tw:-mt-7"> 
274            <p class="tw:text-dark tw:uppercase tw:font-heading tw:font-bold tw:border-b-3 tw:border-gray-100 tw:pr-10 lg:tw:pr-30"> 
275            ${pathLengthText.getData()} 
276            </p> 
277        </div> 
278         
279        <div class="container"> 
280            <div class="row"> 
281                <div class="col-12 col-lg-7"> 
282                    <#if introDescription?? && introDescription.getData()?has_content> 
283                        <div class="tw:text-dark tw:font-light tw:mt-14"> 
284                            ${introDescription.getData()} 
285                        </div> 
286                    </#if> 
287                     
288                    <#-- 
289                    <button type="button" class="btn btn-link tw:underline tw:text-dark tw:font-bold tw:italic tw:px-0 tw:mt-4">Leggi tutto</button> 
290                    --> 
291                </div> 
292                <div class="col-12 col-lg-5"> 
293                <!-- ?  QUI IMMAGINE previewPicture ? --> 
294                </div> 
295            </div> 
296        </div> 
297    </section> 
298     
299    <section id="itinerary-detail" class="tw:font-text tw:mt-20"> 
300        <div class="container"> 
301            <div class="tw:mt-10"> 
302                <!-- ? QUI TITOLO FISSO  O TITOLO DEL CONTENUTO  --> 
303            </div> 
304            <div class="card hcm-bg-capable tw:relative tw:bg-green tw:border-0 tw:rounded-md tw:shadow-2xl tw:mt-10 tw:z-10"> 
305                <div class="card-body"> 
306                    <div class="container"> 
307                        <div class="row"> 
308                             
309                         
310                             
311                            <#if difficoltaText?? && difficoltaText.getData()?has_content> 
312                            <div class="col-12 col-md-6 col-lg-3"> 
313                                <div class="card-row tw:space-x-4 tw:mb-10"> 
314                                    <div class="autofit-col"> 
315                                        <div class="autofit-section"> 
316                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
317                                                <i class="fas fa-tachometer-fast fa-lg tw:text-white"></i> 
318                                            </div> 
319                                        </div> 
320                                    </div> 
321                                    <div class="autofit-col autofit-col-expand"> 
322                                        <div class="autofit-section"> 
323                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("difficolta")}</p> 
324                                            <p class="tw:text-white">${difficoltaText.getData()}</p> 
325                                        </div> 
326                                    </div> 
327                                </div> 
328                            </div> 
329                            </#if> 
330                             
331                            <#if esposizioneText?? && esposizioneText.getData()?has_content> 
332                            <div class="col-12 col-md-6 col-lg-3"> 
333                                <div class="card-row tw:space-x-4 tw:mb-10"> 
334                                    <div class="autofit-col"> 
335                                        <div class="autofit-section"> 
336                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
337                                                <i class="fas fa-signal fa-lg tw:text-white"></i> 
338                                            </div> 
339                                        </div> 
340                                    </div> 
341                                    <div class="autofit-col autofit-col-expand"> 
342                                        <div class="autofit-section"> 
343                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("esposizione")}</p> 
344                                            <p class="tw:text-white">${esposizioneText.getData()}</p> 
345                                        </div> 
346                                    </div> 
347                                </div> 
348                            </div> 
349                            </#if> 
350                            <#if pathLengthText?? && pathLengthText.getData()?has_content> 
351                            <div class="col-12 col-md-6 col-lg-3"> 
352                                <div class="card-row tw:space-x-4 tw:mb-10"> 
353                                    <div class="autofit-col"> 
354                                        <div class="autofit-section"> 
355                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
356                                                <i class="fas fa-arrows-h fa-lg tw:text-white"></i> 
357                                            </div> 
358                                        </div> 
359                                    </div> 
360                                    <div class="autofit-col autofit-col-expand"> 
361                                        <div class="autofit-section"> 
362                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("distanza")}</p> 
363                                            <p class="tw:text-white">${pathLengthText.getData()}</p> 
364                                        </div> 
365                                    </div> 
366                                </div> 
367                            </div> 
368                            </#if> 
369                            <#if totalTimeText?? && totalTimeText.getData()?has_content> 
370                            <div class="col-12 col-md-6 col-lg-3"> 
371                                <div class="card-row tw:space-x-4 tw:mb-10"> 
372                                    <div class="autofit-col"> 
373                                        <div class="autofit-section"> 
374                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
375                                                <i class="fas fa-clock fa-lg tw:text-white"></i> 
376                                            </div> 
377                                        </div> 
378                                    </div> 
379                                    <div class="autofit-col autofit-col-expand"> 
380                                        <div class="autofit-section"> 
381                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("tempo_necessario")}</p> 
382                                            <p class="tw:text-white">${totalTimeText.getData()}</p> 
383                                        </div> 
384                                    </div> 
385                                </div> 
386                            </div> 
387                            </#if> 
388                            <#if timeText?? && timeText.getData()?has_content> 
389                            <div class="col-12 col-md-6 col-lg-3"> 
390                                <div class="card-row tw:space-x-4 tw:mb-10"> 
391                                    <div class="autofit-col"> 
392                                        <div class="autofit-section"> 
393                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
394                                                <i class="fas fa-clock fa-lg tw:text-white"></i> 
395                                            </div> 
396                                        </div> 
397                                    </div> 
398                                    <div class="autofit-col autofit-col-expand"> 
399                                        <div class="autofit-section"> 
400                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("tempo_di_percorso")}</p> 
401                                            <p class="tw:text-white">${timeText.getData()}</p> 
402                                        </div> 
403                                    </div> 
404                                </div> 
405                            </div> 
406                            </#if> 
407                            <#if startingAltitude?? && startingAltitude.getData()?has_content> 
408                            <div class="col-12 col-md-6 col-lg-3"> 
409                                <div class="card-row tw:space-x-4 tw:mb-10"> 
410                                    <div class="autofit-col"> 
411                                        <div class="autofit-section"> 
412                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
413                                                <i class="fas fa-arrow-to-bottom fa-lg tw:text-white"></i> 
414                                            </div> 
415                                        </div> 
416                                    </div> 
417                                    <div class="autofit-col autofit-col-expand"> 
418                                        <div class="autofit-section"> 
419                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("quota_di_partenza")}</p> 
420                                            <p class="tw:text-white">${startingAltitude.getData()} mt</p> 
421                                        </div> 
422                                    </div> 
423                                </div> 
424                            </div> 
425                            </#if> 
426                            <#if endingAltitude?? && endingAltitude.getData()?has_content> 
427                             <div class="col-12 col-md-6 col-lg-3"> 
428                                <div class="card-row tw:space-x-4 tw:mb-10"> 
429                                    <div class="autofit-col"> 
430                                        <div class="autofit-section"> 
431                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
432                                                <i class="fas fa-arrow-to-top fa-lg tw:text-white"></i> 
433                                            </div> 
434                                        </div> 
435                                    </div> 
436                                    <div class="autofit-col autofit-col-expand"> 
437                                        <div class="autofit-section"> 
438                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("quota_di_arrivo")}</p> 
439                                            <p class="tw:text-white">${endingAltitude.getData()} mt</p> 
440                                        </div> 
441                                    </div> 
442                                </div> 
443                            </div> 
444                            </#if> 
445                            <#if levelDifference?? && levelDifference.getData()?has_content> 
446                             <div class="col-12 col-md-6 col-lg-3"> 
447                                <div class="card-row tw:space-x-4 tw:mb-10"> 
448                                    <div class="autofit-col"> 
449                                        <div class="autofit-section"> 
450                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
451                                                <i class="fas fa-arrows-v fa-lg tw:text-white"></i> 
452                                            </div> 
453                                        </div> 
454                                    </div> 
455                                    <div class="autofit-col autofit-col-expand"> 
456                                        <div class="autofit-section"> 
457                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("dislivello")}</p> 
458                                            <p class="tw:text-white">${levelDifference.getData()} mt</p> 
459                                        </div> 
460                                    </div> 
461                                </div> 
462                            </div> 
463                            </#if> 
464                            <#if puntoPiuAltoBassoText?? && puntoPiuAltoBassoText.getData()?has_content> 
465                             <div class="col-12 col-md-6 col-lg-3"> 
466                                <div class="card-row tw:space-x-4 tw:mb-10"> 
467                                    <div class="autofit-col"> 
468                                        <div class="autofit-section"> 
469                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
470                                                <i class="fas fa-arrows-v fa-lg tw:text-white"></i> 
471                                            </div> 
472                                        </div> 
473                                    </div> 
474                                    <div class="autofit-col autofit-col-expand"> 
475                                        <div class="autofit-section"> 
476                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("punto_piu_basso_piu_alto")}</p> 
477                                            <p class="tw:text-white">${puntoPiuAltoBassoText.getData()}</p> 
478                                        </div> 
479                                    </div> 
480                                </div> 
481                            </div> 
482                            </#if> 
483                             
484                            <#if stagioneCategories?has_content> 
485                            <div class="col-12 col-md-6 col-lg-3"> 
486                                <div class="card-row tw:space-x-4 tw:mb-10"> 
487                                    <div class="autofit-col"> 
488                                        <div class="autofit-section"> 
489                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
490                                                <i class="fas fa-calendar-alt fa-lg tw:text-white"></i> 
491                                            </div> 
492                                        </div> 
493                                    </div> 
494                                    <div class="autofit-col autofit-col-expand"> 
495                                        <div class="autofit-section"> 
496                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("stagione")}</p> 
497                                            <p class="tw:text-white"> 
498                                            <#list stagioneCategories as cat> 
499                                                 
500                                                    ${cat.getTitle(locale)} 
501                                                    <#if cat?has_next>,</#if> 
502                                                 
503                                            </#list> 
504                                            </p> 
505                                        </div> 
506                                    </div> 
507                                </div> 
508                            </div> 
509                            </#if> 
510                            <#if periodoConsigliatoText?? && periodoConsigliatoText.getData()?has_content> 
511                             <div class="col-12 col-md-6 col-lg-3"> 
512                                <div class="card-row tw:space-x-4 tw:mb-10"> 
513                                    <div class="autofit-col"> 
514                                        <div class="autofit-section"> 
515                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
516                                                <i class="fas fa-calendar-alt fa-lg tw:text-white"></i> 
517                                            </div> 
518                                        </div> 
519                                    </div> 
520                                    <div class="autofit-col autofit-col-expand"> 
521                                        <div class="autofit-section"> 
522                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("periodo_consigliato")}</p> 
523                                            <p class="tw:text-white">${periodoConsigliatoText.getData()}</p> 
524                                        </div> 
525                                    </div> 
526                                </div> 
527                            </div> 
528                            </#if> 
529                            <#if percorsoTipoText?? && percorsoTipoText.getData()?has_content> 
530                             <div class="col-12 col-md-6 col-lg-3"> 
531                                <div class="card-row tw:space-x-4 tw:mb-10"> 
532                                    <div class="autofit-col"> 
533                                        <div class="autofit-section"> 
534                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
535                                                <i class="fas fa-sync fa-lg tw:text-white"></i> 
536                                            </div> 
537                                        </div> 
538                                    </div> 
539                                    <div class="autofit-col autofit-col-expand"> 
540                                        <div class="autofit-section"> 
541                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("tipo_di_percorso")}</p> 
542                                            <p class="tw:text-white">${percorsoTipoText.getData()}</p> 
543                                        </div> 
544                                    </div> 
545                                </div> 
546                            </div> 
547                            </#if> 
548                            <#if biciTipoText?? && biciTipoText.getData()?has_content> 
549                             <div class="col-12 col-md-6 col-lg-3"> 
550                                <div class="card-row tw:space-x-4 tw:mb-10"> 
551                                    <div class="autofit-col"> 
552                                        <div class="autofit-section"> 
553                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
554                                                <i class="fas fa-bicycle fa-lg tw:text-white"></i> 
555                                            </div> 
556                                        </div> 
557                                    </div> 
558                                    <div class="autofit-col autofit-col-expand"> 
559                                        <div class="autofit-section"> 
560                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("adatto_a")}</p> 
561                                            <p class="tw:text-white">${biciTipoText.getData()}</p> 
562                                        </div> 
563                                    </div> 
564                                </div> 
565                            </div> 
566                            </#if> 
567                            <#if targetCategories?has_content> 
568                            <div class="col-12 col-md-6 col-lg-3"> 
569                                <div class="card-row tw:space-x-4 tw:mb-10"> 
570                                    <div class="autofit-col"> 
571                                        <div class="autofit-section"> 
572                                            <div class="sticker sticker-circle sticker-lg tw:border-2 border-white"> 
573                                                <i class="fas fa-chart-pie-alt fa-lg tw:text-white"></i> 
574                                            </div> 
575                                        </div> 
576                                    </div> 
577                                    <div class="autofit-col autofit-col-expand"> 
578                                        <div class="autofit-section"> 
579                                            <p class="tw:text-white tw:uppercase tw:font-bold tw:font-heading">${getLabel("target")}</p> 
580                                            <p class="tw:text-white"> 
581                                            <#list targetCategories as cat2> 
582                                                 
583                                                    ${cat2.getTitle(locale)} 
584                                                    <#if cat2?has_next>,</#if> 
585                                                 
586                                            </#list> 
587                                            </p> 
588                                        </div> 
589                                    </div> 
590                                </div> 
591                            </div> 
592                            </#if> 
593                        </div> 
594                    </div> 
595                </div> 
596            </div> 
597            <#if noteAggiuntive?? && noteAggiuntive.getData()?has_content> 
598            <div class="card-body tw:relative tw:py-0 tw:-mt-15 tw:z-15"> 
599                <div class="container"> 
600                    <button type="button" class="btn btn-link card tw:bg-white tw:border-none tw:shadow-2xl tw:rounded-md tw:p-0" data-toggle="collapse" data-target="#notes"> 
601                        <div class="card-body"> 
602                            <div class="card-row tw:space-x-4"> 
603                                <div class="autofit-col"> 
604                                    <div class="autofit-section"> 
605                                        <div class="sticker sticker-circle tw:border-2 border-white"><i class="plus-icon fas fa-plus fa-2x tw:text-dark"></i><i class="minus-icon fas fa-minus fa-2x tw:text-dark tw:hidden"></i></div> 
606                                    </div> 
607                                </div> 
608                                <div class="autofit-col autofit-col-expand tw:pr-20"> 
609                                    <div class="autofit-section"> 
610                                        <p class="tw:text-dark tw:font-bold tw:font-heading tw:uppercase">${getLabel("note")}</p> 
611                                    </div> 
612                                </div> 
613                            </div> 
614                        </div> 
615                    </button> 
616                </div> 
617            </div> 
618             
619            <div class="tw:-mt-15 tw:z-5"> 
620                <div id="notes" class="collapse"> 
621                    <div class="card tw:bg-white tw:border-0 tw:rounded-md tw:shadow-2xl tw:mb-0 tw:z-5"> 
622                        <div class="card-body"> 
623                            <div class="container"> 
624                                <div class="tw:text-dark tw:font-light tw:mt-10">${noteAggiuntive.getData()}</div> 
625                            </div> 
626                        </div> 
627                    </div> 
628                </div> 
629            </div> 
630        </div> 
631        </#if> 
632    </section> 
633     
634    <#if gpx?? && gpx.getData()?has_content> 
635        <#assign hasGPX = true> 
636         
637        <section id="download" class="tw:font-text tw:pt-20 tw:mt-20"> 
638            <div class="container"> 
639                <a href="${gpx.getData()}" class="btn btn-link tw:bg-green tw:text-white tw:uppercase tw:font-heading tw:rounded-md tw:py-2 tw:px-3" title="${getLabel('download-gpx')}"> 
640                    ${getLabel("download-gpx")} 
641                    <i class="fal fa-download fa-lg ml-2"></i> 
642                </a> 
643            </div> 
644        </section> 
645    </#if> 
646     
647    <section id="map" class="tw:font-text tw:mt-20"> 
648        <div class="container"> 
649            <div class="card-row tw:mb-5 <lg:tw:flex-col"> <#-- tw:pt-20 --> 
650                <div class="autofit-col"> 
651                    <div class="tw:mt-10"> 
652                        <p class="tw:text-dark tw:font-heading tw:font-extrabold tw:text-2xl tw:uppercase lg:tw:text-4xl">${getLabel("le_tappe_itinerario1")}</p> 
653                        <p class="tw:text-dark tw:font-heading tw:font-light tw:text-2xl tw:uppercase lg:tw:text-4xl">${getLabel("le_tappe_itinerario2")}</p> 
654                    </div> 
655                </div> 
656                <div class="autofit-col autofit-col-expand"> 
657                    <div class="tw:flex tw:mt-3 lg:tw:ml-auto lg:mt-0"> 
658                        <ul role="tablist" class="nav nav-tabs tw:order-1 tw:space-x-4 tw:ml-auto lg:tw:order-2 lg:ml-4"> 
659                            <li class="nav-item"> 
660                                <a href="#tab_grid" class="sticker sticker-lg tw:flex tw:bg-dark tw:text-white tw:rounded-none tw:no-underline" data-toggle="tab"> 
661                                    <i class="fas fa-th fa-lg"></i> 
662                                </a> 
663                            </li> 
664                            <li class="nav-item"> 
665                                <a href="#tab_list" class="sticker sticker-lg tw:flex tw:bg-dark tw:text-white tw:rounded-none tw:no-underline" data-toggle="tab"> 
666                                    <i class="fas fa-list fa-lg"></i> 
667                                </a> 
668                            </li> 
669                            <li class="nav-item"> 
670                                <a href="#tab_map" class="sticker sticker-lg hcm-text-capable tw:flex tw:bg-dark tw:text-white tw:rounded-none tw:no-underline active show" data-toggle="tab"> 
671                                    <i class="fas fa-map-marker-alt fa-lg"></i> 
672                                </a> 
673                            </li> 
674                        </ul> 
675                    </div> 
676                </div> 
677            </div> 
678        </div> 
679        <div class="tab-content tw:border-t-2 tw:border-gray-100 tw:pt-10"> 
680            <div id="tab_grid" class="tab-pane fade"> 
681                <div class="container"> 
682                    <div class="row"> 
683                         
684                        <#if hasTappe> 
685                            <#list tappa.getSiblings() as item> 
686                                <div class="col-12 col-lg-6"> 
687                                    <div class="card tw:border-0 tw:shadow-2xl tw:rounded-md"> 
688                                        <div class="aspect-ratio aspect-ratio-4-to-3 tw:rounded-md"> 
689                                            <img data-src="${getPrefix(item.immaginePreview.getData(), 900, 675)}" loading="lazy" class="lazyload aspect-ratio-item-fluid tw:object-cover tw:w-full tw:h-full" alt="${item.getAttribute('alt')!''}" /> 
690                                        </div> 
691                                        <div class="card-img-overlay tw:rounded-b-md tw:bg-gradient-to-t tw:from-dark tw:to-transparent tw:opacity-60 tw:h-2/5 tw:mt-auto"></div> 
692                                        <div class="card-img-overlay tw:pointer-events-none tw:rounded-t-md tw:p-0"> 
693                                            <div class="tw:flex tw:justify-end tw:w-full"> 
694                                                <div class="triangle-top-right"> 
695                                                    <div class="shape"></div> 
696                                                    <button type="button" class="btn btn-link btn-monospaced tw:absolute tw:inset-0 tw:pointer-events-auto tw:ml-auto tw:mt-3 tw:mr-3"> 
697                                                        <i class="fal fa-heart fa-lg tw:text-white"></i> 
698                                                    </button> 
699                                                </div> 
700                                            </div> 
701                                        </div> 
702                                        <div class="xl:tw:h-1/4 card-img-overlay hcm-bg-capable tw:rounded-b-md tw:h-2/5 tw:mt-auto"> 
703                                            <div class="card-body tw:border-l-2 tw:border-green tw:pb-0"> 
704                                                <div class="card-row"> 
705                                                    <div class="autofit-col autofit-col-expand"> 
706                                                        <p class="tw:text-white tw:uppercase tw:font-heading tw:font-bold tw:mt-4 tw:mb-2">${item.titolo.getData()}</p> 
707                                                        <p class="tw:text-white tw:uppercase tw:font-heading tw:text-xs">#hashtag #hashtag</p> 
708                                                    </div> 
709                                                    <div class="autofit-col"> 
710                                                        <div class="autofit-section"> 
711                                                            <div class="sticker sticker-xl sticker-circle tw:ring-white tw:ring-2"> 
712                                                                <i class="fas fa-trees fa-lg tw:text-white"></i> 
713                                                            </div> 
714                                                        </div> 
715                                                    </div> 
716                                                </div> 
717                                            </div> 
718                                        </div> 
719                                    </div> 
720                                </div> 
721                            </#list> 
722                        <#else> 
723                            <div class="col-12"> 
724                                <div class="tw:text-center"> 
725                                    <p class="tw:text-dark">${getLabel('nessun_risultato')}</p> 
726                                </div> 
727                            </div> 
728                        </#if> 
729                    </div> 
730                </div> 
731            </div> 
732            <div id="tab_list" class="tab-pane fade"> 
733                <div class="container"> 
734                    <div class="row"> 
735                        <#if hasTappe> 
736                             
737                        <#else> 
738                            <div class="col-12"> 
739                                <div class="tw:text-center"> 
740                                    <p class="tw:text-dark">${getLabel('nessun_risultato')}</p> 
741                                </div> 
742                            </div> 
743                        </#if> 
744                    </div> 
745                </div> 
746            </div> 
747            <div id="tab_map" class="tab-pane fade show active"> 
748                <div id="suggesto-map" class="monochrome-map primary-path" style="height: 500px;"></div> 
749            </div> 
750        </div> 
751         
752        <#if altimetria?? && altimetria.getData()?has_content> 
753            <div class="container tw:mt-10"> 
754                <div class="aspect-ratio aspect-ratio-16-to-9 tw:rounded-md"> 
755                    <img data-src="${getPrefix(altimetria.getData(), 1280, '')}" loading="lazy" class="lazyload aspect-ratio-item-fluid tw:object-cover tw:w-full tw:h-full" alt="${altimetria.getAttribute('alt')!''}" /> 
756                </div> 
757            </div> 
758        </#if> 
759    </section> 
760     
761    <#if hasGallery> 
762        <section id="gallery"> 
763            <div class="container"> 
764                <div class="swiper-container tw:pt-10"> 
765                    <#if (ImmagineGallery.getSiblings()?size > 1)> 
766                        <div class="swiper-button-prev tw:w-12 tw:h-12"> 
767                            <span class="sticker sticker-circle hcm-bg-capable tw:bg-green tw:w-full tw:h-full"> 
768                                <span class="sticker-overlay"> 
769                                    <i class="fas fa-chevron-left fa-2x text-white"></i> 
770                                </span> 
771                            </span> 
772                        </div> 
773                        <div class="swiper-button-next tw:w-12 tw:h-12"> 
774                            <span class="sticker sticker-circle hcm-bg-capable tw:bg-green tw:w-full tw:h-full"> 
775                                <span class="sticker-overlay"> 
776                                    <i class="fas fa-chevron-right fa-2x text-white"></i> 
777                                </span> 
778                            </span> 
779                        </div> 
780                    </#if> 
781                     
782                    <div class="swiper-wrapper"> 
783                        <#list ImmagineGallery.getSiblings() as pic> 
784                            <div class="swiper-slide"> 
785                                <a href="javascript:void(0);" class="card no-shadow tw:no-underline mb-0" data-toggle="modal" data-target="#lightbox-modal" data-slider="${pic?index}"> 
786                                    <div class="aspect-ratio aspect-ratio-4-to-3 tw:rounded-md tw:shadow-2xl"> 
787                                        <img data-src="${getPrefix(pic.getData(), 900, 675)}" loading="lazy" class="lazyload aspect-ratio-item-fluid tw:object-cover tw:w-full tw:h-full" alt="${pic.getAttribute('alt')!''}"  /> 
788                                    </div> 
789                                     
790                                    <#if pic.getAttribute("alt")?has_content> 
791                                        <div class="card-body bg-transparent px-0 pb-0"> 
792                                            <p class="text-dark small mb-0"> 
793                                                ${pic.getAttribute('alt')!''} 
794                                            </p> 
795                                        </div> 
796                                    </#if> 
797                                </a> 
798                            </div> 
799                        </#list> 
800                    </div> 
801                </div> 
802            </div> 
803             
804            <div id="lightbox-modal" tabindex="-1" role="dialog" class="modal fade"> 
805                <div class="modal-dialog modal-full-screen tw:inset-0 tw:border-none tw:shadow-none"> 
806                    <div class="modal-content tw:bg-transparent"> 
807                        <div class="modal-body tw:overflow-hidden"> 
808                            <div class="tw:absolute tw:top-0 tw:right-0 tw:z-5"> 
809                                <button type="button" data-dismiss="modal" class="btn btn-monospaced btn-secondary m-3"> 
810                                    <i class="fal fa-times fa-lg"></i> 
811                                </button> 
812                            </div> 
813                             
814                            <#-- lightbox --> 
815            				<div id="lightbox-swiper" class="swiper-container h-75 my-auto"> 
816            				    <div class="swiper-button-prev tw:w-12 tw:h-12"> 
817                                    <span class="sticker sticker-circle hcm-bg-capable tw:bg-green tw:w-full tw:h-full"> 
818                                        <span class="sticker-overlay"> 
819                                            <i class="fas fa-chevron-left fa-2x tw:text-white"></i> 
820                                        </span> 
821                                    </span> 
822                                </div> 
823                                 
824                                <div class="swiper-button-next tw:w-12 tw:h-12"> 
825                                    <span class="sticker sticker-circle hcm-bg-capable tw:bg-green tw:w-full tw:h-full"> 
826                                        <span class="sticker-overlay"> 
827                                            <i class="fas fa-chevron-right fa-2x tw:text-white"></i> 
828                                        </span> 
829                                    </span> 
830                                </div> 
831                                 
832                                <div class="swiper-wrapper tw:h-full"> 
833                                    <#list ImmagineGallery.getSiblings() as pic> 
834                                        <div class="swiper-slide tw:h-full"> 
835                                            <img data-src="${getPrefix(pic.getData(), 1920, '')}" loading="lazy" class="lazyload tw:h-full tw:object-contain tw:mx-auto" alt="${pic.getAttribute('alt')!''}"> 
836                                        </div> 
837                                    </#list> 
838                                </div> 
839                            </div> 
840                             
841                            <#-- thumbnails --> 
842            				<div id="thumbnail-swiper" class="swiper-container" thumbsSlider=""> 
843                                <div class="swiper-wrapper"> 
844                                    <#list ImmagineGallery.getSiblings() as pic> 
845                                        <div class="swiper-slide"> 
846                                            <img data-src="${getPrefix(pic.getData(), 300, '')}" loading="lazy" class="lazyload tw:object-cover tw:cursor-pointer tw:h-full tw:w-full" alt="${pic.getAttribute('alt')!''}"> 
847                                        </div> 
848                                    </#list> 
849                                </div> 
850                            </div> 
851                        </div> 
852                    </div> 
853                </div> 
854            </div> 
855        </section> 
856    </#if> 
857     
858    <#if description?? && description.getData()?has_content> 
859        <section id="description" class="tw:font-text tw:mt-20"> 
860            <div class="container"> 
861                <div class="tw:space-x-2 tw:mt-10"> 
862                    <p class="tw:inline tw:text-dark tw:font-heading tw:font-extrabold tw:text-2xl tw:uppercase lg:tw:text-4xl">${getLabel('scopri-di-piu-parte1')}</p> 
863                    <p class="tw:inline tw:text-dark tw:font-heading tw:font-light tw:text-2xl tw:uppercase lg:tw:text-4xl">${getLabel('scopri-di-piu-parte2')}</p> 
864                </div> 
865                <div class="tw:border-t-2 tw:border-gray-50 tw:pt-10 tw:mt-5"> 
866                    <div class="tw:flow-root"> 
867                        <#if description.ImmagineMain?? && description.ImmagineMain.getData()?has_content> 
868                            <div class="tw:w-full lg:tw:float-left lg:tw:w-5/12 lg:pr-5"> 
869                                <div class="aspect-ratio aspect-ratio-4-to-3 tw:rounded-md tw:shadow-2xl"> 
870                                    <img data-src="${getPrefix(description.ImmagineMain.getData(), 400, 300)}" loading="lazy" class="lazyload aspect-ratio-item-fluid tw:object-cover tw:w-full tw:h-full" alt="${description.ImmagineMain.getAttribute('alt')}" /> 
871                                </div> 
872                            </div> 
873                        </#if> 
874      
875                        <div class="tw:text-dark tw:font-light tw:mt-5 lg:tw:mt-0"> 
876                            ${description.getData()} 
877                        </div> 
878                    </div> 
879                </div> 
880            </div> 
881        </section> 
882    </#if> 
883</div> 
884 
885<script src="https://s3-eu-west-1.amazonaws.com/mkspresstage.suggesto.eu/components/securityV2.js"></script> 
886 
887<script src="https://s3-eu-west-1.amazonaws.com/mkspresstage.suggesto.eu/components/initVueApp.js"></script> 
888<script src="https://s3-eu-west-1.amazonaws.com/mkspresstage.suggesto.eu/mixins/js/favorites.js"></script> 
889<script src="https://s3-eu-west-1.amazonaws.com/mkspresstage.suggesto.eu/mixins/js/share.js"></script> 
890 
891<script> 
892    var ${portletNamespace}_custom_hook = { 
893        data: { 
894            debugMode: true, 
895            item: { 
896                id: "${articleId}", 
897                contentJSON: { 
898                    title: "${title.getData()?js_string}", 
899                    description: "${introDescription.getData()?js_string}", 
900                    geoRef: '${geoRef.getData()}', 
901                    previewPicture: "${previewPicture.getData()}", 
902                    viewUrl: window.location.href 
903
904            }, 
905            regionLat: "44.3921388", 
906            regionLng: "7.5211695", 
907            map: null, 
908            slider: null, 
909            gallery: null, 
910            thumbnails: null, 
911            lightbox: null, 
912            docs: [], 
913        }, 
914        mounted(){ 
915            var that = this; 
916             
917            this.buildStages(); 
918             
919            if(${hasSlides?c}){ 
920                this.initSlider(); 
921
922             
923            if(${hasGallery?c}){ 
924                this.initGallery(); 
925             
926                $("#lightbox-modal").on("shown.bs.modal", function(e){ 
927                    that.lightbox.update(); 
928                    that.thumbnails.update(); 
929                    that.lightbox.slideTo($(e.relatedTarget).data("slider")); 
930                    that.lightbox.update(); 
931                }); 
932                 
933                $("#lightbox-modal .swiper-wrapper").on("click", function(e){ 
934                    if($(e.target).attr("class").includes("swiper-slide")){ 
935                        $("#lightbox-modal").modal("hide"); 
936
937                }); 
938
939        }, 
940        methods: { 
941            buildStages: function(){ 
942                var layers = [], 
943                    markers = [], 
944                    map = new SuggestoMap("suggesto-map"); 
945 
946                this.docs.forEach(function (doc) { 
947                    if (doc.contentJSON.geoRef) { 
948                        var marker = { 
949                            group: "1", 
950                            latlng: [parseFloat(doc.contentJSON.geoRef.latitude), parseFloat(doc.contentJSON.geoRef.longitude)], 
951                            value: "", 
952                            type: "svgNumIcon", 
953                            size: "10", 
954                            color: "#7eba27", 
955                            html: "<div style='width:400px;' class='pure-g'>" + 
956                                        "<div class='pure-u-1-3'>" + 
957                                            "<img class='pure-img' src='" + doc.contentJSON.previewPicture + "' alt='" + doc.contentJSON.title + "'>" + 
958                                        "</div>" +  
959                                        "<div class='pure-u'>" +  
960                                            "<div class='l-box'>" +  
961                                                "<h5 class='l-boxh3 tw:text-green' style='width: 225px'>" + doc.contentJSON.title + "</h5>" +  
962                                                "<div class='l-boxp' style='width: 225px'>" + doc.contentJSON.introDescription + "</div>" + 
963                                                "<a class='pure-button tw:bg-green tw:text-white' href='" + doc.contentJSON.viewUrl + "' data-senna-off='true'>${getLabel('vedi')}</a>" + 
964                                            "</div>" + 
965                                        "</div>" + 
966                                    "</div>" 
967                        }; 
968 
969                        markers.push(marker); 
970
971                }); 
972                 
973                /* 
974                if(this.docs.length == 0 && ${(lat != 0)?c} && ${(lng != 0)?c}){ 
975                    var marker = { 
976                        group: "1", 
977                        latlng: [parseFloat(${lat}), parseFloat(${lng})], 
978                        value: "A", 
979                        type: "svgNumIcon", 
980                        size: "10", 
981                        color: "#7eba27", 
982                        html: "" 
983                    }; 
984 
985                    markers.push(marker); 
986
987                */ 
988                 
989                <#if hasGPX> 
990                    var layer = { 
991                        id: "1", 
992                        group: "1", 
993                        type: "gpxurl", 
994                        value: "${gpx.getData()}" 
995
996                     
997                    layers.push(layer); 
998                </#if> 
999 
1000                var mapData = { 
1001                    tilelayer: "osm", 
1002                    gestureHandling: true, 
1003                    fitBounds: false, 
1004                    mapcenter: [parseFloat(this.regionLat), parseFloat(this.regionLng)], 
1005                    zoom: 11, 
1006                    markersFilter: "*", 
1007                    markers: markers, 
1008                    layers: layers 
1009                }; 
1010 
1011                console.log("mapData is: ", mapData); 
1012 
1013                map.sm.createMap(mapData); 
1014                 
1015                map.sm.llist[0].layer.on("ready", function(){ 
1016                    map.sm.lmap.fitBounds(map.sm.llist[0].layer.getBounds()) 
1017                }); 
1018 
1019                this.map = map; 
1020            }, 
1021            initSlider: function(){ 
1022                this.slider = new Swiper("#slideshow .swiper-container", { 
1023        			loop: ${(slides > 0)?c}, 
1024        			effect: "fade", 
1025        			speed: 3000, 
1026        			allowTouchMove: false, 
1027        			autoplay: { 
1028        				delay: 3000, 
1029        				disableOnInteraction: false, 
1030        			}, 
1031        			fadeEffect: { 
1032        				crossFade: true, 
1033        			}, 
1034        		}); 
1035            }, 
1036            initGallery: function(){ 
1037                this.gallery = new Swiper("#gallery .swiper-container", { 
1038        			slidesPerView: 1, 
1039        			spaceBetween: 25, 
1040        			centerSlides: true, 
1041        			centerInsufficientSlides: true, 
1042        			navigation: { 
1043        				prevEl: ".btn-prev", 
1044        				nextEl: ".btn-next", 
1045        			}, 
1046        			breakpoints: { 
1047        				768: { 
1048        					slidesPerView: 2, 
1049        					spaceBetween: 25, 
1050        				}, 
1051        				992: { 
1052        					slidesPerView: 3, 
1053        					spaceBetween: 25, 
1054        				}, 
1055        			}, 
1056        		}); 
1057        		 
1058        		this.thumbnails = new Swiper("#thumbnail-swiper", { 
1059                    spaceBetween: 10, 
1060                    slidesPerView: 2, 
1061                    centerInsufficientSlides: true, 
1062                    freeMode: true, 
1063                    watchSlidesVisibility: true, 
1064                    watchSlidesProgress: true, 
1065        			breakpoints: { 
1066        				768: { 
1067        					slidesPerView: 3 
1068        				}, 
1069        				992: { 
1070        					slidesPerView: 4 
1071        				}, 
1072        				1200: { 
1073        					slidesPerView: 5 
1074
1075        			}, 
1076                }); 
1077                 
1078                this.lightbox = new Swiper("#lightbox-swiper", { 
1079        		    spaceBetween: 10, 
1080                    autoHeight: true, 
1081                    observer: true, 
1082                    observeSlideChildren: true, 
1083                    keyboard: { 
1084                        enabled: true 
1085                    }, 
1086                    navigation: { 
1087                        nextEl: ".swiper-button-next", 
1088                        prevEl: ".swiper-button-prev" 
1089                    }, 
1090                    thumbs: { 
1091                        swiper: this.thumbnails 
1092
1093                }); 
1094            }, 
1095            customShare: function(type, title, description, image = ""){ 
1096                if(type == "facebook"){ 
1097                    var winHeight = 450, 
1098                        winWidth = 600, 
1099                        winTop = window.screen.height / 2 - winHeight / 2, 
1100                        winLeft = window.screen.width / 2 - winWidth / 2, 
1101                        params = "scrollbars=no,resizable=no,status=no,location=no,toolbar=no,menubar=no,width=" + winWidth + ",height=" + winHeight + ",left=" + winLeft + ",top=" + winTop, 
1102                        link = "http://www.facebook.com/sharer.php?s=100&p[title]=" + encodeURIComponent(title) + "&p[summary]=" + encodeURIComponent(description) + "&p[url]=" + window.location.href + "&p[images][0]=" + image; 
1103     
1104                    window.open(link, "Facebook", params); 
1105
1106                 
1107                if(type == "twitter"){ 
1108                    var link = "https://twitter.com/intent/tweet?text=" + encodeURIComponent(title) + "&url=" + encodeURIComponent(window.location.href); 
1109                     
1110                    window.open(link, "_blank").focus(); 
1111
1112                 
1113                if(type == "pinterest"){ 
1114                    var link = "https://pinterest.com/pin/create/button/?url=" + encodeURIComponent(window.location.href) + "&description=" + encodeURIComponent(title); 
1115                     
1116                    window.open(link, "_blank").focus(); 
1117
1118                 
1119                if(type == "whatsapp"){ 
1120                    var link = "https://wa.me?text=" + encodeURIComponent(title + ": " + window.location.href); 
1121                     
1122                    window.open(link, "_blank").focus(); 
1123
1124                 
1125                if(type == "telegram"){ 
1126                    var link = "https://t.me/share/url?url=" + window.location.href + "&text=" + encodeURIComponent(title); 
1127                     
1128                    window.open(link, "_blank").focus(); 
1129
1130                 
1131                if(type == "print"){ 
1132                    window.print(); 
1133
1134                 
1135                if(type == "link"){ 
1136                    this.legacyShare(); 
1137
1138
1139
1140
1141         
1142    document.addEventListener("DOMContentLoaded", function(){ 
1143    	var app = initVueApp( 
1144            "#${portletNamespace}", 
1145            "${portletNamespace}", 
1146            [d40_favorites, d40_share, ${portletNamespace}_custom_hook] 
1147        ); 
1148    }); 
1149     
1150    var groupedCategories = '${groupedCategories?js_string}'; 
1151    var contentCoords = [${lat}, ${lng}]; 
1152    console.log("espongo " + groupedCategories); 
1153</script> 

it_IT

Cosa

fare

Nessun risultato trovato

Nessun risultato trovato

it_IT

Esperienze

Nessun risultato trovato

Nessun risultato trovato

Nessun risultato trovato

it_IT

Dove

dormire

Nessun risultato trovato

Nessun risultato trovato

it_IT

Nessun risultato trovato

Nessun risultato trovato

it_IT

Nessun risultato trovato

Nessun risultato trovato