Bez popisu

customize-controls.js 1.7KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. /**
  2. * Binds iframe messages from the Customizer to SearchApp.
  3. *
  4. * @param {boolean} expanded - whether jetpack_search section is expanded and visible.
  5. */
  6. function postSectionMessage( expanded ) {
  7. // window.wp.customize.previewer.preview is not available until both customize and customize.previewer are ready.
  8. window.wp.customize.previewer.preview
  9. .targetWindow()
  10. .postMessage( { key: 'jetpackSearchSectionOpen', expanded: expanded }, '*' ); // Assume ES5 envorinment.
  11. }
  12. /**
  13. * Adds functionality for Jetpack Search section detection in the Customizer.
  14. */
  15. function init() {
  16. window.wp.customize.bind( 'ready', function () {
  17. // window.wp.customize.previewer will emit 'ready' multiple times, not just during initialization.
  18. window.wp.customize.previewer.bind( 'ready', function () {
  19. // window.wp.customize.previewer.loading is deinstanced after initial load.
  20. window.wp.customize.previewer.loading &&
  21. window.wp.customize.previewer.loading.done( function () {
  22. postSectionMessage( window.wp.customize.section( 'jetpack_search' ).expanded() );
  23. } );
  24. // If the Jetpack Search section is opened/closed, emit a message to open/close the modal.
  25. window.wp.customize.section( 'jetpack_search' ).expanded.bind( function () {
  26. postSectionMessage( window.wp.customize.section( 'jetpack_search' ).expanded() );
  27. } );
  28. // If Customizer values have changed while Jetpack Search section is open, emit a message to open the modal.
  29. window.wp.customize.bind( 'change', function () {
  30. window.wp.customize.section( 'jetpack_search' ).expanded() && postSectionMessage( true );
  31. } );
  32. } );
  33. } );
  34. }
  35. if ( document.readyState !== 'loading' ) {
  36. init();
  37. } else {
  38. document.addEventListener( 'DOMContentLoaded', init );
  39. }