Themes: Remove jQuery dependency from wp-custom-header.js.

In [38985], we used jQuery to trigger a custom event once a video
handler has completed so themes, like Twenty Fourteen, can execute
their own adjustments after the header video has loaded.

This replaces the jQuery `trigger()` method with a native event and
updates Twenty Fourteen accordingly.

Props adamsilverstein, joemcgill.
Fixes #38550.
Built from https://develop.svn.wordpress.org/trunk@39102


git-svn-id: http://core.svn.wordpress.org/trunk@39044 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Joe McGill 2016-11-03 01:21:28 +00:00
parent 94ab2f9b16
commit 89a70eb859
4 changed files with 17 additions and 11 deletions

View File

@ -105,11 +105,6 @@
if ( body.is( '.header-image' ) ) {
// Recaculate the header height when a custom header loads.
$( 'body' ).on( 'wp-custom-header-video-loaded', function() {
mastheadOffset = $( '#site-header' ).height();
} );
_window.on( 'scroll.twentyfourteen', function() {
if ( _window.scrollTop() > mastheadOffset && mastheadHeight < 49 ) {
body.addClass( 'masthead-fixed' );
@ -118,6 +113,12 @@
}
} );
// Update masthead offset once a custom header video loads.
$( document ).on( 'wp-custom-header-video-loaded', function() {
mastheadOffset = $( '#site-header' ).height();
} );
// Update masthead offset after a selective refresh.
if ( 'undefined' !== typeof wp && wp.customize && wp.customize.selectiveRefresh ) {
wp.customize.selectiveRefresh.bind( 'partial-content-rendered', function() {

View File

@ -1,4 +1,4 @@
(function( window, $, settings ) {
(function( window, settings ) {
if ( ! ( 'addEventListener' in window ) ) {
// Fail gracefully in unsupported browsers.
@ -31,11 +31,16 @@
if ( handlers.hasOwnProperty( id ) && handler.test( settings ) ) {
handler.callback( settings );
// Set up and dispatch custom event when the video is loaded.
if ( 'dispatchEvent' in window ) {
var videoLoaded = new Event( 'wp-custom-header-video-loaded' );
document.dispatchEvent( videoLoaded );
}
break;
}
}
$( 'body' ).trigger( 'wp-custom-header-video-loaded' );
}
}
@ -151,4 +156,4 @@
});
}
})( window, jQuery, window._wpCustomHeaderSettings || {} );
})( window, window._wpCustomHeaderSettings || {} );

View File

@ -1 +1 @@
!function(a,b,c){function d(){function d(){if(c.container=document.getElementById("wp-custom-header"),g()){for(var a in h){var d=h[a];if(h.hasOwnProperty(a)&&d.test(c)){d.callback(c);break}}b("body").trigger("wp-custom-header-video-loaded")}}function g(){return!(a.innerWidth<c.minWidth||a.innerHeight<c.minHeight)}var h={nativeVideo:{test:function(a){var b=document.createElement("video");return b.canPlayType(a.mimeType)},callback:e},youtube:{test:function(a){return"video/x-youtube"===a.mimeType},callback:f}};return{handlers:h,initialize:d,supportsVideo:g}}function e(a){var b=document.createElement("video");b.id="wp-custom-header-video",b.autoplay="autoplay",b.loop="loop",b.muted="muted",b.width=a.width,b.height=a.height,b.addEventListener("click",function(){b.paused?b.play():b.pause()}),a.container.innerHTML="",a.container.appendChild(b),b.src=a.videoUrl}function f(b){function c(){var c=a.YT||{};c.ready(function(){var a=document.createElement("div");a.id="wp-custom-header-video",b.container.innerHTML="",b.container.appendChild(a),new c.Player(a,{height:b.height,width:b.width,videoId:e,events:{onReady:function(a){a.target.mute()},onStateChange:function(a){c.PlayerState.ENDED===a.data&&a.target.playVideo()}},playerVars:{autoplay:1,controls:0,disablekb:1,fs:0,iv_load_policy:3,loop:1,modestbranding:1,playsinline:1,rel:0,showinfo:0}})})}var d=/^.*(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|\&v(?:i)?=))([^#\&\?]*).*/,e=b.videoUrl.match(d)[1];if("YT"in a)c();else{var f=document.createElement("script");f.src="https://www.youtube.com/player_api",f.onload=function(){c()},document.getElementsByTagName("head")[0].appendChild(f)}}"addEventListener"in a&&(a.wp=a.wp||{},a.wp.customHeader=new d,document.addEventListener("DOMContentLoaded",a.wp.customHeader.initialize,!1),"customize"in a.wp&&(wp.customize.selectiveRefresh.bind("render-partials-response",function(a){"custom_header_settings"in a&&(c=a.custom_header_settings)}),wp.customize.selectiveRefresh.bind("partial-content-rendered",function(b){"custom_header"===b.partial.id&&a.wp.customHeader.initialize()})))}(window,jQuery,window._wpCustomHeaderSettings||{});
!function(a,b){function c(){function c(){if(b.container=document.getElementById("wp-custom-header"),f())for(var c in g){var d=g[c];if(g.hasOwnProperty(c)&&d.test(b)){if(d.callback(b),"dispatchEvent"in a){var e=new Event("wp-custom-header-video-loaded");document.dispatchEvent(e)}break}}}function f(){return!(a.innerWidth<b.minWidth||a.innerHeight<b.minHeight)}var g={nativeVideo:{test:function(a){var b=document.createElement("video");return b.canPlayType(a.mimeType)},callback:d},youtube:{test:function(a){return"video/x-youtube"===a.mimeType},callback:e}};return{handlers:g,initialize:c,supportsVideo:f}}function d(a){var b=document.createElement("video");b.id="wp-custom-header-video",b.autoplay="autoplay",b.loop="loop",b.muted="muted",b.width=a.width,b.height=a.height,b.addEventListener("click",function(){b.paused?b.play():b.pause()}),a.container.innerHTML="",a.container.appendChild(b),b.src=a.videoUrl}function e(b){function c(){var c=a.YT||{};c.ready(function(){var a=document.createElement("div");a.id="wp-custom-header-video",b.container.innerHTML="",b.container.appendChild(a),new c.Player(a,{height:b.height,width:b.width,videoId:e,events:{onReady:function(a){a.target.mute()},onStateChange:function(a){c.PlayerState.ENDED===a.data&&a.target.playVideo()}},playerVars:{autoplay:1,controls:0,disablekb:1,fs:0,iv_load_policy:3,loop:1,modestbranding:1,playsinline:1,rel:0,showinfo:0}})})}var d=/^.*(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|\&v(?:i)?=))([^#\&\?]*).*/,e=b.videoUrl.match(d)[1];if("YT"in a)c();else{var f=document.createElement("script");f.src="https://www.youtube.com/player_api",f.onload=function(){c()},document.getElementsByTagName("head")[0].appendChild(f)}}"addEventListener"in a&&(a.wp=a.wp||{},a.wp.customHeader=new c,document.addEventListener("DOMContentLoaded",a.wp.customHeader.initialize,!1),"customize"in a.wp&&(wp.customize.selectiveRefresh.bind("render-partials-response",function(a){"custom_header_settings"in a&&(b=a.custom_header_settings)}),wp.customize.selectiveRefresh.bind("partial-content-rendered",function(b){"custom_header"===b.partial.id&&a.wp.customHeader.initialize()})))}(window,window._wpCustomHeaderSettings||{});

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.7-beta1-39101';
$wp_version = '4.7-beta1-39102';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.