https://www.pointtwofivesecond.com/on/demandware.static/Sites-025s-Site/-/en_US/v1790956604389/js/accordion.js

1/*
2 * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
3 * This devtool is neither made for production nor for readable output files.
4 * It uses "eval()" calls to create a separate source file in the browser devtools.
5 * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
6 * or disable the default devtool with "devtool: false".
7 * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
8 */
9/******/ (function() { // webpackBootstrap
10/******/ 	var __webpack_modules__ = ({
11
12/***/ "./

12cartridges/app_custom_025s/cartridge/client/default/js/accordion.js":
13/*!*****************************************************************************!*\
14  !*** ./cartridges/app_custom_025s/cartridge/client/default/js/accordion.js ***!
15  \*****************************************************************************/
16/***/ (function() {
17
18eval("{document.addEventListener('DOMContentLoaded', function ()\r\n{\r\n        window.toggleContent = function(detailId, buttonElement) {\r\n         console.log('로그 찍히는지확인');\r\n   const detailDiv = document.getElementById(detailId);\r\n            const toggleIcon = buttonElement.querySelector('#toggle-icon');\r\n            const isVisible = detailDiv.style.display === 'block';\r\n\r\n      const reservationWrapper = buttonElement.closest('.tea_reservation');\r\n      if (isVisible) {\r\n                // Slide up animation\r\n                detailDiv.style.transition = 'max-height 0.5s ease-out';\r\n                detailDiv.style.maxHeight = '0';\r\n                detailDiv.style.overflow = 'hidden';\r\n                setTimeout(() => {\r\n                    detailDiv.style.display = 'none';\r\n                }, 500); // Match transition duration\r\n                toggleIcon.src = 'https://blvp-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Library-Sites-RefArchSharedLibrary/default/dw06e84a6d/dkbmc/images/plus3.png';\r\n                toggleIcon.alt = 'Expand';\r\n         if(reservationWrapper) {reservationWrapper.classList.remove('active');} \r\n   } else {\r\n                // Slide down animation\r\n                detailDiv.style.display = 'block';\r\n                detailDiv.style.maxHeight = '0';\r\n                detailDiv.style.overflow = 'hidden';\r\n                // Trigger reflow to ensure animation starts\r\n                detailDiv.offsetHeight;\r\n                detailDiv.style.transition = 'max-height 0.5s ease-in';\r\n                detailDiv.style.maxHeight = '500px'; // Adjust to a value larger than content height\r\n                toggleIcon.src = 'https://blvp-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Library-Sites-RefArchSharedLibrary/default/dw06e84a6d/dkbmc/images/minus3.png';\r\n                toggleIcon.alt = 'Collapse';\r\n    if(reservationWrapper){reservationWrapper.classList.add('active');\r\n         }         }\r\n        }\r\n\r\n        // Modified initialization function to set initial state with max-height transition only\r\n            const detailIds = ['tea_detail_1', 'tea_detail_2'];\r\n\r\n            detailIds.forEach(detailId => {\r\n                const detailDiv = document.getElementById(detailId);\r\n                \r\n                if (!detailDiv) return; // Skip if the detailDiv is not found\r\n\r\n                const teaReservationElement = detailDiv.closest('.tea_reservation');\r\n                \r\n                if (!teaReservationElement) return; // Skip if the .tea_reservation parent is not found\r\n\r\n                const buttonElement = teaReservationElement.querySelector('.tea_reservation_title');\r\n                const toggleIcon = buttonElement ? buttonElement.querySelector('#toggle-icon') : null;\r\n\r\n                if (!buttonElement || !toggleIcon) return; // Skip if the button or toggle icon are missing\r\n\r\n                // Set initial styles for collapsed state\r\n                detailDiv.style.display = 'block';\r\n                detailDiv.style.maxHeight = '0';\r\n                detailDiv.style.overflow = 'hidden';\r\n\r\n                // Trigger reflow to ensure animation starts\r\n                detailDiv.offsetHeight;\r\n\r\n                // Apply transition and animate to expanded state\r\n                detailDiv.style.transition = 'max-height 0.5s ease-in';\r\n                detailDiv.style.maxHeight = '500px'; // Adjust based on content\r\n\r\n                // Update toggle icon to reflect expanded state\r\n                toggleIcon.src = 'https://blvp-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Library-Sites-RefArchSharedLibrary/default/dw06e84a6d/dkbmc/images/minus3.png';\r\n                toggleIcon.alt = 'Collapse';\r\n            });\r\n\r\n            const navbar = document.querySelector('.sliding-left-navbar');\r\n            const contentTop = document.querySelector('.content-top');\r\n            const closeButton = document.querySelector('.lm-banner-detail-close');\r\n            if (!navbar || !contentTop || !closeButton) {\r\n                return;\r\n            }\r\n            // Function to open the sidebar\r\n            function openSidebar() {\r\n                navbar.style.left = '0';\r\n            }\r\n            \r\n            // Function to close the sidebar\r\n            function closeSidebar() {\r\n                navbar.style.left = '-448px';\r\n            }\r\n            \r\n            // Event listener for content-top to toggle sidebar\r\n            contentTop.addEventListener('click', () => {\r\n                if (navbar.style.left === '0px') {\r\n                    closeSidebar();\r\n                } else {\r\n                    openSidebar();\r\n                }\r\n            });\r\n            // Event listener for lm-banner-detail-close to close sidebar\r\n            closeButton.addEventListener('click', closeSidebar);\r\n\r\n            const headerBannerStatus = window.sessionStorage.getItem('hide_header_banner');\r\n            const toggleMenuContainer = document.querySelector('#list_moToggleMenu');\r\n            const toggleBtn = document.querySelector('#mo_list_toggleMenuBtn');\r\n            const toggleIcon = document.querySelector('#mo_list_menuToggleIcon');\r\n            const mobileSubMenu = document.querySelector('#list_mobileSubMenu');\r\n            const menuItems = document.querySelectorAll('#list_mobileSubMenu li a');\r\n            const moListTitle = document.getElementById(\"list_menuTitle\");\r\n            const originalTitle = moListTitle?.textContent || '';\r\n            let isToggled = false; // Track toggle state\r\n            if (!headerBannerStatus || !toggleMenuContainer || !toggleBtn || !toggleIcon || !mobileSubMenu || !menuItems || !moListTitle) {\r\n            return;\r\n            }\r\n            function handleScroll() {\r\n                const nowScrollTop = window.scrollY || document.documentElement.scrollTop;\r\n\r\n                // Determine top positions based on header banner status\r\n                const menuTop = headerBannerStatus > 0 ? '60px' : '90px';\r\n                const subMenuTop = headerBannerStatus > 0 ? '98px' : '142px';\r\n\r\n                // Apply styles using vanilla JavaScript\r\n                toggleMenuContainer.style.top = menuTop;\r\n                toggleMenuContainer.style.display = nowScrollTop > 1 ? 'flex' : 'none';\r\n                mobileSubMenu.style.display = nowScrollTop > 1 ? 'flex' : 'none';\r\n                \r\n                // Only apply submenu styles if not toggled\r\n                if (!mobileSubMenu.classList.contains('open')) {\r\n                    mobileSubMenu.style.top = subMenuTop;\r\n                    mobileSubMenu.style.transition = 'max-height 0.2s ease-in-out';

18\r\n                    menuItems.forEach(item => {\r\n                        item.style.display = 'block';\r\n                    });\r\n\r\n                    if (nowScrollTop <= 1) {\r\n                        mobileSubMenu.classList.remove('open');\r\n                        mobileSubMenu.style.maxHeight = '0';\r\n                        toggleIcon.style.transform = 'rotate(0deg)';\r\n                        menuItems.forEach(item => {\r\n                            item.parentElement.style.display = item.classList.contains('active') ? 'list-item' : 'none';\r\n                        });\r\n                    } else {\r\n                        mobileSubMenu.style.maxHeight = '76px';\r\n                    }\r\n                }\r\n            }\r\n\r\n            function handleToggle() {\r\n                const isOpen = mobileSubMenu.classList.contains('open');\r\n                const subMenuTop = headerBannerStatus > 0 ? '98px' : '142px';\r\n\r\n                // Toggle title between \"TEA THOLOGY\" and original\r\n                if (isToggled) {\r\n                    moListTitle.textContent = originalTitle;\r\n                } else {\r\n                    moListTitle.textContent = originalTitle.includes(\"SPACE\") ? \"SPACE\" : \"TEA THOLOGY\";\r\n                }\r\n                isToggled = !isToggled; // Update toggle state\r\n\r\n                if (isOpen) {\r\n                    mobileSubMenu.classList.remove('open');\r\n                    mobileSubMenu.style.maxHeight = '0';\r\n                    toggleIcon.style.transform = 'rotate(0deg)';\r\n                    menuItems.forEach(item => {\r\n                        item.parentElement.style.display = item.classList.contains('lang_kor') ? 'list-item' : 'none';\r\n                    });\r\n                } else {\r\n                    mobileSubMenu.classList.add('open');\r\n                    mobileSubMenu.style.top = subMenuTop;\r\n                    mobileSubMenu.style.transition = 'max-height 0.2s ease-in-out';\r\n                    mobileSubMenu.style.maxHeight = '76px';\r\n                    mobileSubMenu.style.flexFlow = 'column';\r\n                    toggleIcon.style.transform = 'rotate(180deg)';\r\n                    menuItems.forEach(item => {\r\n                        item.style.display = 'block';\r\n                        item.parentElement.style.display = 'list-item';\r\n                    });\r\n                }\r\n            }\r\n\r\n            // Initial call\r\n            handleScroll();\r\n\r\n            // Add scroll event listener (throttled for performance)\r\n            let isScrolling;\r\n            window.addEventListener('scroll', () => {\r\n                clearTimeout(isScrolling);\r\n                isScrolling = setTimeout(handleScroll, 50);\r\n            });\r\n\r\n            // Add click event listener for toggle button\r\n            toggleBtn.addEventListener('click', handleToggle);\r\n});\n\n//# sourceURL=webpack://sfra/./cartridges/app_custom_025s/cartridge/client/default/js/accordion.js?\n}");
19
20/***/ })

20
21
22/******/ 	});
23/************************************************************************/
24/******/ 	
25/******/ 	// startup
26/******/ 	// Load entry module and return exports
27/******/ 	// This entry module can't be inlined because the eval devtool is used.
28/******/ 	var __webpack_exports__ = {};
29/******/ 	__webpack_modules__["./cartridges/app_custom_025s/cartridge/client/default/js/accordion.js"]();
30/******/ 	
31/******/ })()
32;