wp-includes/js/wp-a11y.js

   1 window.wp = window.wp || {};
   2
   3 ( function ( wp, $ ) {
   4         'use strict';
   5
   6         var $containerPolite,
   7                 $containerAssertive,
   8                 role;
   9
  10         /**
  11          * Update the ARIA live notification area text node.
  12          *
  13          * @since 4.2.0
  14          * @since 4.3.0 Introduced the 'ariaLive' argument.
  15          *
  16          * @param {String} message  The message to be announced by Assistive Technologies.
  17          * @param {String} ariaLive Optional. The politeness level for aria-live. Possible values:
  18          *                          polite or assertive. Default polite.
  19          */
  20         function speak( message, ariaLive ) {
  21                 // Clear previous messages to allow repeated strings being read out.
  22                 clear();
  23
  24                 if ( $containerAssertive && 'assertive' === ariaLive ) {
  25                         $containerAssertive.text( message );
  26                 } else if ( $containerPolite ) {
  27                         $containerPolite.text( message );
  28                 }
  29         }
  30
  31         /**
  32          * Build the live regions markup.
  33          *
  34          * @since 4.3.0
  35          *
  36          * @param {String} ariaLive Optional. Value for the 'aria-live' attribute, default 'polite'.
  37          *
  38          * @return {Object} $container The ARIA live region jQuery object.
  39          */
  40         function addContainer( ariaLive ) {
  41                 ariaLive = ariaLive || 'polite';
  42                 role = 'assertive' === ariaLive ? 'alert' : 'status';
  43
  44                 var $container = $( '<div>', {
  45                         'id': 'wp-a11y-speak-' + ariaLive,
  46                         'role': role,
  47                         'aria-live': ariaLive,
  48                         'aria-relevant': 'additions text',
  49                         'aria-atomic': 'true',
  50                         'class': 'screen-reader-text wp-a11y-speak-region'
  51                 });
  52
  53                 $( document.body ).append( $container );
  54                 return $container;
  55         }
  56
  57         /**
  58          * Clear the live regions.
  59          *
  60          * @since 4.3.0
  61          */
  62         function clear() {
  63                 $( '.wp-a11y-speak-region' ).text( '' );
  64         }
  65
  66         /**
  67          * Initialize wp.a11y and define ARIA live notification area.
  68          *
  69          * @since 4.2.0
  70          * @since 4.3.0 Added the assertive live region.
  71          */
  72         $( document ).ready( function() {
  73                 $containerPolite = $( '#wp-a11y-speak-polite' );
  74                 $containerAssertive = $( '#wp-a11y-speak-assertive' );
  75
  76                 if ( ! $containerPolite.length ) {
  77                         $containerPolite = addContainer( 'polite' );
  78                 }
  79
  80                 if ( ! $containerAssertive.length ) {
  81                         $containerAssertive = addContainer( 'assertive' );
  82                 }
  83         });
  84
  85         wp.a11y = wp.a11y || {};
  86         wp.a11y.speak = speak;
  87
  88 }( window.wp, window.jQuery ));