Welcome, .
dwtc.greeting.message
The string doesn't match the expected date/time/date-time format. The string to parse was: "09.06.25 11:34". The expected format was: "M/d/yy h:mm a". The nested reason given follows: Unparseable date: "09.06.25 11:34" ---- FTL stack trace ("~" means nesting-related): - Failed at: ${ObjectEntry_createDate.getData()?da... [in template "68068712855087#53307#null" at line 711, column 169] ----
1<style>
2
3
4
5 .dwtc-way-ihero .header-content .content-container .article-header .heading-container .heading-wrapper .provider-container:hover .provider-name{
6 text-decoration: underline;
7 }
8
9 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration {
10 align-items: center;
11 display: flex;
12 gap: 6px;
13 }
14
15 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration i {
16 color: #D7CCFF;
17 font-size: 18px;
18 }
19
20 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration .text {
21 color: #D7CCFF;
22 font-family: "URW DIN-Regular", Helvetica;
23 font-weight: 400;
24 font-size: 14px;
25 letter-spacing: 0.56px;
26 line-height: 100%;
27 text-box-cap: cap alphabetic;
28 text-box-trim: trim-both;
29 text-transform: uppercase;
30 }
31
32 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .date .text {
33 color: #D7CCFF;
34 font-family: "URW DIN-Regular", Helvetica;
35 font-weight: 400;
36 font-size: 14px;
37 letter-spacing: 0.56px;
38 line-height: 100%;
39 text-box-cap: cap alphabetic;
40 text-box-trim: trim-both;
41 text-transform: uppercase;
42 }
43
44 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity {
45 align-items: center;
46 display: flex;
47 flex-direction: row;
48 gap: 16px;
49 }
50
51 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments,
52 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes {
53 align-items: center;
54 display: flex;
55 gap: 8px;
56 }
57
58 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments i,
59 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes i {
60 color: #D7CCFF;
61 cursor: pointer;
62 font-size: 18px;
63 }
64
65
66 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration {
67 align-items: center;
68 display: flex;
69 gap: 6px;
70 }
71
72 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration i {
73 color: #D7CCFF;
74 font-size: 18px;
75 }
76
77 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .duration .text {
78 color: #D7CCFF;
79 font-family: "URW DIN-Regular", Helvetica;
80 font-weight: 400;
81 font-size: 14px;
82 letter-spacing: 0.56px;
83 line-height: 100%;
84 text-box-cap: cap alphabetic;
85 text-box-trim: trim-both;
86 text-transform: uppercase;
87 }
88
89 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .date .text {
90 color: #D7CCFF;
91 font-family: "URW DIN-Regular", Helvetica;
92 font-weight: 400;
93 font-size: 14px;
94 letter-spacing: 0.56px;
95 line-height: 100%;
96 text-box-cap: cap alphabetic;
97 text-box-trim: trim-both;
98 text-transform: uppercase;
99 }
100
101 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity {
102 align-items: center;
103 display: flex;
104 flex-direction: row;
105 gap: 16px;
106 }
107
108 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments,
109 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes {
110 align-items: center;
111 display: flex;
112 gap: 8px;
113 }
114
115 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments i,
116 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes i {
117 color: #D7CCFF;
118 cursor: pointer;
119 font-size: 18px;
120 }
121
122 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments i:hover::before {
123 content: "\e91c";
124 }
125
126 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes i:hover::before {
127 content: "\e91d";
128 }
129
130 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .comments .text,
131 .header-content .content-container .article-header .heading-container .heading-wrapper .content-details .activity .likes .text {
132 color: #D7CCFF;
133 font-family: "URW DIN-Regular", Helvetica;
134 font-weight: 400;
135 font-size: 14px;
136 letter-spacing: 0.56px;
137 line-height: 100%;
138 text-box-cap: cap alphabetic;
139 text-box-trim: trim-both;
140 text-transform: uppercase;
141 }
142
143 /* Featured */
144 .header-content .featured {
145 display: flex;
146 width: 100%;
147 }
148
149 .header-content .featured .mobile-episode-description {
150 display: none;
151 }
152
153 .header-content .featured .episode-description {
154 align-items: flex-start;
155 display: flex;
156 flex-direction: column;
157 gap: 24px;
158 justify-content: flex-end;
159 max-width: 597px;
160 padding-left: 24px;
161 padding-bottom: 83px;
162 width: 100%;
163 }
164
165 .header-content .featured .episode-description .episode-intro {
166 color: #ffffff;
167 font-family: "DIN Pro-Medium", Helvetica;
168 font-size: 24px;
169 font-weight: 500;
170 letter-spacing: -0.96px;
171 line-height: 100%;
172 }
173
174 .header-content .featured .episode-description .description {
175 color: #D7CCFF;
176 font-family: "DIN Pro-Regular", Helvetica;
177 font-size: 16px;
178 font-weight: 400;
179 letter-spacing: -0.32px;
180 line-height: 120%;
181 }
182
183 .header-content .featured .episode-description .content-details {
184 align-items: center;
185 display: flex;
186 flex-direction: row;
187 gap: 20px;
188 }
189
190 .header-content .featured .episode-description .content-details .duration {
191 align-items: center;
192 display: flex;
193 gap: 6px;
194 }
195
196 .header-content .featured .episode-description .content-details .duration i {
197 color: #D7CCFF;
198 font-size: 18px;
199 }
200
201 .header-content .featured .episode-description .content-details .duration .text {
202 color: #D7CCFF;
203 font-family: "URW DIN-Regular", Helvetica;
204 font-weight: 400;
205 font-size: 14px;
206 letter-spacing: 0.56px;
207 line-height: 100%;
208 text-box-cap: cap alphabetic;
209 text-box-trim: trim-both;
210 text-transform: uppercase;
211 }
212
213 .header-content .featured .episode-description .content-details .date .text {
214 color: #D7CCFF;
215 font-family: "URW DIN-Regular", Helvetica;
216 font-weight: 400;
217 font-size: 14px;
218 letter-spacing: 0.56px;
219 line-height: 100%;
220 text-box-cap: cap alphabetic;
221 text-box-trim: trim-both;
222 text-transform: uppercase;
223 }
224
225
226 .header-content .featured .episode-description .content-details .activity {
227 align-items: center;
228 display: flex;
229 flex-direction: row;
230 gap: 16px;
231 }
232
233 .header-content .featured .episode-description .content-details .activity .comments,
234 .header-content .featured .episode-description .content-details .activity .likes {
235 align-items: center;
236 display: flex;
237 gap: 8px;
238 }
239
240 .header-content .featured .episode-description .content-details .activity .comments i,
241 .header-content .featured .episode-description .content-details .activity .likes i {
242 color: #D7CCFF;
243 cursor: pointer;
244 font-size: 18px;
245 }
246
247 .header-content .featured .episode-description .content-details .activity .comments i:hover::before {
248 content: "\e91c";
249 }
250
251 .header-content .featured .episode-description .content-details .activity .likes i:hover::before {
252 content: "\e91d";
253 }
254
255 .DWTC-hub-d {
256 display: flex;
257 flex-direction: column;
258 align-items: flex-start;
259 position: relative;
260 }
261
262 .DWTC-hub-d .hero-top {
263 display: flex;
264 flex-direction: column;
265 height: 100%;
266 align-items: flex-start;
267 gap: 132px;
268 padding: 42px 32px;
269 position: relative;
270 align-self: stretch;
271 width: 100%;
272 overflow: hidden;
273 }
274
275 .DWTC-hub-d .hero-top .hero-image {
276 position: absolute;
277 top: 0;
278 left: 0;
279 right: 0;
280 bottom: 0;
281 object-fit: cover;
282 width: 100%;
283 height: 100%;
284 }
285
286
287
288
289 .hero-top .cta-container {
290 align-items: flex-end;
291 display: flex;
292 flex-grow: 1;
293 justify-content: flex-end;
294 width: fit-content;
295 z-index: 1;
296 position: absolute;
297 left: 50%;
298 top: 50%;
299 transform: translate(-50%, -50%);
300 }
301
302 .hero-top .cta-container .view-button {
303 align-items: center;
304 background: radial-gradient(107.32% 141.42% at 0% 0%, rgba(244, 244, 244, 0.28) 0%, rgba(233, 233, 233, 0.34) 100%);
305 border: 1px solid rgba(244, 244, 244, 0.56);
306 border-radius: 40px;
307 display: flex;
308 gap: 16px;
309 height: 54px;
310 padding: 20px 0px;
311 transition: background-color 0.3s ease;
312 width: 186px;
313 }
314
315 .hero-top .cta-container .view-button .arrow-wrapper {
316 align-items: center;
317 background-color: #000;
318 border-radius: 50%;
319 display: flex;
320 height: 46px;
321 justify-content: center;
322 margin-left: 4px;
323 width: 46px;
324 }
325
326 .hero-top .cta-container .view-button .arrow-wrapper i{ color: #ffffff; font-size: 16px;}
327
328 .hero-top .cta-container .view-button:hover {
329 background: none;
330 background-color: #000;
331 border-color: #000;
332 }
333
334 .hero-top .cta-container .view-button .label {
335 color: #fff;
336 font-family: "DIN Pro-Medium", Helvetica;
337 font-weight: 500;
338 font-size: 18px;
339 letter-spacing: -0.72px;
340 line-height: 100%;
341 text-box-cap: both alphabetic;
342 text-box-trim: trim-both;
343 transition: color 0.3s ease;
344 }
345
346 .hero-top .cta-container .view-button:hover .label {
347 color: #ffffff;
348 }
349
350 .hero-top .cta-container .view-button .arrow-wrapper .arrow-right {
351 background-color: #fff;
352 -webkit-mask-image: url("assets/images/svg/btn-arrow-right.svg");
353 mask-image: url("assets/images/svg/btn-arrow-right.svg");
354 -webkit-mask-repeat: no-repeat;
355 mask-repeat: no-repeat;
356 background-position: 50% 50%;
357 width: 14px;
358 height: 10px;
359 transition: background-color 0.3s ease;
360 }
361
362 .hero-top .cta-container .view-button:hover .arrow-wrapper .arrow-right {
363 background-color: #fff;
364 }
365
366
367
368 @media (max-width: 1750px) {
369
370 .header-content .content-container .featured .mobile-episode-description .content-details .duration i {
371 color: #D7CCFF;
372 font-size: 18px;
373 }
374
375 .header-content .content-container .featured .mobile-episode-description .content-details .activity .comments,
376 .header-content .content-container .featured .mobile-episode-description .content-details .activity .likes i {
377 color: #D7CCFF;
378 font-size: 18px;
379 cursor: pointer;
380 }
381
382 }
383
384
385
386 @media (max-width: 991.98px) {
387 .DWTC-hub-d .hero-top {
388 padding: 32px 28px;
389 }
390 }
391
392
393 @media (max-width: 768px) {
394
395 .dwtc-hub-play-button {
396 font-size: 10px;
397 }
398 }
399
400 @media (max-width: 575px) {
401
402 .dwtc-hub-play-button {
403 font-size: 10px;
404 }
405 }
406
407
408
409 .dwtc-way-ihero .header-content .title-wrapper h1.detail-title {
410 display: none;
411 }
412
413 .dwtc-way-ihero .header-content .title-wrapper h1.dwtc-way-title {
414 display: block !important;
415 }
416
417 .dwtc-way-ihero .header-content .heading-container {
418 border: none;
419 }
420
421 .dwtc-way-ihero .header-content .content-date {
422 display: none;
423 }
424
425 .dwtc-way-ihero .header-content .content-details {
426 display: none !important;
427 }
428
429 .dwtc-way-ihero .header-content .content-container .article-header .heading-container .heading-wrapper .short-description {
430 display: block !important;
431 color: #ffffff;
432 font-family: "DIN Pro-Light", Helvetica;
433 font-size: 24px;
434 font-weight: 300;
435 letter-spacing: -0.96px;
436 line-height: 120%;
437 }
438
439 @media (max-width: 1160px) {
440 .dwtc-way-ihero .header-content .content-container .article-header .heading-container .heading-wrapper .short-description {
441 font-size: 16px;
442 letter-spacing: -0.64px;
443 line-height: 100%;
444 }
445 }
446</style>
447
448<#macro formatTimeAgo inputDate>
449 <#assign cleanedDate=inputDate?replace("[ ,]", " " , "r" )?trim>
450 <#attempt>
451 <#assign parsedDate=cleanedDate?datetime("M/dd/yy hh:mm a")>
452 <#recover>
453 <#assign parsedDate=cleanedDate?datetime("M/dd/yyyy hh:mm a")>
454 </#attempt>
455
456 <#assign now=.now>
457 <#assign diffInMillis=now?long - parsedDate?long>
458 <#assign diffInSeconds=diffInMillis / 1000>
459 <#assign diffInMinutes=diffInSeconds / 60>
460 <#assign diffInHours=diffInMinutes / 60>
461 <#assign diffInDays=diffInHours / 24>
462
463 <#if diffInSeconds < 60>
464 ${diffInSeconds?int} seconds
465 <#elseif diffInMinutes < 60>
466 ${diffInMinutes?int} minutes
467 <#elseif diffInHours < 24>
468 ${diffInHours?int} hours
469 <#else>
470 ${diffInDays?int} days
471 </#if>
472</#macro>
473
474<#assign hubContentDataResponse=restClient.get("/c/dwtchubcontents/${ObjectEntry_objectEntryId.getData()}?fields=taxonomyCategoryBriefs") />
475<#if hubContentDataResponse?has_content && hubContentDataResponse.taxonomyCategoryBriefs??>
476
477<#assign categories=hubContentDataResponse.taxonomyCategoryBriefs />
478 <#if categories?has_content && categories??>
479<div class="d-none" id="object-selected-categories">
480 <#list categories as category>
481 <div class="taxonomy-category">
482 <div class="id">
483 ${category.taxonomyCategoryId}
484 </div>
485 <div class="name">
486 ${category.taxonomyCategoryName}
487 </div>
488 </div>
489 </#list>
490</div>
491 </#if>
492</#if>
493
494<#assign scopeGroupId=themeDisplay.getScopeGroupId()>
495<#assign contentCommentData = restClient.get("/c/usercomments/scopes/${scopeGroupId}?filter=r_hubContentUserComments_c_dwtcHubContentId eq '${ObjectEntry_objectEntryId.getData()}'")>
496
497 <#assign previewURL="" />
498 <#assign mimeType="" />
499
500<#if (.data_model["ObjectField_65537#previewURL"].getData())?? && .data_model["ObjectField_65537#previewURL"].getData() != "">
501 <#assign previewURL=.data_model["ObjectField_65537#previewURL"].getData()!"" />
502 <#assign mimeType=.data_model["ObjectField_65537#mimeType"].getData()!"" />
503</#if>
504
505
506
507<div class="d-none" id="hub-content-id">
508 ${ObjectEntry_objectEntryId.getData()}
509 </div>
510<#if categories?has_content && categories??>
511 <#list categories as category>
512 <#switch category.taxonomyCategoryName?lower_case>
513 <#case "spotify">
514 <#-- Code for Podcast Section --></#-->
515 <div class="hero-top">
516 <#if previewURL?has_content && mimeType?has_content>
517 <#if mimeType?starts_with("image/")>
518 <div>
519 <img class="hero-image" src="${previewURL}" alt="Media Image" />
520 </div>
521 <#elseif mimeType?starts_with("video/")>
522 <div>
523 <video class="hero-image" src="${previewURL}" muted loop playsinline preload="auto" id="hero-video"></video>
524 </div>
525 <div class="cta-container">
526 <button class="view-button">
527 <div class="arrow-wrapper">
528 <i class="dwtc-hub-arrow-small"></i>
529 </div>
530
531 <div class="label" data-lfr-editable-id="play-button-text" data-lfr-editable-type="text">
532 ${languageUtil.get(locale, "see-video")}
533 </div>
534 </button>
535 </div>
536 </#if>
537 </#if>
538 <div class="container-fluid">
539 <div class="header-content">
540 <div class="title-wrapper ">
541 <h1 class="detail-title mb-3"><span class='strong'>DWTC</span> Hub ${category.taxonomyCategoryName}</h1>
542 <h1 class="dwtc-way-title d-none"><span class='strong'>DWTC</span> Way</h1>
543 </div>
544 <div class="content-container">
545 <div class="featured">
546 <div class="heading-container">
547 <div class="heading-wrapper" id="player-wrapper">
548 <div class="spotify-player-wrapper">
549 <div class="player">
550 <div class="spotify-icon dwtc-hub-spotify"></div>
551
552 <#if (.data_model["ObjectField_65533#previewURL"].getData())?? &&
553 .data_model["ObjectField_65533#previewURL"].getData() !="">
554 <audio id="audio" src="${.data_model["ObjectField_65533#previewURL"].getData()}"></audio>
555 </#if>
556 <div class="player-content">
557 <div class="cover-art d-flex align-items-center justify-content-center" >
558 <img src="/documents/d/guest/dwtc-logo-blue-outline" alt="Logo" />
559 </div>
560 <div class="control-section">
561
562 <div class="video-heading">
563 <div id="mediaTitle">${ObjectField_title.getData()}</div>
564
565 </div>
566 <div class="bottom-section">
567 <div class="seek-controls">
568 <button id="backward" class="player-rewind-backward"></button>
569 <input type="range" id="seekBar" class="seek-bar" min="0" value="0"
570 max="372.715083">
571 <button id="forward" class="player-rewind-forward"></button>
572 <div class="player-time">
573 <span id="duration">0:00</span>
574
575 </div>
576 <div class="player-dots">...</div>
577 <button id="playPause">
578 <i class="dwtc-hub-play-button"></i>
579 <svg class="lexicon-icon lexicon-icon-pause d-none" role="presentation">
580 <use href="/o/classic-theme/images/clay/icons.svg#pause"></use>
581 </svg>
582 </button>
583 </div>
584 </div>
585 </div>
586 </div>
587 </div>
588 </div>
589
590 <div class="mobile-episode-description">
591 <div class="episode-intro">${languageUtil.get(locale, "about-the-episode")}</div>
592
593 <p class="description">
594 ${ObjectField_shortDescription.getData()}
595 </p>
596
597 <div class="content-details">
598 <div class="duration">
599 <i class="dwtc-hub-clock"></i>
600 <div class="text">
601 0 Sec
602 </div>
603 </div>
604
605 <div class="date">
606 <div class="text">
607 <#if (ObjectEntry_modifiedDate.getData())??>
608 ${ObjectEntry_modifiedDate.getData()?date("M/d/yy h:mm a")?string("MMM d, yyyy")}
609 </#if>
610 </div>
611 </div>
612
613 <div class="activity">
614 <div class="comments">
615 <i class="dwtc-hub-chat-bubble"></i>
616 <div class="text">${contentCommentData.totalCount}</div>
617 </div>
618
619 <div class="likes">
620 <i class="dwtc-hub-like like-btn" id="dwtc-hub-like-mobile-btn"></i>
621 <div class="text like-count" id="dwtc-hub-like--mobile-count">0</div>
622 </div>
623 </div>
624 </div>
625 </div>
626 </div>
627 </div>
628 <div class="episode-description">
629 <div class="episode-intro">${languageUtil.get(locale, "about-the-episode")}</div>
630 <p class="description">
631 ${ObjectField_shortDescription.getData()}
632 </p>
633 <div class="content-details">
634 <div class="duration">
635 <i class="dwtc-hub-clock"></i>
636 <div class="text">
637 0 Sec
638 </div>
639 </div>
640 <div class="date">
641 <div class="text">
642 <#if (ObjectEntry_modifiedDate.getData())??>
643 ${ObjectEntry_modifiedDate.getData()?date("M/d/yy h:mm a")?string("MMM d, yyyy")}
644 </#if>
645 </div>
646 </div>
647 <div class="activity">
648 <div class="comments">
649 <i class="dwtc-hub-chat-bubble"></i>
650 <div class="text">${contentCommentData.totalCount}</div>
651 </div>
652 <div class="likes">
653 <i class="dwtc-hub-like like-btn" id="dwtc-hub-like-btn"></i>
654 <div class="text like-count" id="dwtc-hub-like-count">0</div>
655 </div>
656 </div>
657 </div>
658 </div>
659 </div>
660 </div>
661
662 </div>
663 </div>
664
665 <#break>
666 <#case "article">
667 <#case "youtube">
668 <#case "instagram">
669 <#case "linkedin">
670 <#case "announcements">
671 <#case "news">
672 <#-- Code for Events Section --></#-->
673 <div class="hero-top">
674 <#if previewURL?has_content && mimeType?has_content>
675 <#if mimeType?starts_with("image/")>
676 <div>
677 <img class="hero-image" src="${previewURL}" alt="Media Image" />
678 </div>
679 <#elseif mimeType?starts_with("video/")>
680 <div>
681 <video class="hero-image" src="${previewURL}" muted loop playsinline
682 preload="auto" id="hero-video"></video>
683 </div>
684 <div class="cta-container">
685 <button class="view-button">
686 <div class="arrow-wrapper">
687 <i class="dwtc-hub-arrow-small"></i>
688 </div>
689
690 <div class="label" data-lfr-editable-id="play-button-text"
691 data-lfr-editable-type="text">${languageUtil.get(locale, "see-video")}</div>
692 </button>
693 </div>
694 </#if>
695 </#if>
696 <div class="container-fluid">
697 <div class="header-content">
698 <div class="title-wrapper ">
699 <h1 class="detail-title"><span class='strong'>DWTC</span> Hub
700 ${category.taxonomyCategoryName}</h1>
701 <h1 class="dwtc-way-title d-none"><span class='strong'>DWTC</span> Way</h1>
702 </div>
703
704 <div class="content-container">
705 <div class="article-header">
706 <div class="heading-container">
707 <div class="heading-wrapper">
708 <!-- <div class="content-date">
709
710 <#if ObjectEntry_createDate.getData()??>
711 ${ObjectEntry_createDate.getData()?date("M/d/yy h:mm a")?string("dd MMM yyyy")}
712
713 </#if>
714
715 </div> -->
716 <h2 class="content-title">
717 ${ObjectField_title.getData()}</h2>
718 <p class="short-description d-none">
719 ${ObjectField_shortDescription.getData()}
720 </p>
721 <#if category.taxonomyCategoryName?lower_case == "youtube" || category.taxonomyCategoryName?lower_case == "instagram" || category.taxonomyCategoryName?lower_case == "linkedin">
722 <a class="provider-container d-none" href="${ObjectField_postUrl.getData()}" target="_blank">
723 <i class="dwtc-hub-${category.taxonomyCategoryName?lower_case}"></i>
724 <div class="provider-name">VIA ${category.taxonomyCategoryName?upper_case}</div>
725 </a>
726 </#if>
727 <div class="content-details">
728 <div class="duration">
729 <i class="dwtc-hub-clock"></i>
730 <div class="text">
731 0 Sec
732 </div>
733 </div>
734
735 <div class="date">
736 <div class="text">
737 <#if (ObjectEntry_modifiedDate.getData())??>
738
739 ${ObjectEntry_modifiedDate.getData()?date("M/d/yy h:mm a")?string("MMM d, yyyy")}
740 </#if>
741 </div>
742 </div>
743
744 <div class="activity">
745 <div class="comments">
746 <i class="dwtc-hub-chat-bubble"></i>
747 <div class="text">${contentCommentData.totalCount}</div>
748 </div>
749
750 <div class="likes">
751 <i class="dwtc-hub-like" id="dwtc-hub-like-btn"></i>
752 <div class="text" id="dwtc-hub-like-count">0</div>
753 </div>
754 </div>
755 </div>
756 </div>
757 </div>
758 </div>
759 </div>
760 </div>
761 </div>
762 <#break>
763 </#switch>
764 </#list>
765</#if>
766 <script>
767 $(document).ready(function () {
768 const $button = $(".view-button");
769 const $video = $(".hero-image");
770
771
772 if ($video.length && $video.prop("tagName").toLowerCase() === "video") {
773 $button.on("click", function () {
774 const videoEl = $video.get(0);
775 if (videoEl.paused) {
776 videoEl.play();
777 } else {
778 videoEl.pause();
779 }
780 });
781 };
782
783 });
784 </script>