Changeset 39237

Timestamp:

11/15/2016 03:46:14 AM (7 years ago)

Author:

westonruter

Message:

Customize: Only show video header controls if previewing front page; show explanatory notice when controls are hidden.

Also include todo for the header_video control's button_labels. See #38796.

Props westonruter, joemcgill, celloexpressions.
Fixes #38778.

Location:

trunk/src

Files:

• wp-admin/js/customize-controls.js (modified) (1 diff)
• wp-includes/class-wp-customize-manager.php (modified) (4 diffs)

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

@@ -5285 +5285 @@
         } );
 
+        // Toggle visibility of Header Video notice when active state change.
+        api.control( 'header_video', function( headerVideoControl ) {
+            headerVideoControl.deferred.embedded.done( function() {
+                var toggleNotice = function() {
+                    var section = api.section( headerVideoControl.section() ), notice;
+                    if ( ! section ) {
+                        return;
+                    }
+                    notice = section.container.find( '.header-video-not-currently-previewable:first' );
+                    if ( headerVideoControl.active.get() ) {
+                        notice.stop().slideUp( 'fast' );
+                    } else {
+                        notice.stop().slideDown( 'fast' );
+                    }
+                };
+                toggleNotice();
+                headerVideoControl.active.bind( toggleNotice );
+            } );
+        } );
+
         // Update the setting validities.
         api.previewer.bind( 'selective-refresh-setting-validities', function handleSelectiveRefreshedSettingValidities( settingValidities ) {

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

@@ -3408 +3408 @@
         if ( current_theme_supports( 'custom-header', 'video' ) ) {
             $title = __( 'Header Media' );
-            $description = __( 'If you add a video, the image will be used as a fallback while the video loads.' );
+            $description = '<p>' . __( 'If you add a video, the image will be used as a fallback while the video loads.' ) . '</p>';
+
+            // @todo Customizer sections should support having notifications just like controls do. See <https://core.trac.wordpress.org/ticket/38794>.
+            $description .= '<div class="customize-control-notifications-container header-video-not-currently-previewable" style="display: none"><ul>';
+            $description .= '<li class="notice notice-info">' . __( 'This theme doesn\'t support video headers on this page. Navigate to the front page or another page that supports video headers.' ) . '</li>';
+            $description .= '</ul></div>';
             $width = absint( get_theme_support( 'custom-header', 'width' ) );
             $height = absint( get_theme_support( 'custom-header', 'height' ) );
@@ -3479 +3484 @@
             'section'        => 'header_image',
             'mime_type'      => 'video',
+            // @todo These button_labels can be removed once WP_Customize_Media_Control provides mime_type-specific labels automatically. See <https://core.trac.wordpress.org/ticket/38796>.
             'button_labels'  => array(
                 'select'       => __( 'Select Video' ),
@@ -3485 +3491 @@
                 'frame_title'  => __( 'Select Video' ),
                 'frame_button' => __( 'Choose Video' ),
-            )
+            ),
+            'active_callback' => 'is_front_page',
         ) ) );
 
@@ -3493 +3500 @@
             'description'    => __( 'Or, enter a YouTube URL:' ),
             'section'        => 'header_image',
+            'active_callback'=> 'is_front_page',
         ) );