[Summary view] [Print] [Text view]

   1  /**
   2   * @output wp-includes/js/wp-embed-template.js
   3   */
   4  (function ( window, document ) {
   5      'use strict';
   6  
   7      var supportedBrowser = ( document.querySelector && window.addEventListener ),
   8          loaded = false,
   9          secret,
  10          secretTimeout,
  11          resizing;
  12  
  13  	function sendEmbedMessage( message, value ) {
  14          window.parent.postMessage( {
  15              message: message,
  16              value: value,
  17              secret: secret
  18          }, '*' );
  19      }
  20  
  21  	function onLoad() {
  22          if ( loaded ) {
  23              return;
  24          }
  25          loaded = true;
  26  
  27          var share_dialog = document.querySelector( '.wp-embed-share-dialog' ),
  28              share_dialog_open = document.querySelector( '.wp-embed-share-dialog-open' ),
  29              share_dialog_close = document.querySelector( '.wp-embed-share-dialog-close' ),
  30              share_input = document.querySelectorAll( '.wp-embed-share-input' ),
  31              share_dialog_tabs = document.querySelectorAll( '.wp-embed-share-tab-button button' ),
  32              featured_image = document.querySelector( '.wp-embed-featured-image img' ),
  33              i;
  34  
  35          if ( share_input ) {
  36              for ( i = 0; i < share_input.length; i++ ) {
  37                  share_input[ i ].addEventListener( 'click', function ( e ) {
  38                      e.target.select();
  39                  } );
  40              }
  41          }
  42  
  43  		function openSharingDialog() {
  44              share_dialog.className = share_dialog.className.replace( 'hidden', '' );
  45              // Initial focus should go on the currently selected tab in the dialog.
  46              document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' ).focus();
  47          }
  48  
  49  		function closeSharingDialog() {
  50              share_dialog.className += ' hidden';
  51              document.querySelector( '.wp-embed-share-dialog-open' ).focus();
  52          }
  53  
  54          if ( share_dialog_open ) {
  55              share_dialog_open.addEventListener( 'click', function () {
  56                  openSharingDialog();
  57              } );
  58          }
  59  
  60          if ( share_dialog_close ) {
  61              share_dialog_close.addEventListener( 'click', function () {
  62                  closeSharingDialog();
  63              } );
  64          }
  65  
  66  		function shareClickHandler( e ) {
  67              var currentTab = document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' );
  68              currentTab.setAttribute( 'aria-selected', 'false' );
  69              document.querySelector( '#' + currentTab.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'true' );
  70  
  71              e.target.setAttribute( 'aria-selected', 'true' );
  72              document.querySelector( '#' + e.target.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'false' );
  73          }
  74  
  75  		function shareKeyHandler( e ) {
  76              var target = e.target,
  77                  previousSibling = target.parentElement.previousElementSibling,
  78                  nextSibling = target.parentElement.nextElementSibling,
  79                  newTab, newTabChild;
  80  
  81              if ( 37 === e.keyCode ) {
  82                  newTab = previousSibling;
  83              } else if ( 39 === e.keyCode ) {
  84                  newTab = nextSibling;
  85              } else {
  86                  return false;
  87              }
  88  
  89              if ( 'rtl' === document.documentElement.getAttribute( 'dir' ) ) {
  90                  newTab = ( newTab === previousSibling ) ? nextSibling : previousSibling;
  91              }
  92  
  93              if ( newTab ) {
  94                  newTabChild = newTab.firstElementChild;
  95  
  96                  target.setAttribute( 'tabindex', '-1' );
  97                  target.setAttribute( 'aria-selected', false );
  98                  document.querySelector( '#' + target.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'true' );
  99  
 100                  newTabChild.setAttribute( 'tabindex', '0' );
 101                  newTabChild.setAttribute( 'aria-selected', 'true' );
 102                  newTabChild.focus();
 103                  document.querySelector( '#' + newTabChild.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'false' );
 104              }
 105          }
 106  
 107          if ( share_dialog_tabs ) {
 108              for ( i = 0; i < share_dialog_tabs.length; i++ ) {
 109                  share_dialog_tabs[ i ].addEventListener( 'click', shareClickHandler );
 110  
 111                  share_dialog_tabs[ i ].addEventListener( 'keydown', shareKeyHandler );
 112              }
 113          }
 114  
 115          document.addEventListener( 'keydown', function ( e ) {
 116              if ( 27 === e.keyCode && -1 === share_dialog.className.indexOf( 'hidden' ) ) {
 117                  closeSharingDialog();
 118              } else if ( 9 === e.keyCode ) {
 119                  constrainTabbing( e );
 120              }
 121          }, false );
 122  
 123  		function constrainTabbing( e ) {
 124              // Need to re-get the selected tab each time.
 125              var firstFocusable = document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' );
 126  
 127              if ( share_dialog_close === e.target && ! e.shiftKey ) {
 128                  firstFocusable.focus();
 129                  e.preventDefault();
 130              } else if ( firstFocusable === e.target && e.shiftKey ) {
 131                  share_dialog_close.focus();
 132                  e.preventDefault();
 133              }
 134          }
 135  
 136          if ( window.self === window.top ) {
 137              return;
 138          }
 139  
 140          // Send this document's height to the parent (embedding) site.
 141          sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) );
 142  
 143          // Send the document's height again after the featured image has been loaded.
 144          if ( featured_image ) {
 145              featured_image.addEventListener( 'load', function() {
 146                  sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) );
 147              } );
 148          }
 149  
 150          /**
 151           * Detect clicks to external (_top) links.
 152           */
 153  		function linkClickHandler( e ) {
 154              var target = e.target,
 155                  href;
 156              if ( target.hasAttribute( 'href' ) ) {
 157                  href = target.getAttribute( 'href' );
 158              } else {
 159                  href = target.parentElement.getAttribute( 'href' );
 160              }
 161  
 162              // Only catch clicks from the primary mouse button, without any modifiers.
 163              if ( event.altKey || event.ctrlKey || event.metaKey || event.shiftKey ) {
 164                  return;
 165              }
 166  
 167              // Send link target to the parent (embedding) site.
 168              if ( href ) {
 169                  sendEmbedMessage( 'link', href );
 170                  e.preventDefault();
 171              }
 172          }
 173  
 174          document.addEventListener( 'click', linkClickHandler );
 175      }
 176  
 177      /**
 178       * Iframe resize handler.
 179       */
 180  	function onResize() {
 181          if ( window.self === window.top ) {
 182              return;
 183          }
 184  
 185          clearTimeout( resizing );
 186  
 187          resizing = setTimeout( function () {
 188              sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) );
 189          }, 100 );
 190      }
 191  
 192      /**
 193       * Re-get the secret when it was added later on.
 194       */
 195  	function getSecret() {
 196          if ( window.self === window.top || !!secret ) {
 197              return;
 198          }
 199  
 200          secret = window.location.hash.replace( /.*secret=([\d\w]{10}).*/, '$1' );
 201  
 202          clearTimeout( secretTimeout );
 203  
 204          secretTimeout = setTimeout( function () {
 205              getSecret();
 206          }, 100 );
 207      }
 208  
 209      if ( supportedBrowser ) {
 210          getSecret();
 211          document.documentElement.className = document.documentElement.className.replace( /\bno-js\b/, '' ) + ' js';
 212          document.addEventListener( 'DOMContentLoaded', onLoad, false );
 213          window.addEventListener( 'load', onLoad, false );
 214          window.addEventListener( 'resize', onResize, false );
 215      }
 216  })( window, document );