first commit 2

2026-06-11 18:47:38 +09:00
parent c768729ce6
commit 6f534e33a6
11095 changed files with 1595758 additions and 0 deletions
@@ -0,0 +1,153 @@
+// main_visual_section 모듈을 위한 JavaScript (ES6+ 버전)
+window.initMainVisualModule = function(moduleId) {
+    const mainVisualModule = document.getElementById(moduleId);
+    if (!mainVisualModule) {
+        console.warn(`Main Visual Module (ID: ${moduleId}) 요소를 찾을 수 없습니다.`);
+        return;
+    }
+
+    const menuItems = mainVisualModule.querySelectorAll('.main-visual-right .menu-item');
+    const rightMenuRollingEnabled = mainVisualModule.dataset.rightMenuRolling === 'true';
+    const rightMenuRollingTime = parseInt(mainVisualModule.dataset.rightMenuRollingTime, 10) || 0;
+    const rightMenuVisibleItems = parseInt(mainVisualModule.dataset.rightMenuVisibleItems, 10) || 5;
+    const rightMenuItemHeightPx = parseInt(mainVisualModule.dataset.rightMenuItemHeightPx, 10) || 92;
+
+    let currentActiveIndex = 0;
+    let rightMenuAutoRollingInterval; // 오른쪽 메뉴 롤링 인터벌
+
+    const menuList = mainVisualModule.querySelector('.main-visual-right .menu-list');
+    if (menuList) {
+        menuItems.forEach(item => {
+            item.style.height = `${rightMenuItemHeightPx}px`;
+        });
+
+        let actualMenuListHeight = 0;
+        menuItems.forEach(item => {
+            actualMenuListHeight += item.offsetHeight;
+        });
+
+        if (rightMenuRollingEnabled) {
+            menuList.style.height = `${rightMenuVisibleItems * rightMenuItemHeightPx}px`;
+        } else {
+            menuList.style.height = `${actualMenuListHeight}px`;
+            menuList.classList.add('static-menu');
+        }
+        
+        mainVisualModule.style.height = menuList.style.height;
+    }
+
+    function activateLeftContent(index) {
+        menuItems.forEach(item => item.classList.remove('active'));
+        if (menuItems[index]) {
+            menuItems[index].classList.add('active');
+        }
+
+        currentActiveIndex = index;
+
+        mainVisualModule.querySelectorAll('.main-visual-left .content-group').forEach(group => {
+            group.style.display = 'none';
+        });
+
+        const targetBoardId = menuItems[index].dataset.id;
+        const targetContentGroup = mainVisualModule.querySelector(`.main-visual-left .content-group[data-id="${targetBoardId}"]`);
+        if (targetContentGroup) {
+            targetContentGroup.style.display = 'block';
+
+            const leftContentType = menuItems[index].dataset.leftContentType;
+            const leftContentRollingTime = parseInt(menuItems[index].dataset.leftContentRollingTime, 10) || 0;
+
+            if (leftContentType === 'slider') {
+                const targetHeadmainWrap = targetContentGroup.querySelector('.headmain_wrap');
+                if (targetHeadmainWrap) {
+                    targetHeadmainWrap.style.display = 'block';
+                    const targetSliderContainer = targetHeadmainWrap.querySelector(`.headmain-slider-${targetBoardId}`);
+                    if (targetSliderContainer) {
+                        if (typeof jQuery !== 'undefined' && jQuery.fn.cycle) {
+                            if (jQuery(targetSliderContainer).data('cycle.opts')) {
+                                jQuery(targetSliderContainer).cycle('destroy');
+                            }
+                            // 💡 [핵심] Cycle2가 prev/next 옵션을 통해 버튼을 직접 제어하도록 위임합니다.
+                            jQuery(targetSliderContainer).cycle({
+                                fx: 'scrollHorz',
+                                timeout: leftContentRollingTime,
+                                slides: '> .main_visual',
+                                prev: jQuery(targetHeadmainWrap).find('.btn_left'),
+                                next: jQuery(targetHeadmainWrap).find('.btn_right'),
+                                log: false
+                            });
+                        } else {
+                            console.warn("jQuery Cycle2 라이브러리가 로드되지 않았습니다. 슬라이더 기능이 작동하지 않습니다.");
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    function startRightMenuRolling() {
+        if (!rightMenuRollingEnabled) return;
+
+        stopRightMenuRolling();
+        rightMenuAutoRollingInterval = setInterval(() => {
+            let nextIndex = (currentActiveIndex + 1) % menuItems.length;
+            
+            if (typeof jQuery !== 'undefined' && jQuery.fn.cycle) {
+                jQuery('.main-visual-right .menu-list').cycle('goto', nextIndex);
+            }
+            activateLeftContent(nextIndex);
+        }, rightMenuRollingTime);
+    }
+
+    function stopRightMenuRolling() {
+        clearInterval(rightMenuAutoRollingInterval);
+    }
+
+    menuItems.forEach((menuItem, index) => {
+        menuItem.addEventListener('click', (e) => {
+            const linkToBoard = menuItem.dataset.linkToBoard === 'true';
+            
+            if (rightMenuRollingEnabled || !linkToBoard) {
+                e.preventDefault(); 
+            }
+            
+            activateLeftContent(index);
+            stopRightMenuRolling();
+            if (rightMenuRollingEnabled && typeof jQuery !== 'undefined' && jQuery.fn.cycle) {
+                jQuery('.main-visual-right .menu-list').cycle('goto', index);
+            }
+        });
+    });
+
+    // 💡 [최종 수정] 불필요하고 충돌을 일으키는 수동 버튼 제어 로직을 완전히 제거합니다.
+    /*
+    mainVisualModule.querySelectorAll('.headmain_wrap .btn_left').forEach(btn => {
+        btn.addEventListener('click', () => { ... });
+    });
+    mainVisualModule.querySelectorAll('.headmain_wrap .btn_right').forEach(btn => {
+        btn.addEventListener('click', () => { ... });
+    });
+    */
+
+    mainVisualModule.addEventListener('mouseenter', stopRightMenuRolling);
+    mainVisualModule.addEventListener('mouseleave', startRightMenuRolling);
+
+    if (rightMenuRollingEnabled && typeof jQuery !== 'undefined' && jQuery.fn.cycle) {
+        jQuery('.main-visual-right .menu-list').cycle({
+            fx: 'carousel',
+            timeout: rightMenuRollingTime,
+            slides: '> li',
+            vertical: true,
+            carouselVisible: rightMenuVisibleItems,
+            allowWrap: true,
+            log: false
+        });
+
+        jQuery('.main-visual-right .menu-list').on('cycle-before', (event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) => {
+            const incomingIndex = jQuery(incomingSlideEl).index();
+            activateLeftContent(incomingIndex);
+        });
+    }
+
+    activateLeftContent(0);
+    startRightMenuRolling();
+};