https://www.bigbrotherafrica.com/wp-content/themes/matina/assets/js/matina-scripts.js?ver=1.0.8

1/**
2 * custom script for frontend.
3 *
4 * @package Matina
5 */
6
7jQuery(document).ready(function($){
8
9    "use-strict";
10
11    var sidebarSticky   = MT_JSObject.sidebar_sticky;
12    var headerSticky    = MT_JSObject.header_sticky;
13
14    // define rtl value
15    var rtlValue = $("body").hasClass("rtl");
16
17    /**
18     * Preloader
19     */
20    if( $('#preloader-background').length > 0 ) {
21        setTimeout(function(){$('#preloader-background').hide();}, 600);
22    }
23
24    /**
25     * Header search form toggle
26     */
27    $('.header-search-wrapper .search-icon').click(function() {
28        $('.search-form-wrap').toggleClass('active-search');
29        var element = document.querySelector( '.search-form-wrap.active-search' );
30        if( element ) {
31            $(document).on('keydown', function(e) {
32                var focusable = element.querySelectorAll( 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
33                var firstFocusable = focusable[0];
34                var lastFocusable = focusable[focusable.length - 1];
35                matina_focus_trap( firstFocusable, lastFocusable, e );
36            })
37        }
38    });
39
40    $('.search-form-wrap .search-close').click(function() {
41        $('.search-form-wrap').toggleClass('active-search');
42        var focusElement = $( this ).data( 'focus' );
43        $( focusElement ).focus();
44    });
45
46    /**
47     * masthead menu toggle
48     */
49    $( '#masthead .menu-toggle' ).click(function(){
50        $('#masthead .primary-menu-wrap').toggleClass('menu-active'); 
51        var element = document.querySelector( '.primary-menu-wrap.menu-active' );
52        if( element ) {
53            $(document).on('keydown', function(e) {
54                var focusable = element.querySelectorAll( 'input, a, button' );
55                focusable = Array.prototype.slice.call( focusable );
56                focusable = focusable.filter( function( focusableelement ) {
57                    return null !== focusableelement.offsetParent;
58                } );
59                var firstFocusable = focusable[0];
60                var lastFocusable = focusable[focusable.length - 1];
61                matina_focus_trap( firstFocusable, lastFocusable, e );
62            })
63        }
64    });
65    
66    $('.main-menu-close').click(function() {
67        $('#masthead .primary-menu-wrap').removeClass('menu-active');
68        var focusElement = $( this ).data( 'focus' );
69        $( focusElement ).focus();
70    });
71
72    /**
73     * Focus trap in popup.
74     */
75    var KEYCODE_TAB = 9;
76    function matina_focus_trap( firstFocusable, lastFocusable, e ) {
77        if (e.key === 'Tab' || e.keyCode === KEYCODE_TAB) {
78            if ( e.shiftKey ) /* shift + tab */ {
79                if (document.activeElement === firstFocusable) {
80                    lastFocusable.focus();
81                    e.preventDefault();
82                }
83            } else /* tab */ {
84                if ( document.activeElement === lastFocusable ) {
85                    firstFocusable.focus();
86                    e.preventDefault();
87                }
88            }
89        }
90    }
91
92    /**
93     * Close popups on escape key.
94     */
95    $( document ).on( 'keydown', function( event ) {
96        if ( event.keyCode === 27 ) {
97            event.preventDefault();
98            $( '.primary-menu-wrap' ).removeClass( 'menu-active' );
99            $( '.search-form-wrap' ).removeClass( 'active-search' );
100        }
101    })
102
103    /**
104     * Primary menu sub-toggle
105     */
106    $('<a class="sub-toggle" href="javascript:void(0);"><i class="fa fa-angle-down"></i></a>').insertAfter('#site-navigation .menu-item-has-children>a, #site-navigation .page_item_has_children>a');
107
108    $('body').on( 'click', '#site-navigation .sub-toggle', function() {
109        $(this).parent('.menu-item-has-children').children('ul.sub-menu').first().slideToggle();
110        $(this).parent('.page_item_has_children').children('ul.children').first().slideToggle();
111        $(this).children('.fa').first().toggleClass('fa-angle-right').toggleClass('fa-angle-down');
112    });

113    
114    /**
115     * define banner slider data value
116     */
117    var autoValue       = $('.bannerSlide').data('auto');
118    var modeValue       = $('.bannerSlide').data('mode');
119    var pagerValue      = $('.bannerSlide').data('pager');
120    var controlValue    = $('.bannerSlide').data('control');
121    var pauseValue      = $('.bannerSlide').data('pause');
122    var speedValue      = $('.bannerSlide').data('speed');
123    var itemValue       = $('.bannerSlide').data('item');
124
125    /**
126     * Scripts for homepage banner
127     */
128    $(".bannerSlide").lightSlider({
129        item: itemValue,
130        auto: autoValue,
131        pager: pagerValue,
132        control: controlValue,
133        loop: true,
134        slideMargin: 0,
135        speed: speedValue,
136        pause: pauseValue,
137        enableTouch: false,
138        enableDrag: false,
139        rtl: rtlValue,
140        mode: modeValue,
141        prevHtml: '<i class="fas fa-arrow-left"></i>',
142        nextHtml: '<i class="fas fa-arrow-right"></i>',
143        onSliderLoad: function() {
144            $('.bannerSlide').removeClass('cS-hidden');
145        },
146        responsive: [
147            {
148                breakpoint: 991,
149                settings: {
150                    item: 1,
151                    slideMove: 1,
152                    slideMargin: 10,
153                }
154            },
155            {
156                breakpoint: 767,
157                settings: {
158                    item: 1,
159                    slideMove: 1,
160                }
161            }
162        ]
163    });
164
165    /**
166     * Scripts for homepage featured carousel
167     */
168    $('.featuredCarousel').each(function(){
169        var Id = $(this).attr('id');
170        var NewId = Id;
171        var itemCount = $(this).data('item');
172        NewId = $('#' + Id + " .featured-items-wrapper").lightSlider({
173            item: itemCount,
174            auto: true,
175            pager: false,
176            controls: false,
177            loop: true,
178            slideMargin: 30,
179            speed: 1000,
180            pause: 7000,
181            enableTouch: false,
182            enableDrag: false,
183            rtl: rtlValue,
184            onSliderLoad: function() {
185                $('#featured-section').removeClass('cS-hidden');
186            },
187            responsive: [
188                {
189                    breakpoint: 1200,
190                    settings: {
191                        item: 3,
192                        slideMove: 1,
193                        slideMargin: 10,
194                    }
195                },
196                {
197                    breakpoint: 991,
198                    settings: {
199                        item: 2,
200                        slideMove: 1,
201                        slideMargin: 10,
202                    }
203                },
204                {
205                    breakpoint: 767,
206                    settings: {
207                        item: 1,
208                        slideMove: 1,
209                    }
210                }
211            ]
212        });
213        $('#' + Id + ' .featuredCarousel-controls__prev').click(function() {
214            NewId.goToPrevSlide();
215        });
216        $('#' + Id + ' .featuredCarousel-controls__next').click(function() {
217            NewId.goToNextSlide();
218        });
219    });
220
221    /**
222     * Scripts for homepage featured carousel but only for featured category layout 2 and 3
223     */
224    $('.featuredCarousel2').each(function(){
225        var Id = $(this).attr('id');
226        var NewId = Id;
227        var itemCount = $(this).data('item');
228        NewId = $('#' + Id + " .featured-items-wrapper").lightSlider({
229            item: itemCount,
230            auto: true,
231            pager: false,
232            loop: true,
233            slideMargin: 30,
234            speed: 1000,
235            pause: 7000,
236            enableTouch: false,
237            enableDrag: false,
238            rtl: rtlValue,
239            onSliderLoad: function() {
240                $('#featured-section').removeClass('cS-hidden');
241            },
242            responsive: [
243                {
244                    breakpoint: 1200,
245                    settings: {
246                        item: 3,
247                        slideMove: 1,
248                        slideMargin: 10,
249                    }
250                },
251                {
252                    breakpoint: 991,
253                    settings: {
254                        item: 2,
255                        slideMove: 1,
256                        slideMargin: 10,
257                    }
258                },
259                {
260                    breakpoint: 767,
261                    settings: {
262                        item: 1,
263                        slideMove: 1,
264                    }
265                }
266            ]
267        });
268    });

269
270    /**
271     * Masonry Layout in archive.
272     */
273    var grid = document.querySelector('.archive-style--masonry .mt-archive-posts-wrapper'),
274    masonry;
275
276    if (
277        grid &&
278        typeof Masonry !== undefined &&
279        typeof imagesLoaded !== undefined
280    ) {
281        imagesLoaded( grid, function( instance ) {
282            masonry = new Masonry( grid, {
283                itemSelector: 'article'
284            } );
285        } );
286    }
287
288    /**
289     * Scroll To Top
290     */
291    $(window).scroll(function() {
292        if ($(this).scrollTop() > 1000){
293            $('#matina-scroll-to-top').fadeIn('slow');
294        } else {
295            $('#matina-scroll-to-top').fadeOut('slow');
296        }
297    });
298    $('#matina-scroll-to-top').click(function(){
299        $("html, body").animate({
300            scrollTop: 0
301        }, 600);
302        return false;
303    });
304    
305    /**
306     * Sidebar sticky
307     */
308    if('true' === sidebarSticky){
309        $('#primary, #secondary').theiaStickySidebar({
310            additionalMarginTop: 30
311        });
312    }
313
314    /**
315     * Header sticky
316     */
317    if ( 'true' === headerSticky ) {
318        var windowWidth = $(window).width();
319        if( windowWidth > 600 ) {
320            var wpAdminBar = $('#wpadminbar');
321            if (wpAdminBar.length) {
322                $("#masthead.header--layout-default,.header--layout-one #header-sticky").sticky({topSpacing:wpAdminBar.height()});
323            } else {
324                $("#masthead.header--layout-default,.header--layout-one #header-sticky").sticky({topSpacing:0});
325            }
326        }
327    }
328
329    /**
330     * gallery post format 
331     */
332    $( '.mt-gallery-slider' ).lightSlider({
333        item: 1,
334        pager: false,
335        loop: true,
336        enableTouch: false,
337        enableDrag: false,
338        rtl: rtlValue,
339        prevHtml: '<i class="fas fa-arrow-left"></i>',
340        nextHtml: '<i class="fas fa-arrow-right"></i>',
341        responsive: [
342            {
343                breakpoint: 991,
344                settings: {
345                    item: 1,
346                    slideMove: 1,
347                    slideMargin: 10,
348                }
349            },
350            {
351                breakpoint: 767,
352                settings: {
353                    item: 1,
354                    slideMove: 1,
355                }
356            }
357        ]
358    });
359
360});