Remove all references to equalHeights as this is now a plugin

This commit is contained in:
Braad Martin
2015-02-16 12:24:34 -08:00
parent e9cf7c26f5
commit aa1fb81226
-196
View File
@@ -9,10 +9,6 @@
// Executes when the document is ready
jQuery( document ).ready( function( $ ) {
// Get PHP vars passed via wp_localize_script()
trestleEqualColsBreakpoint = trestle_vars.trestle_equal_cols_breakpoint;
trestleEqualHeightCols = trestle_vars.trestle_equal_height_cols;
// Remove .no-jquery body class
$( 'body' ).removeClass( 'no-jquery' );
@@ -139,198 +135,6 @@ jQuery( document ).ready( function( $ ) {
// Executes when complete page is fully loaded, including all frames, objects, and images
$( window ).on( 'load', function() {
// Equal height homepage cols
$( '.equal-height-genesis-extender-cols .ez-home-container-area' ).each( function() {
$( this ).children( '.widget-area' ).equalHeights( null, null, trestleEqualColsBreakpoint );
});
});
}); /* end of page load scripts */
/**
* Equal Heights Plugin
*
* Equalize the heights of elements. Great for columns or any elements
* that need to be the same height (floats, etc).
*
* Based on Rob Glazebrook's (cssnewbie.com) script
*
* Features
* - ability to include a break point (the minimum viewport width at which the script does anything)
* - binds to window resize events (resize and orientationchange)
* - will automatically detect new elements added to the DOM
* - can be called multiple times without duplicating any events
*
* Usage: jQuery( object ).equalHeights( [minHeight], [maxHeight], [breakPoint] );
*
* Example 1: jQuery( ".cols" ).equalHeights(); Sets all .cols to the same height.
* Example 2: jQuery( ".cols" ).equalHeights( 400 ); Sets all .cols to at least 400px tall.
* Example 3: jQuery( ".cols" ).equalHeights( 100, 300 ); Cols are at least 100 but no more
* than 300 pixels tall. Elements with too much content will gain a scrollbar.
* Example 4: jQuery( ".cols" ).equalHeights( null, null, 768 ); Only resize .cols above 768px viewport
*/
( function( $ ) {
// debouncing function from John Hann
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
var debounce = function( func, threshold ) {
// The timer
var timeout;
return function debounced() {
// Store the passed in function and args
var obj = this;
var args = arguments;
// This is the callback that the timer triggers when debouncing is complete
function delayed() {
// We have successfully debounced, trigger the function
func.apply( obj, args );
// And clear the timer
timeout = null;
}
// If the timer is active, clear it
if ( timeout ) {
clearTimeout( timeout );
}
// Set the timer to 100ms and have it call delayed() when it completes
timeout = setTimeout( delayed, threshold || 50 );
};
};
// Main plugin function
$.fn.equalHeights = function( minHeight, maxHeight, breakPoint ) {
// Scope our variables
var selector, minHeight, maxHeight, breakPoint, eventData,
ourEvents, eventName, eventSet;
// Get the selector used to call equalHeights
selector = this.selector;
// Use the args that were passed in or use the defaults
minHeight = minHeight || null;
maxHeight = maxHeight || null;
breakPoint = breakPoint || 0;
// Combine args into an object
args = { minHeight: minHeight, maxHeight: maxHeight, breakPoint: breakPoint };
// Check if our global already exists
if ( window.equalHeightsItems ) {
// It does, so add or overwrite the current object in it
window.equalHeightsItems[selector] = args;
} else {
// It doesn't, so create the global and store the current object in it
window.equalHeightsItems = {};
window.equalHeightsItems[selector] = args;
}
// Grab the current event data from the window object
eventData = $( window ).data( 'events' );
// Store the events that will retrigger doEqualHeights()
ourEvents = [ 'resize', 'orientationchange', 'equalheights' ];
// Loop through each event and attach our handler if it isn't attached already
$( ourEvents ).each( function() {
// Reset our flag to false
eventSet = false;
// Store this event
thisEvent = this;
// Add the namespace
eventName = this + '.equalheights';
// Check whether this event is already on the window
if ( eventData[ thisEvent ] ) {
// Be careful not to disturb any unrelated listeners
$( eventData[ thisEvent ] ).each( function() {
// Confirm that the event has our namespace
if ( this.namespace == 'equalheights' ) {
// It does, so set our flag to true
eventSet = true;
}
});
}
// If our flag is still false then we can safely attach the event
if ( ! eventSet ) {
// Namespace it and debounce it to be safe
$( window ).on( eventName, debounce( triggerEqualHeights ) );
}
});
// Trigger the first equalizing
triggerEqualHeights();
};
// Function to trigger the equalizing
function triggerEqualHeights() {
// Loop through each object in our global
$.each( window.equalHeightsItems, function( selector, args ) {
// Call doEqualHeights and pass in the current object
doEqualHeights( selector, args );
});
}
// Function to do the equalizing of the heights
function doEqualHeights( selector, args ) {
// Scope our variables
var $items, minHeight, maxHeight, breakPoint, tallest, e, a, width;
// Grab the collection of items fresh from the DOM
$items = $( selector );
// Store the passed in args
minHeight = args.minHeight;
maxHeight = args.maxHeight;
breakPoint = args.breakPoint;
// Calculate the tallest item
tallest = ( minHeight ) ? minHeight : 0;
$items.each( function() {
$( this ).height( 'auto' );
if( $( this ).outerHeight() > tallest ) {
tallest = $( this ).outerHeight();
}
});
// Get viewport width (taking scrollbars into account)
e = window;
a = 'inner';
if ( !( 'innerWidth' in window ) ) {
a = 'client';
e = document.documentElement || document.body;
}
width = e[ a+'Width' ];
// Equalize heights if viewport width is above the breakpoint
if ( width >= breakPoint ) {
if ( ( maxHeight ) && tallest > maxHeight ) {
tallest = maxHeight;
}
return $items.each( function() {
$( this ).height( tallest );
});
}
}
})( jQuery );