You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
212 lines
6.0 KiB
212 lines
6.0 KiB
(function ( window, document ) { |
|
'use strict'; |
|
|
|
var supportedBrowser = ( document.querySelector && window.addEventListener ), |
|
loaded = false, |
|
secret, |
|
secretTimeout, |
|
resizing; |
|
|
|
function sendEmbedMessage( message, value ) { |
|
window.parent.postMessage( { |
|
message: message, |
|
value: value, |
|
secret: secret |
|
}, '*' ); |
|
} |
|
|
|
function onLoad() { |
|
if ( loaded ) { |
|
return; |
|
} |
|
loaded = true; |
|
|
|
var share_dialog = document.querySelector( '.wp-embed-share-dialog' ), |
|
share_dialog_open = document.querySelector( '.wp-embed-share-dialog-open' ), |
|
share_dialog_close = document.querySelector( '.wp-embed-share-dialog-close' ), |
|
share_input = document.querySelectorAll( '.wp-embed-share-input' ), |
|
share_dialog_tabs = document.querySelectorAll( '.wp-embed-share-tab-button button' ), |
|
featured_image = document.querySelector( '.wp-embed-featured-image img' ), |
|
i; |
|
|
|
if ( share_input ) { |
|
for ( i = 0; i < share_input.length; i++ ) { |
|
share_input[ i ].addEventListener( 'click', function ( e ) { |
|
e.target.select(); |
|
} ); |
|
} |
|
} |
|
|
|
function openSharingDialog() { |
|
share_dialog.className = share_dialog.className.replace( 'hidden', '' ); |
|
// Initial focus should go on the currently selected tab in the dialog. |
|
document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' ).focus(); |
|
} |
|
|
|
function closeSharingDialog() { |
|
share_dialog.className += ' hidden'; |
|
document.querySelector( '.wp-embed-share-dialog-open' ).focus(); |
|
} |
|
|
|
if ( share_dialog_open ) { |
|
share_dialog_open.addEventListener( 'click', function () { |
|
openSharingDialog(); |
|
} ); |
|
} |
|
|
|
if ( share_dialog_close ) { |
|
share_dialog_close.addEventListener( 'click', function () { |
|
closeSharingDialog(); |
|
} ); |
|
} |
|
|
|
function shareClickHandler( e ) { |
|
var currentTab = document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' ); |
|
currentTab.setAttribute( 'aria-selected', 'false' ); |
|
document.querySelector( '#' + currentTab.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'true' ); |
|
|
|
e.target.setAttribute( 'aria-selected', 'true' ); |
|
document.querySelector( '#' + e.target.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'false' ); |
|
} |
|
|
|
function shareKeyHandler( e ) { |
|
var target = e.target, |
|
previousSibling = target.parentElement.previousElementSibling, |
|
nextSibling = target.parentElement.nextElementSibling, |
|
newTab, newTabChild; |
|
|
|
if ( 37 === e.keyCode ) { |
|
newTab = previousSibling; |
|
} else if ( 39 === e.keyCode ) { |
|
newTab = nextSibling; |
|
} else { |
|
return false; |
|
} |
|
|
|
if ( 'rtl' === document.documentElement.getAttribute( 'dir' ) ) { |
|
newTab = ( newTab === previousSibling ) ? nextSibling : previousSibling; |
|
} |
|
|
|
if ( newTab ) { |
|
newTabChild = newTab.firstElementChild; |
|
|
|
target.setAttribute( 'tabindex', '-1' ); |
|
target.setAttribute( 'aria-selected', false ); |
|
document.querySelector( '#' + target.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'true' ); |
|
|
|
newTabChild.setAttribute( 'tabindex', '0' ); |
|
newTabChild.setAttribute( 'aria-selected', 'true' ); |
|
newTabChild.focus(); |
|
document.querySelector( '#' + newTabChild.getAttribute( 'aria-controls' ) ).setAttribute( 'aria-hidden', 'false' ); |
|
} |
|
} |
|
|
|
if ( share_dialog_tabs ) { |
|
for ( i = 0; i < share_dialog_tabs.length; i++ ) { |
|
share_dialog_tabs[ i ].addEventListener( 'click', shareClickHandler ); |
|
|
|
share_dialog_tabs[ i ].addEventListener( 'keydown', shareKeyHandler ); |
|
} |
|
} |
|
|
|
document.addEventListener( 'keydown', function ( e ) { |
|
if ( 27 === e.keyCode && -1 === share_dialog.className.indexOf( 'hidden' ) ) { |
|
closeSharingDialog(); |
|
} else if ( 9 === e.keyCode ) { |
|
constrainTabbing( e ); |
|
} |
|
}, false ); |
|
|
|
function constrainTabbing( e ) { |
|
// Need to re-get the selected tab each time. |
|
var firstFocusable = document.querySelector( '.wp-embed-share-tab-button [aria-selected="true"]' ); |
|
|
|
if ( share_dialog_close === e.target && ! e.shiftKey ) { |
|
firstFocusable.focus(); |
|
e.preventDefault(); |
|
} else if ( firstFocusable === e.target && e.shiftKey ) { |
|
share_dialog_close.focus(); |
|
e.preventDefault(); |
|
} |
|
} |
|
|
|
if ( window.self === window.top ) { |
|
return; |
|
} |
|
|
|
/** |
|
* Send this document's height to the parent (embedding) site. |
|
*/ |
|
sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) ); |
|
|
|
// Send the document's height again after the featured image has been loaded. |
|
if ( featured_image ) { |
|
featured_image.addEventListener( 'load', function() { |
|
sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) ); |
|
} ); |
|
} |
|
|
|
/** |
|
* Detect clicks to external (_top) links. |
|
*/ |
|
function linkClickHandler( e ) { |
|
var target = e.target, |
|
href; |
|
if ( target.hasAttribute( 'href' ) ) { |
|
href = target.getAttribute( 'href' ); |
|
} else { |
|
href = target.parentElement.getAttribute( 'href' ); |
|
} |
|
|
|
/** |
|
* Send link target to the parent (embedding) site. |
|
*/ |
|
if ( href ) { |
|
sendEmbedMessage( 'link', href ); |
|
e.preventDefault(); |
|
} |
|
} |
|
|
|
document.addEventListener( 'click', linkClickHandler ); |
|
} |
|
|
|
/** |
|
* Iframe resize handler. |
|
*/ |
|
function onResize() { |
|
if ( window.self === window.top ) { |
|
return; |
|
} |
|
|
|
clearTimeout( resizing ); |
|
|
|
resizing = setTimeout( function () { |
|
sendEmbedMessage( 'height', Math.ceil( document.body.getBoundingClientRect().height ) ); |
|
}, 100 ); |
|
} |
|
|
|
/** |
|
* Re-get the secret when it was added later on. |
|
*/ |
|
function getSecret() { |
|
if ( window.self === window.top || !!secret ) { |
|
return; |
|
} |
|
|
|
secret = window.location.hash.replace( /.*secret=([\d\w]{10}).*/, '$1' ); |
|
|
|
clearTimeout( secretTimeout ); |
|
|
|
secretTimeout = setTimeout( function () { |
|
getSecret(); |
|
}, 100 ); |
|
} |
|
|
|
if ( supportedBrowser ) { |
|
getSecret(); |
|
document.documentElement.className = document.documentElement.className.replace( /\bno-js\b/, '' ) + ' js'; |
|
document.addEventListener( 'DOMContentLoaded', onLoad, false ); |
|
window.addEventListener( 'load', onLoad, false ); |
|
window.addEventListener( 'resize', onResize, false ); |
|
} |
|
})( window, document );
|
|
|