Themes: Improve a11y and extendability of custom video headers.

This adds play/pause controls to video headers, along with voice
assistance, using `wp.a11y.speak`, to make custom video headers more
accessible. To make styling the play/pause button easier for themes,
CSS has been omitted from the default implementation.

This also includes a refactor of the `wp.customHeader` code to introduce
a `BaseHandler` class, which can be extended by plugins and themes to modify
or enhance the default video handlers.

Props davidakennedy, afercia, bradyvercher, joemcgill, adamsilverstein, rianrietveld.
Fixes #38678.

git-svn-id: https://develop.svn.wordpress.org/trunk@39272 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Joe McGill
2016-11-16 23:25:28 +00:00
parent ac9a74eff5
commit b5563ef917
4 changed files with 414 additions and 117 deletions

View File

@@ -1381,6 +1381,12 @@ function get_header_video_settings() {
'height' => absint( $header->height ),
'minWidth' => 900,
'minHeight' => 500,
'l10n' => array(
'pause' => __( 'Pause' ),
'play' => __( 'Play' ),
'pauseSpeak' => __( 'Video is paused.'),
'playSpeak' => __( 'Video is playing.'),
),
);
if ( preg_match( '#^https?://(?:www\.)?(?:youtube\.com/watch|youtu\.be/)#', $video_url ) ) {