WordPress.org

Make WordPress Core

Ticket #25439: 25439.1.diff

File 25439.1.diff, 3.6 KB (added by westonruter, 5 years ago)

Relay saved and change events to parent. Keep track of customizer iframe dirty state. Add beforeunload AYS for navigating away from page with customize-loader. Commits: https://github.com/x-team/wordpress-develop/compare/82349c18f8a0b13a4cefba031d6da61e6205189a...f21097b40e32ee03c60f676f3e8d973151cb52e0 Amended PR: https://github.com/x-team/wordpress-develop/pull/23

  • src/wp-admin/js/customize-controls.js

    diff --git src/wp-admin/js/customize-controls.js src/wp-admin/js/customize-controls.js
    index 4bfc252..a7a6655 100644
     
    11281128                        });
    11291129                });
    11301130
     1131                // Prompt user with AYS dialog if leaving the Customizer with unsaved changes
     1132                $( window ).on( 'beforeunload', function () {
     1133                        if ( ! api.state( 'saved' )() ) {
     1134                                return api.l10n.saveAlert;
     1135                        }
     1136                } );
     1137
    11311138                // Pass events through to the parent.
    1132                 api.bind( 'saved', function() {
    1133                         parent.send( 'saved' );
    1134                 });
     1139                $.each( [ 'saved', 'change' ], function ( i, event ) {
     1140                        api.bind( event, function() {
     1141                                parent.send( event );
     1142                        });
     1143                } );
    11351144
    11361145                // When activated, let the loader handle redirecting the page.
    11371146                // If no loader exists, redirect the page ourselves (if a url exists).
  • src/wp-includes/js/customize-loader.js

    diff --git src/wp-includes/js/customize-loader.js src/wp-includes/js/customize-loader.js
    index cccf71a..b99351d 100644
    window.wp = window.wp || {}; 
    6363                                Loader.close();
    6464                },
    6565
     66                beforeunload: function () {
     67                        if ( ! Loader.saved() ) {
     68                                return Loader.settings.l10n.saveAlert;
     69                        }
     70                },
     71
    6672                open: function( src ) {
    6773                        var hash;
    6874
    6975                        if ( this.active )
    7076                                return;
    7177
     78                        this.saved = new api.Value( true );
     79
    7280                        // Load the full page on mobile devices.
    7381                        if ( Loader.settings.browser.mobile )
    7482                                return window.location = src;
    window.wp = window.wp || {}; 
    100108                                        Loader.close();
    101109                        });
    102110
     111                        // Prompt AYS dialog when navigating away
     112                        $( window ).on( 'beforeunload', this.beforeunload );
     113
    103114                        this.messenger.bind( 'activated', function( location ) {
    104115                                if ( location )
    105116                                        window.location = location;
    106117                        });
    107118
     119                        this.messenger.bind( 'saved', function () {
     120                                Loader.saved( true );
     121                        } );
     122                        this.messenger.bind( 'change', function () {
     123                                Loader.saved( false );
     124                        } );
     125
    108126                        hash = src.split('?')[1];
    109127
    110128                        // Ensure we don't call pushState if the user hit the forward button.
    window.wp = window.wp || {}; 
    137155                        Loader.messenger.destroy();
    138156                        Loader.iframe    = null;
    139157                        Loader.messenger = null;
     158                        Loader.saved     = null;
    140159                        Loader.body.removeClass( 'customize-active full-overlay-active' ).removeClass( 'customize-loading' );
     160                        $( window ).off( 'beforeunload', Loader.beforeunload );
    141161                },
    142162
    143163                loaded: function() {
  • src/wp-includes/script-loader.php

    diff --git src/wp-includes/script-loader.php src/wp-includes/script-loader.php
    index df42718..c0d42b6 100644
    function wp_default_scripts( &$scripts ) { 
    381381        did_action( 'init' ) && $scripts->localize( 'customize-controls', '_wpCustomizeControlsL10n', array(
    382382                'activate'  => __( 'Save & Activate' ),
    383383                'save'      => __( 'Save & Publish' ),
     384                'saveAlert' => __( 'The changes you made will be lost if you navigate away from this page.' ),
    384385                'saved'     => __( 'Saved' ),
    385386                'cancel'    => __( 'Cancel' ),
    386387                'close'     => __( 'Close' ),
  • src/wp-includes/theme.php

    diff --git src/wp-includes/theme.php src/wp-includes/theme.php
    index 40acf6b..d882463 100644
    function _wp_customize_loader_settings() { 
    18741874                'url'           => esc_url( admin_url( 'customize.php' ) ),
    18751875                'isCrossDomain' => $cross_domain,
    18761876                'browser'       => $browser,
     1877                'l10n'          => array(
     1878                        'saveAlert' => __( 'The changes you made will be lost if you navigate away from this page.' ),
     1879                ),
    18771880        );
    18781881
    18791882        $script = 'var _wpCustomizeLoaderSettings = ' . json_encode( $settings ) . ';';