diff options
Diffstat (limited to 'plugins/jetpack/modules/widgets/customizer-utils.js')
-rw-r--r-- | plugins/jetpack/modules/widgets/customizer-utils.js | 119 |
1 files changed, 119 insertions, 0 deletions
diff --git a/plugins/jetpack/modules/widgets/customizer-utils.js b/plugins/jetpack/modules/widgets/customizer-utils.js new file mode 100644 index 00000000..754b6339 --- /dev/null +++ b/plugins/jetpack/modules/widgets/customizer-utils.js @@ -0,0 +1,119 @@ +/* global wp, gapi, FB, twttr, PaypalExpressCheckout */ + +/** + * Utilities to work with widgets in Customizer. + */ + +/** + * Checks whether this Customizer supports partial widget refresh. + * @returns {boolean} + */ +wp.customizerHasPartialWidgetRefresh = function() { + return ( + 'object' === typeof wp && + 'function' === typeof wp.customize && + 'object' === typeof wp.customize.selectiveRefresh && + 'object' === typeof wp.customize.widgetsPreview && + 'function' === typeof wp.customize.widgetsPreview.WidgetPartial + ); +}; + +/** + * Verifies that the placed widget ID contains the widget name. + * @param {object} placement + * @param {string} widgetName + * @returns {*|boolean} + */ +wp.isJetpackWidgetPlaced = function( placement, widgetName ) { + return placement.partial.widgetId && 0 === placement.partial.widgetId.indexOf( widgetName ); +}; + +/** + * Bind events for selective refresh in Customizer. + */ +( function( $ ) { + $( document ).ready( function() { + if ( wp && wp.customize && wp.customizerHasPartialWidgetRefresh() ) { + // Refresh widget contents when a partial is rendered. + wp.customize.selectiveRefresh.bind( 'partial-content-rendered', function( placement ) { + if ( placement.container ) { + // Refresh Google+ + if ( + wp.isJetpackWidgetPlaced( placement, 'googleplus-badge' ) && + 'object' === typeof gapi && + gapi.person && + 'function' === typeof gapi.person.go + ) { + gapi.person.go( placement.container[ 0 ] ); + } + + // Refresh Facebook XFBML + else if ( + wp.isJetpackWidgetPlaced( placement, 'facebook-likebox' ) && + 'object' === typeof FB && + 'object' === typeof FB.XFBML && + 'function' === typeof FB.XFBML.parse + ) { + FB.XFBML.parse( placement.container[ 0 ], function() { + var $fbContainer = $( placement.container[ 0 ] ).find( '.fb_iframe_widget' ), + fbWidth = $fbContainer.data( 'width' ), + fbHeight = $fbContainer.data( 'height' ); + $fbContainer.find( 'span' ).css( { width: fbWidth, height: fbHeight } ); + setTimeout( function() { + $fbContainer + .find( 'iframe' ) + .css( { width: fbWidth, height: fbHeight, position: 'relative' } ); + }, 1 ); + } ); + } + + // Refresh Twitter + else if ( + wp.isJetpackWidgetPlaced( placement, 'twitter_timeline' ) && + 'object' === typeof twttr && + 'object' === typeof twttr.widgets && + 'function' === typeof twttr.widgets.load + ) { + twttr.widgets.load( placement.container[ 0 ] ); + } else if ( wp.isJetpackWidgetPlaced( placement, 'eu_cookie_law_widget' ) ) { + // Refresh EU Cookie Law + if ( $( '#eu-cookie-law' ).hasClass( 'top' ) ) { + $( '.widget_eu_cookie_law_widget' ).addClass( 'top' ); + } else { + $( '.widget_eu_cookie_law_widget' ).removeClass( 'top' ); + } + placement.container.fadeIn(); + } else if ( wp.isJetpackWidgetPlaced( placement, 'jetpack_simple_payments_widget' ) ) { + // Refresh Simple Payments Widget + try { + var buttonId = $( '.jetpack-simple-payments-button', placement.container ) + .attr( 'id' ) + .replace( '_button', '' ); + PaypalExpressCheckout.renderButton( null, null, buttonId, null ); + } catch ( e ) { + // PaypalExpressCheckout may fail. + // For the same usage, see also: + // https://github.com/Automattic/jetpack/blob/6c1971e6bed7d3df793392a7a58ffe0afaeeb5fe/modules/simple-payments/simple-payments.php#L111 + } + } + } + } ); + + // Refresh widgets when they're moved. + wp.customize.selectiveRefresh.bind( 'partial-content-moved', function( placement ) { + if ( placement.container ) { + // Refresh Twitter timeline iframe, since it has to be re-built. + if ( + wp.isJetpackWidgetPlaced( placement, 'twitter_timeline' ) && + placement.container.find( 'iframe.twitter-timeline:not([src]):first' ).length + ) { + placement.partial.refresh(); + } else if ( wp.isJetpackWidgetPlaced( placement, 'jetpack_simple_payments_widget' ) ) { + // Refresh Simple Payments Widget + placement.partial.refresh(); + } + } + } ); + } + } ); +} )( jQuery ); |