Home - ERICA 한대방송국 VOH
템플릿을 처리하는 동안 오류가 발생했습니다.
Can't convert boolean to string automatically, because the "boolean_format" setting was "true,false", which is the legacy deprecated default, and we treat it as if no format was set. This is the default configuration; you should provide the format explicitly for each place where you print a boolean.
----
Tip: Write something like myBool?string('yes', 'no') to specify boolean formatting in place.
----
Tip: If you want "true"/"false" result as you are generating computer-language output (not for direct human consumption), then use "?c", like ${myBool?c}. (If you always generate computer-language output, then it's might be reasonable to set the "boolean_format" setting to "c" instead.)
----
Tip: If you need the same two values on most places, the programmers can set the "boolean_format" setting to something like "yes,no". However, then it will be easy to unwillingly format booleans like that.
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: ${isEditMode} [in template "20098#20124#10930942" at line 13, column 18]
----
1<#assign
2 isEditMode = false
3/>
4
5<#if themeDisplay.isSignedIn()>
6 <#assign
7 curPLMode = getterUtil.getString(themeDisplay.getRequest().getParameter("p_l_mode"), "")
8 isEditMode = stringUtil.equalsIgnoreCase(curPLMode, "edit")
9 />
10</#if>
11
12<script>
13 console.log('${isEditMode}');
14</script>
15
16<style>
17 #banner {
18 border-bottom: none !important;
19 }
20
21 .hyu-template-visualSlider {
22 min-height: 505px;
23 background-color:var(--gray-200, #e7e7ed);
24 overflow: hidden;
25 }
26
27 .hyu-template-visualSlider:not(.vertical) {
28 max-height: 505px;
29 }
30
31 @media (min-width: 992px) {
32 .hyu-template-visualSlider:not(.vertical) {
33 max-height: 770px;
34 }
35 }
36
37 .hyu-template-visualSlider .hyu-visualSlider-item-container {
38 display: flex;
39 flex-direction: row;
40 position: relative;
41 left: 0;
42 }
43
44 .hyu-template-visualSlider .hyu-visualSlider-item-container.flip {
45 transition: left 1s;
46 }
47
48 .hyu-template-visualSlider .hyu-visualSlider-item {
49 overflow: hidden;
50 }
51
52 @media (max-width: 992px) {
53 .hyu-template-visualSlider .hyu-visualSlider-item .hyu-visualSlider-content {
54 display: grid;
55 justify-content: center;
56 width: 100vw;
57 }
58 }
59
60 .hyu-template-visualSlider video,
61 .hyu-template-visualSlider img {
62 min-height: 505px;
63 }
64
65 .hyu-template-visualSlider:not(.vertical) video,
66 .hyu-template-visualSlider:not(.vertical) img {
67 max-height: 505px;
68 }
69
70 .hyu-template-visualSlider .hyu-visualSlider-image img {
71 width: auto;
72 filter: brightness(80%);
73 }
74
75 @media (max-width: 992px) {
76 .hyu-template-visualSlider .hyu-visualSlider-image img {
77 max-width: unset !important;
78 }
79 }
80
81 .hyu-template-visualSlider .hyu-visualSlider-image.dim-removed img {
82 filter: brightness(100%);
83 }
84
85 @media (min-width: 992px) {
86 .hyu-template-visualSlider .hyu-visualSlider-image img {
87 width: 100%;
88 }
89
90 .hyu-template-visualSlider:not(.vertical) video,
91 .hyu-template-visualSlider:not(.vertical) img {
92 max-height: 770px;
93 }
94 }
95
96 .hyu-template-visualSlider .hyu-visualSlider-title {
97 color: var(--white, #ffffff);
98 text-shadow: 1px 0.5px 2px rgba(51, 63, 72, 0.7);
99 position: relative;
100 }
101
102 .hyu-template-visualSlider.vertical .hyu-visualSlider-title {
103 padding: 0 3em;
104 }
105
106 .hyu-template-visualSlider .hyu-visualSlider-title a {
107 color: inherit;
108 width: 100%;
109 display: inline-block;
110 z-index: 2;
111 position: relative;
112 }
113
114 .hyu-template-visualSlider .hyu-visualSlider-title h1 {
115 font-size: 2.5em;
116 }
117
118 .hyu-template-visualSlider .hyu-visualSlider-title h2 {
119 font-size: 1.25em;
120 font-weight: 500;
121 }
122
123 .hyu-template-visualSlider .hyu-visualSlider-title h3 {
124 font-size: 1.25em;
125 font-weight: 500;
126 }
127
128 @media (min-width: 992px) {
129 .hyu-template-visualSlider .hyu-visualSlider-title h1 {
130 font-size: 3.55em;
131 }
132 }
133
134 .hyu-template-visualSlider .hyu-visualSlider-control {
135 display: none;
136 }
137
138 @media (min-width: 992px) {
139 .hyu-template-visualSlider .hyu-visualSlider-control {
140 display: block;
141 position: relative;
142 z-index: 1;
143 margin-top: -1.5em;
144 padding: 0 0.5em;
145 font-size: 5em;
146 color: rgba(255, 255, 255, 0.2);
147 }
148
149 .hyu-template-visualSlider.vertical .hyu-visualSlider-control {
150 margin-top: -3em;
151 padding: 0 2em;
152 font-size: 2em;
153 color: var(--white, #ffffff);
154 }
155 }
156
157 @media (min-width: 1920px) {
158 .hyu-template-visualSlider .hyu-visualSlider-control {
159 padding: 0 2em;
160 }
161 }
162
163 .hyu-template-visualSlider .hyu-visualSlider-control a {
164 color: inherit;
165 }
166
167 .hyu-template-visualSlider.vertical .hyu-visualSlider-control a {
168 border-top: 1px solid var(--white, #ffffff);
169 border-bottom: 1px solid var(--white, #ffffff);
170 border-left: 1px solid var(--white, #ffffff);
171 height: 1.5em;
172 width: 1.5em;
173 text-align: center;
174 }
175
176 .hyu-template-visualSlider.vertical .hyu-visualSlider-control a:last-child {
177 border-right: 1px solid var(--white, #ffffff);
178 }
179
180 .hyu-template-visualSlider .hyu-visualSlider-control a.disabled {
181 pointer-events: none;
182 }
183
184 .hyu-template-visualSlider .hyu-visualSlider-control a:hover {
185 color: rgba(255, 255, 255, 0.5);
186 }
187
188 .hyu-template-visualSlider .hyu-visualSlider-control-inner {
189 display: flex;
190 justify-content: space-between;
191 }
192
193 .hyu-template-visualSlider.vertical .hyu-visualSlider-control-inner {
194 justify-content: flex-start;
195 }
196
197 .hyu-template-visualSlider .hyu-visualSlider-control a:hover {
198 color: rgba(255, 255, 255, 0.5);
199 }
200
201 .hyu-template-visualSlider .hyu-visualSlider-paging {
202 color: var(--white, #ffffff);
203 position: relative;
204 z-index: 1;
205 }
206
207 .hyu-template-visualSlider.vertical .hyu-visualSlider-paging {
208 padding-left: 3em;
209 }
210
211 .hyu-template-visualSlider .hyu-visualSlider-paging-inner {
212 display: flex;
213 align-items: center;
214 }
215
216 .hyu-template-visualSlider .hyu-visualSlider-paging a {
217 color: inherit;
218 font-size: 1.6em;
219 }
220
221 .hyu-template-visualSlider .hyu-visualSlider-paging span,
222 .hyu-template-visualSlider .hyu-visualSlider-paging a {
223 margin-left: 0.2em;
224 margin-right: 0.2em;
225 }
226
227 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) {
228 min-height: 240px;
229 }
230
231 body.old-theme .hyu-template-visualSlider:not(.vertical):not(.horizontal_small) {
232 max-height: 240px;
233 }
234
235 @media (min-width: 992px) {
236 body.old-theme .hyu-template-visualSlider:not(.vertical):not(.horizontal_small) {
237 max-height: 240px;
238 }
239 }
240
241 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) video,
242 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) img {
243 min-height: 240px;
244 }
245
246 body.old-theme .hyu-template-visualSlider:not(.vertical):not(.horizontal_small) video,
247 body.old-theme .hyu-template-visualSlider:not(.vertical):not(.horizontal_small) img {
248 max-height: 240px;
249 }
250
251 @media (min-width: 992px) {
252 body.old-theme.hyu-template-visualSlider:not(.vertical):not(.horizontal_small) video,
253 body.old-theme.hyu-template-visualSlider:not(.vertical):not(.horizontal_small) img {
254 max-height: 240px;
255 }
256 }
257
258 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) .hyu-visualSlider-title h1 {
259 font-size: 2em;
260 }
261
262 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) .hyu-visualSlider-title h2 {
263 font-size: 1.25em;
264 font-weight: 500;
265 }
266
267 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) .hyu-visualSlider-title h3 {
268 font-size: 1.25em;
269 font-weight: 500;
270 }
271
272 @media (min-width: 992px) {
273 body.old-theme .hyu-template-visualSlider:not(.horizontal_small) .hyu-visualSlider-title h1 {
274 font-size: 2.55em;
275 }
276 }
277</style>
278
279<script>
280 var ${randomNamespace}slideHeight = 0;
281
282 <#if ((vsLayout.getData())?? && getterUtil.getString(vsLayout.getData(), '') == 'horizontal_small')>
283 ${randomNamespace}slideHeight = 505;
284 </#if>
285
286 var ${randomNamespace}sliderNo = 0;
287 var ${randomNamespace}containerWidth = 0;
288 var ${randomNamespace}flipIntervalId = null;
289 var ${randomNamespace}flipInterval = 10000;
290 var ${randomNamespace}startFlipOnInit = true;
291
292 var ${randomNamespace}resizeObserver = new ResizeObserver(function(entries) {
293 ${randomNamespace}initVisualSlider();
294 });
295
296 var ${randomNamespace}initVisualSlider = function() {
297 AUI().use(
298 'aui-node',
299 function(A) {
300 <#if ((vsLayout.getData())?? && getterUtil.getString(vsLayout.getData(), '') != 'horizontal_small')>
301 if (A.one('body').hasClass('old-theme')) ${randomNamespace}slideHeight = 240;
302 </#if>
303
304 ${randomNamespace}containerWidth = A.one('#${randomNamespace}visualSlider').getDOMNode().clientWidth;
305
306 if (A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item').size() > 0) {
307 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('width', ${randomNamespace}containerWidth * A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item').size() + 'px');
308 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item').each(function(node) {
309 node.setStyle('width', ${randomNamespace}containerWidth + 'px');
310 });
311 }
312
313 var intervalId = null;
314 var isVideoReady = false;
315 var isImageReady = false;
316
317 intervalId = setInterval(function () {
318 if (A.all('#${randomNamespace}visualSlider video').size() > 0) {
319 isVideoReady = true;
320
321 A.all('#${randomNamespace}visualSlider video').each(function(video) {
322 if (video.getDOMNode().readyState >= 3) {
323 // loaded
324 } else {
325 isVideoReady = false;
326 }
327 });
328 } else {
329 isVideoReady = true;
330 }
331
332 if (A.all('#${randomNamespace}visualSlider img').size() > 0) {
333 isImageReady = true;
334
335 A.all('#${randomNamespace}visualSlider img').each(function(img) {
336 if (img.getDOMNode().complete && img.getDOMNode().naturalWidth > 0) {
337 // loaded
338 } else {
339 isImageReady = false;
340 }
341 });
342 } else {
343 isImageReady = true;
344 }
345
346 if (isVideoReady && isImageReady) {
347 clearInterval(intervalId);
348 ${randomNamespace}renderVisualSlider();
349 }
350 }, 100);
351 }
352 );
353 };
354
355 var ${randomNamespace}renderVisualSlider = function() {
356 AUI().use(
357 'aui-node',
358 function(A) {
359
360 var height = 0;
361 var minHeight = 0;
362
363 A.all('#${randomNamespace}visualSlider video').each(function(video) {
364 if (height < video.getDOMNode().clientHeight) height = video.getDOMNode().clientHeight;
365 });
366
367 A.all('#${randomNamespace}visualSlider img').each(function(img) {
368 if (height < img.getDOMNode().clientHeight) height = img.getDOMNode().clientHeight;
369 });
370
371 if (${randomNamespace}slideHeight > 0) {
372 minHeight = ${randomNamespace}slideHeight;
373 } else {
374 minHeight = height;
375 }
376
377 if (minHeight > 0) {
378 A.one('#${randomNamespace}visualSlider').setStyle('height', minHeight + 'px');
379 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('height', minHeight + 'px');
380 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item-container img').setStyle('height', minHeight + 'px');
381
382 if (A.one('#${randomNamespace}visualSlider').hasClass('vertical')) {
383 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-title').setStyle('margin-top', (minHeight*-1+150) + 'px');
384 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging').setStyle('margin-top', (minHeight*-1+350) + 'px');
385 } else {
386 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-title').each(function(node){
387 var titleHeight = node.getDOMNode().clientHeight;
388 if (titleHeight > minHeight) {
389 node.setStyle('margin-top', (minHeight * -1) + 'px');
390 } else {
391 titleHeight = (titleHeight / 2 + minHeight / 2) * -1;
392 node.setStyle('margin-top', titleHeight + 'px');
393 }
394 });
395
396 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-control').setStyle('margin-top', (minHeight / -2 - 35) + 'px');
397 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging').setStyle('margin-top', (minHeight / 4 - 30) + 'px');
398 }
399 }
400
401 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-inner').removeClass('hide');
402 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-title').removeClass('hide');
403 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-control').removeClass('hide');
404 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging').removeClass('hide');
405
406 ${randomNamespace}resizeObserver.observe(A.one('#${randomNamespace}visualSlider').getDOMNode());
407
408 if (A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').hasClass('no-flip')) {
409 // no flip
410 } else if (${randomNamespace}startFlipOnInit) {
411 ${randomNamespace}playVisualSlider(true);
412 ${randomNamespace}startFlipOnInit = false;
413 }
414 }
415 );
416 };
417
418 var ${randomNamespace}flipVisualSlider = function(direction) {
419 AUI().use(
420 'aui-node',
421 function(A) {
422 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').removeClass('flip');
423 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').removeClass('flip-backward');
424 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-control-item').addClass('disabled');
425
426 if (direction && direction == 'backward') {
427 setTimeout(function() {
428 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').prepend(
429 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container .hyu-visualSlider-item:last-child')
430 );
431 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('left', ${randomNamespace}containerWidth * -1 + 'px');
432
433 setTimeout(function() {
434 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').addClass('flip');
435 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').addClass('flip-backward');
436 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('left', 0);
437 }, 100);
438 }, 100);
439 } else {
440 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').addClass('flip');
441 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('left', ${randomNamespace}containerWidth * -1 + 'px');
442 }
443 }
444 );
445 };
446
447 var ${randomNamespace}playVisualSlider = function(play) {
448 AUI().use(
449 'aui-node',
450 function(A) {
451 if (play) {
452 ${randomNamespace}flipIntervalId = setInterval(function () {
453 ${randomNamespace}flipVisualSlider('forward');
454 }, ${randomNamespace}flipInterval);
455
456 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging-item').addClass('hide');
457 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging-pause').removeClass('hide');
458 } else {
459 clearInterval(${randomNamespace}flipIntervalId);
460
461 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging-item').addClass('hide');
462 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging-play').removeClass('hide');
463 }
464 }
465 );
466 };
467
468 AUI().ready(
469 function(A) {
470 <#if isEditMode>
471 console.log('edit mode');
472 <#else>
473 if (A.all('#${randomNamespace}visualSlider .hyu-visualSlider-item').size() > 0) {
474
475 ${randomNamespace}resizeObserver.unobserve(A.one('#${randomNamespace}visualSlider').getDOMNode());
476 ${randomNamespace}initVisualSlider();
477
478 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').getDOMNode().addEventListener('transitionend', function(e) {
479 if (A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').hasClass('flip')) {
480 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').removeClass('flip');
481
482 setTimeout(function() {
483 if (A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').hasClass('flip-backward')) {
484 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').removeClass('flip-backward');
485 } else {
486 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').append(
487 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container .hyu-visualSlider-item:first-child')
488 );
489
490 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container').setStyle('left', 0);
491 }
492
493 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-control-item').removeClass('disabled');
494 A.all('#${randomNamespace}visualSlider .hyu-visualSlider-paging-cur').setContent(
495 A.one('#${randomNamespace}visualSlider .hyu-visualSlider-item-container .hyu-visualSlider-item:first-child').attr('data-sliderNo')
496 );
497 }, 100);
498 }
499 });
500 }
501 </#if>
502 }
503 );
504</script>
505
506<div class="hyu-template-visualSlider <#if (vsLayout.getData())??>${getterUtil.getString(vsLayout.getData(), '')}</#if>" id="${randomNamespace}visualSlider">
507 <div class="hyu-visualSlider-container">
508 <div class="hyu-visualSlider-inner hide">
509 <#if vsTitle.getSiblings()?has_content>
510 <div class="hyu-visualSlider-item-container <#if vsTitle.getSiblings()?size == 1>no-flip</#if>">
511
512 <#assign sliderNo = 1 />
513
514 <#list vsTitle.getSiblings() as cur_vsTitle>
515 <div class="hyu-visualSlider-item" data-sliderNo="${sliderNo}">
516 <div class="hyu-visualSlider-content <#if cur_vsTitle.vsType.getData() == 'video'>video</#if>">
517 <#if cur_vsTitle.vsType.getData() == 'video'>
518
519 <video name="video" autoplay="" playsinline="" muted="" loop="">
520 <source src="${cur_vsTitle.vsVideoURL.getData()}" type="video/mp4">
521 </video>
522
523 <#else>
524
525 <#if (cur_vsTitle.vsImage.getData())?? && cur_vsTitle.vsImage.getData() != "">
526 <#if ((cur_vsTitle.vsDimRemoved.getData())?? && getterUtil.getBoolean(cur_vsTitle.vsDimRemoved.getData(), false))>
527 <div class="hyu-visualSlider-image dim-removed">
528 <#else>
529 <div class="hyu-visualSlider-image">
530 </#if>
531
532 <img alt="${cur_vsTitle.vsImage.getAttribute("alt")}" src="${cur_vsTitle.vsImage.getData()}" />
533 </div>
534 </#if>
535
536 </#if>
537 </div>
538
539 <div class="hyu-visualSlider-title container hide">
540 <#if ((cur_vsTitle.vsHeading.getData())?? && getterUtil.getString(cur_vsTitle.vsHeading.getData(), '') != '')>
541 <h2>
542 <a href="${cur_vsTitle.vsURL.getData()}" target="_blank">${cur_vsTitle.vsHeading.getData()}</a>
543 </h2>
544 </#if>
545 <h1>
546 <a href="${cur_vsTitle.vsURL.getData()}" target="_blank">${cur_vsTitle.getData()}</a>
547 </h1>
548 <h3>
549 <a href="${cur_vsTitle.vsURL.getData()}" target="_blank">${cur_vsTitle.vsSubtitle.getData()}</a>
550 </h3>
551 </div>
552 </div>
553
554 <#assign sliderNo = sliderNo + 1 />
555 </#list>
556
557 </div>
558
559 <#if (vsTitle.getSiblings()?size > 1)>
560 <div class="hyu-visualSlider-control hide">
561 <div class="hyu-visualSlider-control-inner">
562 <#if ((vsLayout.getData())?? && getterUtil.getString(vsLayout.getData(), '') == 'vertical')>
563 <a href="#none" class="hyu-visualSlider-control-item hyu-visualSlider-control-prev" title="${languageUtil.get(locale, "previous")}" onclick="${randomNamespace}flipVisualSlider('backward')"><i class="bi bi-chevron-left"></i></a>
564 <a href="#none" class="hyu-visualSlider-control-item hyu-visualSlider-control-next" title="${languageUtil.get(locale, "next")}" onclick="${randomNamespace}flipVisualSlider('forward')"><i class="bi bi-chevron-right"></i></a>
565 <#else>
566 <a href="#none" class="hyu-visualSlider-control-item hyu-visualSlider-control-prev" title="${languageUtil.get(locale, "previous")}" onclick="${randomNamespace}flipVisualSlider('backward')"><i class="bi bi-chevron-compact-left"></i></a>
567 <a href="#none" class="hyu-visualSlider-control-item hyu-visualSlider-control-next" title="${languageUtil.get(locale, "next")}" onclick="${randomNamespace}flipVisualSlider('forward')"><i class="bi bi-chevron-compact-right"></i></a>
568 </#if>
569 </div>
570 </div>
571 <div class="hyu-visualSlider-paging container -hide">
572 <div class="hyu-visualSlider-paging-inner">
573 <span class="hyu-visualSlider-paging-cur">1</span>/<span class="hyu-visualSlider-paging-total">${vsTitle.getSiblings()?size}</span>
574 <a href="#none" class="hyu-visualSlider-paging-item hyu-visualSlider-paging-pause" title="${languageUtil.get(locale, "pause")}" onclick="${randomNamespace}playVisualSlider(false)"><i class="bi bi-pause-fill"></i></a>
575 <a href="#none" class="hyu-visualSlider-paging-item hyu-visualSlider-paging-play hide" title="${languageUtil.get(locale, "play")}" onclick="${randomNamespace}playVisualSlider(true)"><i class="bi bi-play-fill"></i></a>
576 </div>
577 </div>
578 </#if>
579 </#if>
580 </div>
581 </div>
582</div>