https://hopphat.com/wp-content/themes/thcmedia-company/assets/js/mobile-menu.js?ver=1.0.1

1jQuery(document).ready(function ($) {
2    /**
3     * Content: File js cấu hình mobile menu
4     * @creator Tuyên
5     * @time 17/02/2022 18:50
6     */
7    var menu_id = '#menu-danh-muc-san-pham-2';
8    var menu_button = $('.responsive-menu-toggle');
9    var body = $('body');
10    // console.log('hẻeeerr');
11    $(menu_id + ' li.menu-item-has-children').append('<i class="fas open fa-plus"></i>');
12    $(menu_id + ' li.menu-item-has-children > .fas').on('click', function() {
13        $(this).parent().toggleClass('active').siblings().removeClass('active');
14        $(this).prev('ul').slideToggle();
15        $(this).find('i').toggleClass('clicked');
16        $(this).parent().siblings().find('ul').slideUp();
17        return false;
18    });
19
20    // $('html').click(function(event) {
21    //     if ($(event.target).closest(menu_id).length === 0) {
22    //         $(menu_id).removeClass('active');
23    //         body.removeClass('mobile-slide-menu');
24    //     }
25    // });
26    var mobile_init_W = 1240;
27    var slide = $('#Side_slide');
28    var overlay = $('#body_overlay');
29    var ss_mobile_init_W = mobile_init_W;
30    var pos = 'left';
31
32
33    // constructor ----------
34
35    var constructor = function() {
36        if (!slide.hasClass('enabled')) {
37            $('nav#menu').detach().appendTo('#Side_slide .menu_wrapper');
38            slide.addClass('enabled');
39        }
40    };
41
42
43    // destructor ----------
44
45    var destructor = function() {
46        if (slide.hasClass('enabled')) {
47            close();
48            $('nav#menu').detach().prependTo('#Top_bar .menu_wrapper');
49            slide.removeClass('enabled');
50        }
51    };
52
53
54    // reload ----------
55
56    var reload = function() {
57
58        if (($(document).width() < ss_mobile_init_W)) {
59            constructor();
60        } else {
61            destructor();
62        }
63    };
64
65
66    // init ----------
67
68    var init = function() {
69        if (slide.hasClass('left')) {
70            pos = 'left';
71        }
72
73        if (body.hasClass('header-simple')) {
74            ss_mobile_init_W = 9999;
75        }
76
77        reload();
78    };
79
80
81    // reset to default ----------
82
83    var reset = function(time) {
84
85        $('.lang-active.active', slide).removeClass('active').children('i').attr('class', 'icon-down-open-mini');
86        $('.lang-wrapper', slide).fadeOut(0);
87
88        $('.icon.search.active', slide).removeClass('active');
89        $('.search-wrapper', slide).fadeOut(0);
90
91        $('.menu_wrapper, .social', slide).fadeIn(time);
92
93    };
94
95
96    // menu button ----------
97
98    var button = function() {
99
100        // show
101        if (pos == 'left') {
102            slide.animate({ 'left': 0 }, 300);
103            body.animate({ 'right': -125 }, 300);
104        } else {
105            slide.animate({ 'right': 0 }, 300);
106            body.animate({ 'left': -125 }, 300);
107        }
108
109        overlay.fadeIn(300);
110
111        // reset
112        reset(0);
113
114    };
115
116
117    // close ----------
118
119    var close = function() {
120
121        if (pos == 'left') {
122            slide.animate({ 'left': -270 }, 300);
123            body.animate({ 'right': 0 }, 300);
124        } else {
125            slide.animate({ 'right': -270 }, 300);
126            body.animate({ 'left': 0 }, 300);
127        }
128
129        overlay.fadeOut(300);
130    };
131
132
133    // search ----------
134
135    $('.icon.search', slide).on('click', function(e) {
136
137        e.preventDefault();
138
139        var el = $(this);
140
141        if (el.hasClass('active')) {
142
143            $('.search-wrapper', slide).fadeOut(0);
144            $('.menu_wrapper, .social', slide).fadeIn(300);
145
146        } else {
147
148            $('.search-wrapper', slide).fadeIn(300);
149            $('.menu_wrapper, .social', slide).fadeOut(0);
150
151            $('.lang-active.active', slide).removeClass('active').children('i').attr('class', 'icon-down-open-mini');
152            $('.lang-wrapper', slide).fadeOut(0);
153
154        }
155
156        el.toggleClass('active');
157    });
158
159
160    // search form submit ----------
161
162    $('a.submit', slide).on('click', function(e) {
163        e.preventDefault();
164        $('#side-form').submit();
165    });

166
167
168    // lang menu ----------
169
170    $('.lang-active', slide).on('click', function(e) {
171        e.preventDefault();
172
173        var el = $(this);
174
175        if (el.hasClass('active')) {
176
177            $('.lang-wrapper', slide).fadeOut(0);
178            $('.menu_wrapper, .social', slide).fadeIn(300);
179            el.children('i').attr('class', 'icon-down-open-mini');
180
181        } else {
182
183            $('.lang-wrapper', slide).fadeIn(300);
184            $('.menu_wrapper, .social', slide).fadeOut(0);
185            el.children('i').attr('class', 'icon-up-open-mini');
186
187            $('.icon.search.active', slide).removeClass('active');
188            $('.search-wrapper', slide).fadeOut(0);
189
190        }
191
192        el.toggleClass('active');
193    });
194
195
196    // init, click, debouncedresize ----------
197
198    // init
199
200    init();
201
202    // click | menu button
203
204    menu_button.off('click');
205
206    menu_button.on('click', function(e) {
207        e.preventDefault();
208        // body.toggleClass('mobile-slide-menu');
209        $('.menu-menu-chinh-container').toggleClass('active');
210        button();
211    });
212
213    // click | close
214
215    overlay.on('click', function(e) {
216        // if (body.hasClass('mobile-slide-menu')) {
217        //     body.toggleClass('mobile-slide-menu');
218        // }
219        close();
220    });
221
222    $('.close', slide).on('click', function(e) {
223        e.preventDefault();
224        close();
225    });
226
227    // click | below search or languages menu
228
229    $(slide).on('click', function(e) {
230        if ($(e.target).is(slide)) {
231            reset(300);
232        }
233    });
234
235    // debouncedresize
236
237    $(window).on('debouncedresize', reload);
238    function sideSlide() {
239
240
241
242    }
243
244
245    // menu-mobile
246    $('.responsive-menu-toggle .far.fa-bars').click(function() {
247        $('.nav-menu-mobile').addClass('show');
248    });
249
250    $('.icon-cancel').click(function() {
251        $('.nav-menu-mobile').removeClass('show');
252    });
253});