Ticket #35210: 35210.3.patch

src/wp-admin/css/customize-controls.css

@@ -25 +25 @@
 
 #customize-header-actions .button-primary {
         float: right;
+        position: relative;
+        top: 0;
         margin-top: 9px;
+        margin-right: 15px;
 }
 
 #customize-header-actions .spinner {
         margin-top: 13px;
         margin-right: 4px;
+        position: relative;
+        top: -45px;
 }
 
 .saving #customize-header-actions .spinner {
@@ -39 +44 @@
 
 #customize-header-actions {
         border-bottom: 1px solid #ddd;
+        padding-top: 0;
+}
+
+#customize-header-actions .notice {
+        margin-top: 46px;
+        margin-bottom: 1px;
+}
+
+#customize-header-actions .notice + .notice {
+        margin-top: 0;
 }
 
 #customize-controls .wp-full-overlay-sidebar-content {

src/wp-admin/css/themes.css

@@ -1285 +1285 @@
         left: 0;
         right: 0;
         height: 45px;
-        padding: 0 15px;
+        padding: 0;
         line-height: 45px;
         z-index: 10;
         margin: 0;

src/wp-admin/customize.php

@@ -53 +53 @@
 do_action( 'customize_controls_init' );
 
 wp_enqueue_script( 'customize-controls' );
+wp_enqueue_script( 'common' );
 wp_enqueue_style( 'customize-controls' );
 
 /**

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

@@ -3355 +3355 @@
                                                                 self.save();
                                                                 self.preview.iframe.show();
                                                         } );
+                                                } else if( response && response.error_code != undefined ){
+                                                        // inject the error notification div 
+                                                        var template = wp.template('error-notification');
+                                                        $( '#customize-header-actions' ).append( template( response ) );
+
+                                                        // trigger the event that make notices dismissible
+                                                        $(document).trigger( 'wp-plugin-update-error' );
                                                 }
                                                 api.trigger( 'error', response );
                                         } );

src/wp-includes/class-wp-customize-manager.php

@@ -299 +299 @@
                 add_action( 'customize_controls_print_footer_scripts', array( $this, 'render_panel_templates' ), 1 );
                 add_action( 'customize_controls_print_footer_scripts', array( $this, 'render_section_templates' ), 1 );
                 add_action( 'customize_controls_print_footer_scripts', array( $this, 'render_control_templates' ), 1 );
+                add_action( 'customize_controls_print_footer_scripts', array( $this, 'render_error_notification_templates' ), 1 );
 
                 // Export the settings to JS via the _wpCustomizeSettings variable.
                 add_action( 'customize_controls_print_footer_scripts', array( $this, 'customize_pane_settings' ), 1000 );
@@ -2180 +2181 @@
                                 'type'       => 'dropdown-pages',
                         ) );
                 }
+
+                // This is only for demonstration purpose
+                $this->add_section( 'test-errors', array(
+                        'title'          => __( 'Test error notification' ),
+                        'priority'       => 10,
+                ) );
+                $this->add_setting( 'test_errors_trigger', array(
+                        'type'          => 'option',
+                        'transport'     => 'postMessage',
+                ) );
+                $this->add_control( 'test_errors_trigger', array(
+                        'label'    => __( 'Enter a message to trigger an error' ),
+                        'setting'  => 'test_errors_trigger',
+                        'section'  => 'test-errors',
+                ) );
+
+                add_filter( 'pre_update_option_test_errors_trigger', array( $this, 'send_test_error' ) );
+        }
+
+        public function send_test_error( $value ){
+                // if an error message has been entered, trigger the test error
+                if( trim($value) != '' ){
+                        wp_send_json_error( array(
+                                'error_code' => 'test-error-code',
+                                'error_message' => $value,
+                        ) );
+                }
+                return $value;
         }
 
         /**
@@ -2235 +2264 @@
         public function _render_custom_logo_partial() {
                 return get_custom_logo();
         }
+        
+        public function render_error_notification_templates(){
+                ?><script type="text/html" id="tmpl-error-notification">
+                        <div class="notice is-dismissible error {{ data.error_code }}">
+                                <p>{{ data.error_message }}</p>
+                                <button type="button" class="notice-dismiss">
+                                        <span class="screen-reader-text"><?php _e( 'Dismiss this notice' ); ?>.</span>
+                                </button>
+                        </div>
+                </script><?php
+        }
 }
 
 /**