laipower/wp-content/plugins/gp-premium/blog/functions/js/customizer.js

77 lines
2.4 KiB
JavaScript
Raw Normal View History

2020-04-07 13:03:04 +00:00
/**
* Theme Customizer enhancements for a better user experience.
*
* Contains handlers to make Theme Customizer preview reload changes asynchronously.
*/
( function( $ ) {
// Container width
wp.customize( 'generate_settings[container_width]', function( value ) {
value.bind( function() {
if ( $( '.masonry-container' )[ 0 ] ) {
jQuery( '.masonry-container' ).imagesLoaded( function() {
$container = jQuery( '.masonry-container' );
if ( jQuery( $container ).length ) {
$container.masonry( {
2020-04-07 13:03:04 +00:00
columnWidth: '.grid-sizer',
itemSelector: '.masonry-post',
stamp: '.page-header',
} );
2020-04-07 13:03:04 +00:00
}
} );
2020-04-07 13:03:04 +00:00
}
} );
} );
$( 'body' ).on( 'generate_spacing_updated', function() {
if ( $( '.masonry-container' )[ 0 ] ) {
jQuery( '.masonry-container' ).imagesLoaded( function() {
$container = jQuery( '.masonry-container' );
if ( jQuery( $container ).length ) {
$container.masonry( {
2020-04-07 13:03:04 +00:00
columnWidth: '.grid-sizer',
itemSelector: '.masonry-post',
stamp: '.page-header',
} );
2020-04-07 13:03:04 +00:00
}
} );
2020-04-07 13:03:04 +00:00
}
} );
2020-04-07 13:03:04 +00:00
/**
* The first infinite scroll load in the Customizer misses article classes if they've been
* added or removed in the previous refresh.
*
* This is totally hacky, but I'm just happy I finally got it working!
*/
var $container = $( '.infinite-scroll-item' ).first().parent();
$container.on( 'load.infiniteScroll', function( event, response ) {
var $posts = $( response ).find( 'article' );
if ( wp.customize.value( 'generate_blog_settings[column_layout]' )() ) {
2020-04-07 13:03:04 +00:00
$posts.addClass( 'generate-columns' );
$posts.addClass( 'grid-parent' );
$posts.addClass( 'grid-' + wp.customize.value( 'generate_blog_settings[columns]' )() );
2020-04-07 13:03:04 +00:00
$posts.addClass( 'tablet-grid-50' );
$posts.addClass( 'mobile-grid-100' );
} else {
$posts.removeClass( 'generate-columns' );
$posts.removeClass( 'grid-parent' );
$posts.removeClass( 'grid-' + wp.customize.value( 'generate_blog_settings[columns]' )() );
2020-04-07 13:03:04 +00:00
$posts.removeClass( 'tablet-grid-50' );
$posts.removeClass( 'mobile-grid-100' );
}
if ( wp.customize.value( 'generate_blog_settings[masonry]' )() ) {
2020-04-07 13:03:04 +00:00
$posts.addClass( 'masonry-post' );
} else {
$posts.removeClass( 'masonry-post' );
}
if ( ! wp.customize.value( 'generate_blog_settings[post_image_padding]' )() ) {
2020-04-07 13:03:04 +00:00
$posts.addClass( 'no-featured-image-padding' );
} else {
$posts.removeClass( 'no-featured-image-padding' );
}
} );
}( jQuery ) );