https://www.westerndivision.org/wp-content/themes/wdfcu-2016/libra…?ver=61bb00705570ce07575bf49095e227a9

1/*
2 * Bones Scripts File
3 * Author: Eddie Machado
4 *
5 * This file should contain any js scripts you want to add to the site.
6 * Instead of calling it in the header or throwing it inside wp_head()
7 * this file will be called automatically in the footer so as not to
8 * slow the page load.
9 *
10 * There are a lot of example functions and tools in here. If you don't
11 * need any of it, just remove it. They are meant to be helpers and are
12 * not required. It's your world baby, you can do whatever you want.
13*/
14
15
16/*
17 * Get Viewport Dimensions
18 * returns object with viewport dimensions to match css in width and height properties
19 * ( source: http://andylangton.co.uk/blog/development/get-viewport-size-width-and-height-javascript )
20*/
21function updateViewportDimensions() {
22	var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;
23	return { width:x,height:y };
24}
25// setting the viewport width
26var viewport = updateViewportDimensions();
27
28
29/*
30 * Throttle Resize-triggered Events
31 * Wrap your actions in this function to throttle the frequency of firing them off, for better performance, esp. on mobile.
32 * ( source: http://stackoverflow.com/questions/2854407/javascript-jquery-window-resize-how-to-fire-after-the-resize-is-completed )
33*/
34var waitForFinalEvent = (function () {
35	var timers = {};
36	return function (callback, ms, uniqueId) {
37		if (!uniqueId) { uniqueId = "Don't call this twice without a uniqueId"; }
38		if (timers[uniqueId]) { clearTimeout (timers[uniqueId]); }
39		timers[uniqueId] = setTimeout(callback, ms);
40	};
41})();
42
43// how long to wait before deciding the resize has stopped, in ms. Around 50-100 should work ok.
44var timeToWaitForLast = 100;
45
46// Banners Script
47jQuery(function($) {
48    $('#banners').cycle({
49      slides: '.banner', //Important because it works with images directly. Define the shared image class of the banners.
50      centerHorz: true,
51      centerVert: true,
52      delay:-1000,
53      fx: 'fade',
54      speed: 2000,
55      timeout: 3000,
56      pauseOnHover: true,
57      pagerFx:'scrollvert'
58    });
59});
60
61//* Sidr Mobile Menu */
62    jQuery('#mobile-menu').sidr({
63        source: '#main-nav'
64    });
65
66    jQuery('#sidr-closr').click(function(){
67        var open1 = $('.sidr:visible').attr('id');
68        jQuery.sidr('close', open1);
69    });
70
71// Slidedown Menu
72    jQuery(function($) {
73      $('.sub-menu').hide();
74      //Hover action
75      $('.menu-item-has-children').hover(function() {
76        $(this).find('.sub-menu').stop().slideToggle('fast');
77      });  
78    });
79
80
81/*
82 * Here's an example so you can see how we're using the above function
83 *
84 * This is commented out so it won't work, but you can copy it and
85 * remove the comments.
86 *
87 *
88 *
89 * If we want to only do it on a certain page, we can setup checks so we do it
90 * as efficient as possible.
91 *
92 * if( typeof is_home === "undefined" ) var is_home = $('body').hasClass('home');
93 *
94 * This once checks to see if you're on the home page based on the body class
95 * We can then use that check to perform actions on the home page only
96 *
97 * When the window is resized, we perform this function
98 * $(window).resize(function () {
99 *
100 *    // if we're on the home page, we wait the set amount (in function above) then fire the function
101 *    if( is_home ) { waitForFinalEvent( function() {
102 *
103 *	// update the viewport, in case the window size has changed
104 *	viewport = updateViewportDimensions();
105 *
106 *      // if we're above or equal to 768 fire this off
107 *      if( viewport.width >= 768 ) {
108 *        console.log('On home page and window sized to 768 width or more.');
109 *      } else {
110 *        // otherwise, let's do this instead
111 *        console.log('Not on home page, or window sized to less than 768.');
112 *      }
113 *
114 *    }, timeToWaitForLast, "your-function-identifier-string"); }
115 * });
116 *
117 * Pretty cool huh? You can create functions like this to conditionally load
118 * content and other stuff dependent on the viewport.
119 * Remember that mobile devices and javascript aren't the best of friends.
120 * Keep it light and always make sure the larger viewports are doing the heavy lifting.
121 *
122*/
123
124/*
125 * We're going to swap out the gravatars.
126 * In the functions.php file, you can see we're not loading the gravatar
127 * images on mobile to save bandwidth. Once we hit an acceptable viewport
128 * then we can swap out those images since they are located in a data attribute.
129*/
130function loadGravatars() {
131  // set the viewport using the function above
132  viewport = updateViewportDimensions();
133  // if the viewport is tablet or larger, we load in the gravatars
134  if (viewport.width >= 768) {
135  jQuery('.comment img[data-gravatar]').each(function(){
136    jQuery(this).attr('src',jQuery(this).attr('data-gravatar'));
137  });
138	}
139} // end function
140
141
142/*
143 * Put all your regular jQuery in here.
144*/
145jQuery(document).ready(function($) {
146
147  /*
148   * Let's fire off the gravatar function
149   * You can remove this if you don't need it
150  */
151  loadGravatars();
152
153
154}); /* end of as page load scripts */