https://smartfarmkorea.net/static/js/layout.js?v=491945ad-5555-43e4-99b7-843df0e9ccb8

1$(document).ready(function() {
2    //select
3    $('select:not(.not)').niceSelect();
4
5     // // 헤더 - 메뉴
6    // 최대 높이 계산 및 적용 함수
7    function updateMenuHeight() {
8        const depth2Elements = document.querySelectorAll(".depth2");
9        const menuBg = document.querySelector(".menu_bg");
10    
11        // 최대 높이 계산
12        let maxHeight = 0;
13        depth2Elements.forEach((depth2) => {
14            depth2.style.height = "auto"; // 높이 초기화
15            const currentHeight = depth2.offsetHeight; // 현재 높이 계산
16            if (currentHeight > maxHeight) {
17                maxHeight = currentHeight; // 가장 큰 높이 저장
18            }
19        });
20    
21        // 모든 depth2 요소와 menu_bg에 동일한 높이 적용
22        depth2Elements.forEach((depth2) => {
23            depth2.style.height = `${maxHeight}px`;
24        });
25    
26        if (menuBg) {
27            menuBg.style.height = `${maxHeight}px`;
28        }
29        }
30    
31        // 포커스 이벤트: 키보드 접근 시 메뉴 활성화
32        $('.lnb > .menu_inner .depth1 a').on('focus', function () {
33        const parent1 = $(this).closest('.depth1');
34    
35        // 모든 .depth2 메뉴 활성화
36        $('.lnb .depth2').css('display', 'block');
37    
38        // 활성화 상태 업데이트
39        $('.lnb > .menu_inner .depth1').removeClass('over');
40        parent1.addClass('over');
41    
42        // menu_bg 스타일 설정
43        $('.menu_bg').css({
44            'box-shadow': '0 3px 10px 0 rgba(0, 0, 0, 0.05)',
45        });
46    
47        // 메뉴 높이 업데이트
48        updateMenuHeight();
49        });
50    
51        // 포커스를 벗어날 때 처리
52        $('.lnb > .menu_inner .depth1').each(function () {
53        const parent2 = $(this);
54    
55        // 서브 메뉴의 마지막 항목에서 blur 발생 시
56        $(this)
57            .find('.menu_footer li:last-child a')
58            .on('blur', function () {
59                hideMenu(parent2);
60            });
61    
62        // 키보드로 이동 시 처리
63        $(this)
64            .find('> a')
65            .on('keydown', function (e) {
66                if (e.shiftKey && e.keyCode === 9) {
67                    hideMenu(parent2);
68                }
69            });
70    
71        // focusout으로 포커스 벗어날 때 처리
72        $(this).on('focusout', function (e) {
73            if (!$(e.relatedTarget).closest('.depth2').length) {
74                hideMenu(parent2);
75            }
76        });
77    
78         // menu_bg 스타일 초기화
79        $('.menu_bg').css({
80            'box-shadow': 'none',
81        });
82        });
83    
84        // 메뉴 숨기기 함수
85        function hideMenu(parent) {
86        $('.menu_bg').css('height', '0'); // .menu_bg 숨기기
87        $('.lnb .depth2').css('display', 'none'); // 모든 depth2 메뉴 숨기기
88        parent.removeClass('over'); // 활성화 해제
89        }
90    
91        // depth2_item 및 depth3_item에 hover 시 over 추가
92        $('.depth2_item, .depth3_item')
93        .on('mouseenter', function () {
94            $(this).addClass('over'); // 해당 항목에만 over 클래스 추가
95        })
96        .on('mouseleave', function () {
97            $(this).removeClass('over'); // 해당 항목에서 over 클래스 제거
98        });
99    
100        // 마우스 hover 시 depth2 메뉴 활성화
101        $('.lnb > .menu_inner .depth1')
102        .on('mouseenter', function () {
103            const parent = $(this);
104    
105            // 활성화 상태 추가
106            parent.addClass('over');
107            $('#header').removeClass('header_shadow');
108            $('.depth2').show();
109    
110            // 메뉴 높이 업데이트
111            updateMenuHeight();
112    
113            // menu_bg 스타일 설정
114            $('.menu_bg').css({
115                'box-shadow': '0 3px 10px 0 rgba(0, 0, 0, 0.05)',
116            });
117        })
118        .on('mouseleave', function () {
119            // 비활성화 처리
120            hideMenu($(this));
121    
122            // menu_bg 스타일 초기화
123            $('.menu_bg').css({
124                'box-shadow': 'none',
125            });
126        });
127
128
129    // // MOBILE MENU
130    $(".mob_lnb .depth1").click(function () {
131        $(".mob_lnb .depth1.over").removeClass("over");
132        $(this).addClass("over");
133        });
134    
135        $(".mob_lnb .depth2 .depth2_item > a").click(function (e) {
136        var parent = $(this).closest(".depth2_item");
137    
138        if (parent.hasClass("hasChild")) {
139            //하위메뉴가 있을경우 메뉴를 슬라이드한다
140            e.preventDefault(); //a태그 이동을 멈춘다.
141            if (parent.hasClass("active")) {
142            parent.removeClass("active");
143            parent.find(".depth3").slideUp(200);
144            } else {
145            parent.addClass("active");
146            parent.find(".depth3").slideDown(200);
147            }
148        }
149    });

150
151    // // 하단 배너
152    var banner_collect_swiper = new Swiper(".banner_collect_swiper", {
153        spaceBetween: 60,
154        slidesPerView: 'auto',
155        loop: true,
156        autoplay: {
157            delay: 4200,
158            disableOnInteraction: false,
159        },
160        breakpoints: {
161            1100: {
162                spaceBetween: 100,
163                slidesPerView: 'auto',
164            }
165        },
166        navigation: {
167            nextEl: ".banner_collect_wrap .btn_next button",
168            prevEl: ".banner_collect_wrap .btn_prev button",
169        },
170    });
171    
172        $(".banner_collect_wrap .btns .btn.btn_pause").click(function () {
173        var parent = $(this).closest("div");
174        if (parent.hasClass("active")) {
175            parent.removeClass("active");
176            banner_collect_swiper.autoplay.start();
177            $(this).find("span").html("배너 슬라이드 일시정지");
178        } else {
179            parent.addClass("active");
180            banner_collect_swiper.autoplay.stop();
181            $(this).find("span").html("배너 슬라이드 시작");
182        }
183    });
184
185
186    // // 탑 버튼
187    $(function () {
188        $('.floating_pop .topBtn').click(function () {
189            $('body,html').animate({
190                scrollTop: 0
191            }, 300);  // 탑 이동 스크롤 속도
192                return false;
193        });
194    });
195
196
197    // 모바일 메뉴 - 로그인 / 로그아웃 - 임시 스크립트
198    $('.mob_login_btn, .mob_login_btn_wr_after button').click(function() {
199        $('.mob_login_btn_wr, .mob_login_btn_wr_after').toggleClass('on');
200    });
201
202
203    // 팝업 - 테이블 더보기 버튼
204    document.addEventListener('click', function (event) {
205        if (event.target.closest('.btn_extend')) {
206            var btnExtend = event.target.closest('.btn_extend');
207            var innerDiv = btnExtend.querySelector('.inner');
208            var extendBtnSvg = $(btnExtend).find(".xi-angle-down");
209    
210            if (innerDiv.textContent.trim().includes('더보기')) {
211                innerDiv.firstChild.textContent = '간략보기 ';
212                extendBtnSvg.css("transform", "rotate(180deg)");
213                $('.tableWr .popup_table tr.extend').show();
214            } else {
215                innerDiv.firstChild.textContent = '더보기 ';
216                extendBtnSvg.css("transform", "rotate(360deg)");
217                $('.tableWr .popup_table tr.extend').hide();
218            }
219        }
220    });
221
222
223}); ////
224
225
226 // // 모바일메뉴열기
227function openMenu() {
228    $(".mob_menu").addClass("open");
229    }
230
231// // 모바일메뉴 닫기
232function closeMenu() {
233$(".mob_menu").removeClass("open");
234}
235
236function openPopup(){
237    $('.modal_popup').css('display' , 'flex');
238}
239
240function openDeveloperInquiryPopup(){
241    $('.developerInquiry_popup').css('display' , 'flex');
242}
243
244function openUserEvaluationPopup(){
245    $('.userEvaluation_popup').css('display' , 'flex');
246}
247
248function closePopup(){
249    $('.modal_popup').hide();
250}