10h30/trestle
1
0
Fork 0
mirror of https://github.com/10h30/trestle.git synced 2026-07-19 06:33:42 +09:00
Code Issues Packages Projects Releases Wiki Activity

Added equal heights col functionality. Adde lots of CSS for sidebar button/form/input/Gravity Forms - may need more testing.

Browse Source
This commit is contained in:
MickeyKay
2014-03-31 12:58:03 -07:00
parent 2c7826ccd5
commit a745d99224
5 changed files with 381 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/admin/admin-functions.php
+14 -2
View File
@@ -41,6 +41,8 @@ function trestle_custom_defaults( $defaults ) {
'trestle_nav_button_text' => '[icon name="icon-list-ul"] ' . __( 'Navigation', 'trestle' ),
'trestle_read_more_text' => __( 'Read More »', 'trestle' ),
'trestle_revisions_number' => 3,
'trestle_equal_height_cols' => 1,
'trestle_equal_cols_breakpoint' => 768,
);
// Populate Trestle settings with default values if they don't yet exist
@@ -75,16 +77,18 @@ function trestle_register_social_sanitization_filters() {
'trestle_auto_nav',
'trestle_include_home_link',
'trestle_link_icons',
'trestle_equal_height_cols',
)
);
// Integer
genesis_add_option_filter(
'int',
'absint',
GENESIS_SETTINGS_FIELD,
array(
'footer-widgets-number',
'trestle_revisions_number',
'trestle_equal_cols_breakpoint',
)
);
@@ -169,7 +173,7 @@ function trestle_settings_box() {
<h4><?php _e( 'Blog/Posts', 'trestle' ) ?></h4>
<p>
<label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]"><?php _e( 'Custom read more link text', 'trestle' ); ?></label>: <input type="text" id="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]" name="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]" value="<?php echo esc_attr( genesis_get_option( 'trestle_read_more_text' ) ); ?>" /> <label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]">
<label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]"><?php _e( 'Custom read more link text', 'trestle' ); ?></label>: <input type="text" id="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]" name="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_read_more_text]" value="<?php echo esc_attr( genesis_get_option( 'trestle_read_more_text' ) ); ?>" />
</p>
<p>
<label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_revisions_number]"><?php _e( 'Number of post revisions', 'trestle' ) ?>: </label>
@@ -240,6 +244,14 @@ function trestle_settings_box() {
</select>
</p>
<h4><?php _e( 'Genesis Extender Plugin', 'trestle' ) ?></h4>
<p>
<input type="checkbox" id="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_height_cols]" name="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_height_cols]" value="1" <?php checked( esc_attr( genesis_get_option( 'trestle_equal_height_cols' ) ), 1); ?> /> <label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_height_cols]"><?php _e( 'Automatically equalize height of Genesis Extender homepage columns', 'trestle' ); ?></label>
</p>
<p class="trestle-equal-columns-breakpoint">
<label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_cols_breakpoint]"><?php _e( 'Implement at', 'trestle' ); ?></label> <input type="text" id="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_cols_breakpoint]" name="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_equal_cols_breakpoint]" value="<?php echo esc_attr( genesis_get_option( 'trestle_equal_cols_breakpoint' ) ); ?>" size="4"/>px&nbsp;<?php _e( 'and wider (should match main CSS breakpoint)', 'trestle' ); ?>
</p>
<h4><?php _e( 'Link Icons', 'trestle' ) ?></h4>
<p>
<input type="checkbox" id="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_external_link_icons]" name="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_external_link_icons]" value="1" <?php checked( esc_attr( genesis_get_option( 'trestle_external_link_icons' ) ), 1); ?> /> <label for="<?php echo GENESIS_SETTINGS_FIELD; ?>[trestle_external_link_icons]"><?php _e( 'Add icons to external links', 'trestle' ); ?></label><br />
lib/admin/admin.js
+9
View File
@@ -28,4 +28,13 @@ jQuery(document).ready(function() {
jQuery('.trestle-post-info-meta').slideToggle();
});
// Add drop-down functionality for equal height breakpoint
if( ! jQuery('#genesis-settings\\[trestle_equal_height_cols\\]').is(':checked') ) {
jQuery('.trestle-equal-columns-breakpoint').hide();
}
jQuery('#genesis-settings\\[trestle_equal_height_cols\\]').change(function() {
jQuery('.trestle-equal-columns-breakpoint').slideToggle();
});
}); /* end of as page load scripts */
lib/functions/theme-functions.php
+10
View File
@@ -30,6 +30,12 @@ function trestle_header_actions() {
// Custom jQuery (if desired)
wp_enqueue_script( 'trestle-custom-jquery', '/wp-content/uploads/custom.js', array( 'jquery' ), '1.0.0', true );
// Pass PHP variables to theme jQuery
$php_vars = array (
'trestle_equal_cols_breakpoint' => genesis_get_option( 'trestle_equal_cols_breakpoint' ),
);
wp_localize_script( 'trestle-custom-jquery', 'php_vars', $php_vars );
}
@@ -312,6 +318,10 @@ function trestle_body_classes( $classes ) {
// Add footer widget number class
if ( genesis_get_option( 'trestle_footer_widgets_number' ) )
$classes[] = 'footer-widgets-number-' . esc_attr( genesis_get_option( 'trestle_footer_widgets_number' ) );
// Add class for equal height Genesis Extender columns
if ( 1 == genesis_get_option( 'trestle_equal_height_cols' ) )
$classes[] = 'equal-height-genesis-extender-cols';
return $classes;
}
lib/js/theme-jquery.js
+71 -2
View File
@@ -8,7 +8,11 @@
// Executes when the document is ready
jQuery(document).ready(function() {
// Get PHP vars passed via wp_localize_script()
trestleEqualColsBreakpoint = php_vars.trestle_equal_cols_breakpoint;
trestleEqualHeightCols = php_vars.trestle_equal_height_cols
// Remove .no-jquery body class
jQuery('body').removeClass('no-jquery');
@@ -51,10 +55,75 @@ jQuery(document).ready(function() {
icon.text(closedIcon);
});
// Equal height homepage cols
jQuery('.equal-height-genesis-extender-cols .ez-home-container-area').each(function() {
jQuery(this).children('.widget-area').equalHeights(null,null,trestleEqualColsBreakpoint);
});
}); /* end of as page load scripts */
// Executes when complete page is fully loaded, including all frames, objects, and images
jQuery(window).load(function() {
});
});
/**
* Equal Heights Plugin
*
* Equalize the heights of elements. Great for columns or any elements
* that need to be the same size (floats, etc).
*
* Based on Rob Glazebrook's (cssnewbie.com) script
*
* Additions
* - ability to include a break point (the minimum viewport width at which the script does anything)
* - binds the script to run on load, orientation change (for mobile), and when resizing the window
*
* Usage: jQuery(object).equalHeights([minHeight], [maxHeight], [breakPoint]);
*
* Example 1: jQuery(".cols").equalHeights(); Sets all columns 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 columns above 768px viewport
*
*/
(function(jQuery) {
jQuery.fn.equalHeights = function(minHeight, maxHeight, breakPoint) {
var items = this;
breakPoint = breakPoint || 0;
// Bind functionality to appropriate events
jQuery(window).bind('load orientationchange resize', function() {
tallest = (minHeight) ? minHeight : 0;
items.each(function() {
jQuery(this).height('auto');
if(jQuery(this).height() > tallest) {
tallest = jQuery(this).height();
}
});
// Get viewport width (taking scrollbars into account)
var e = window;
a = 'inner';
if (!('innerWidth' in window )) {
a = 'client';
e = document.documentElement || document.body;
}
width = e[ a+'Width' ];
// Equalize column heights if above the specified breakpoint
if ( width >= breakPoint ) {
if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
console.log(tallest);
return items.each(function() {
jQuery(this).height(tallest);
});
}
});
}
})(jQuery);