99 lines
2.2 KiB
JavaScript
99 lines
2.2 KiB
JavaScript
|
( function( $ ) {
|
||
|
|
|
||
|
|
/**
|
||
|
|
* A function to help debouncing.
|
||
|
|
*/
|
||
|
|
var debounce = function( func, wait ) {
|
||
|
|
|
||
|
|
var timeout, args, context, timestamp;
|
||
|
|
|
||
|
|
return function() {
|
||
|
|
|
||
|
|
context = this;
|
||
|
|
args = [].slice.call( arguments, 0 );
|
||
|
|
timestamp = new Date();
|
||
|
|
|
||
|
|
var later = function() {
|
||
|
|
|
||
|
|
var last = ( new Date() ) - timestamp;
|
||
|
|
|
||
|
|
if ( last < wait ) {
|
||
|
|
timeout = setTimeout( later, wait - last );
|
||
|
|
} else {
|
||
|
|
timeout = null;
|
||
|
|
func.apply( context, args );
|
||
|
|
}
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
if ( ! timeout ) {
|
||
|
|
timeout = setTimeout( later, wait );
|
||
|
|
}
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* A function to resize videos.
|
||
|
|
*/
|
||
|
|
function responsive_videos() {
|
||
|
|
|
||
|
|
$( '.jetpack-video-wrapper' ).find( 'embed, iframe, object' ).each( function() {
|
||
|
|
var video_element, video_width, video_height, video_ratio, video_wrapper, video_margin, container_width;
|
||
|
|
|
||
|
|
video_element = $( this );
|
||
|
|
video_margin = 0;
|
||
|
|
|
||
|
|
if ( video_element.parents( '.jetpack-video-wrapper' ).prev( 'p' ).css( 'text-align' ) === 'center' ) {
|
||
|
|
video_margin = '0 auto';
|
||
|
|
}
|
||
|
|
|
||
|
|
if ( ! video_element.attr( 'data-ratio' ) ) {
|
||
|
|
video_element
|
||
|
|
.attr( 'data-ratio', this.height / this.width )
|
||
|
|
.attr( 'data-width', this.width )
|
||
|
|
.attr( 'data-height', this.height )
|
||
|
|
.css( {
|
||
|
|
'display' : 'block',
|
||
|
|
'margin' : video_margin
|
||
|
|
} );
|
||
|
|
}
|
||
|
|
|
||
|
|
video_width = video_element.attr( 'data-width' );
|
||
|
|
video_height = video_element.attr( 'data-height' );
|
||
|
|
video_ratio = video_element.attr( 'data-ratio' );
|
||
|
|
video_wrapper = video_element.parent();
|
||
|
|
container_width = video_wrapper.width();
|
||
|
|
|
||
|
|
if ( video_ratio === 'Infinity' ) {
|
||
|
|
video_width = '100%';
|
||
|
|
}
|
||
|
|
|
||
|
|
video_element
|
||
|
|
.removeAttr( 'height' )
|
||
|
|
.removeAttr( 'width' );
|
||
|
|
|
||
|
|
if ( video_width > container_width ) {
|
||
|
|
video_element
|
||
|
|
.width( container_width )
|
||
|
|
.height( container_width * video_ratio );
|
||
|
|
} else {
|
||
|
|
video_element
|
||
|
|
.width( video_width )
|
||
|
|
.height( video_height );
|
||
|
|
}
|
||
|
|
|
||
|
|
} );
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Load responsive_videos().
|
||
|
|
* Trigger resize to make sure responsive_videos() is loaded after IS.
|
||
|
|
*/
|
||
|
|
$( window ).load( responsive_videos ).resize( debounce( responsive_videos, 100 ) ).trigger( 'resize' );
|
||
|
|
$( document ).on( 'post-load', responsive_videos );
|
||
|
|
|
||
|
|
} )( jQuery );
|