Widgets: Allow oEmbeds in video widget.
Opens up video embeds to all supported video oEmbed providers. Props westonruter. See #42039. Built from https://develop.svn.wordpress.org/trunk@41759 git-svn-id: http://core.svn.wordpress.org/trunk@41593 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Konstantin Obenland
parent
704fb3900b
commit
5fe4acb1f5
|
|
@ -136,13 +136,13 @@
|
|||
/**
|
||||
* Whether a url is a supported external host.
|
||||
*
|
||||
* @deprecated since 4.9.
|
||||
*
|
||||
* @param {String} url - Video url.
|
||||
* @returns {boolean} Whether url is a supported video host.
|
||||
*/
|
||||
isHostedVideo: function isHostedVideo( url ) {
|
||||
var parsedUrl = document.createElement( 'a' );
|
||||
parsedUrl.href = url;
|
||||
return /vimeo|youtu\.?be/.test( parsedUrl.host );
|
||||
return false;
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -151,7 +151,7 @@
|
|||
* @returns {void}
|
||||
*/
|
||||
renderPreview: function renderPreview() {
|
||||
var control = this, previewContainer, previewTemplate, attachmentId, attachmentUrl, poster, isHostedEmbed = false, mime, error;
|
||||
var control = this, previewContainer, previewTemplate, attachmentId, attachmentUrl, poster, html = '', isOEmbed = false, mime, error, urlParser, matches;
|
||||
attachmentId = control.model.get( 'attachment_id' );
|
||||
attachmentUrl = control.model.get( 'url' );
|
||||
error = control.model.get( 'error' );
|
||||
|
|
@ -160,21 +160,31 @@
|
|||
return;
|
||||
}
|
||||
|
||||
if ( ! attachmentId && attachmentUrl ) {
|
||||
isHostedEmbed = control.isHostedVideo( attachmentUrl );
|
||||
}
|
||||
|
||||
if ( isHostedEmbed ) {
|
||||
control.fetchEmbed();
|
||||
poster = control.oembedResponses[ attachmentUrl ] ? control.oembedResponses[ attachmentUrl ].thumbnail_url : null;
|
||||
}
|
||||
|
||||
// Verify the selected attachment mime is supported.
|
||||
mime = control.selectedAttachment.get( 'mime' );
|
||||
if ( mime && attachmentId ) {
|
||||
if ( ! _.contains( _.values( wp.media.view.settings.embedMimes ), mime ) ) {
|
||||
error = 'unsupported_file_type';
|
||||
}
|
||||
} else if ( ! attachmentId ) {
|
||||
urlParser = document.createElement( 'a' );
|
||||
urlParser.href = attachmentUrl;
|
||||
matches = urlParser.pathname.toLowerCase().match( /\.(\w+)$/ );
|
||||
if ( matches ) {
|
||||
if ( ! _.contains( _.keys( wp.media.view.settings.embedMimes ), matches[1] ) ) {
|
||||
error = 'unsupported_file_type';
|
||||
}
|
||||
} else {
|
||||
isOEmbed = true;
|
||||
}
|
||||
}
|
||||
|
||||
if ( isOEmbed ) {
|
||||
control.fetchEmbed();
|
||||
if ( control.oembedResponses[ attachmentUrl ] ) {
|
||||
poster = control.oembedResponses[ attachmentUrl ].thumbnail_url;
|
||||
html = control.oembedResponses[ attachmentUrl ].html.replace( /\swidth="\d+"/, ' width="100%"' ).replace( /\sheight="\d+"/, '' );
|
||||
}
|
||||
}
|
||||
|
||||
previewContainer = control.$el.find( '.media-widget-preview' );
|
||||
|
|
@ -182,11 +192,12 @@
|
|||
|
||||
previewContainer.html( previewTemplate({
|
||||
model: {
|
||||
attachment_id: control.model.get( 'attachment_id' ),
|
||||
attachment_id: attachmentId,
|
||||
html: html,
|
||||
src: attachmentUrl,
|
||||
poster: poster
|
||||
},
|
||||
is_hosted_embed: isHostedEmbed,
|
||||
is_oembed: isOEmbed,
|
||||
error: error
|
||||
}));
|
||||
wp.mediaelement.initialize();
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
!function(a){"use strict";var b,c,d;d=wp.media.view.MediaFrame.VideoDetails.extend({createStates:function(){this.states.add([new wp.media.controller.VideoDetails({media:this.media}),new wp.media.controller.MediaLibrary({type:"video",id:"add-video-source",title:wp.media.view.l10n.videoAddSourceTitle,toolbar:"add-video-source",media:this.media,menu:!1}),new wp.media.controller.MediaLibrary({type:"text",id:"add-track",title:wp.media.view.l10n.videoAddTrackTitle,toolbar:"add-track",media:this.media,menu:"video-details"})])}}),b=a.MediaWidgetModel.extend({}),c=a.MediaWidgetControl.extend({showDisplaySettings:!1,oembedResponses:{},mapModelToMediaFrameProps:function(b){var c,d=this;return c=a.MediaWidgetControl.prototype.mapModelToMediaFrameProps.call(d,b),c.link="embed",c},fetchEmbed:function(){var a,b=this;a=b.model.get("url"),b.oembedResponses[a]||(b.fetchEmbedDfd&&"pending"===b.fetchEmbedDfd.state()&&b.fetchEmbedDfd.abort(),b.fetchEmbedDfd=wp.apiRequest({url:wp.media.view.settings.oEmbedProxyUrl,data:{url:b.model.get("url"),maxwidth:b.model.get("width"),maxheight:b.model.get("height"),discover:!1},type:"GET",dataType:"json",context:b}),b.fetchEmbedDfd.done(function(c){b.oembedResponses[a]=c,b.renderPreview()}),b.fetchEmbedDfd.fail(function(){b.oembedResponses[a]=null}))},isHostedVideo:function(a){var b=document.createElement("a");return b.href=a,/vimeo|youtu\.?be/.test(b.host)},renderPreview:function(){var a,b,c,d,e,f,g,h=this,i=!1;c=h.model.get("attachment_id"),d=h.model.get("url"),g=h.model.get("error"),(c||d)&&(!c&&d&&(i=h.isHostedVideo(d)),i&&(h.fetchEmbed(),e=h.oembedResponses[d]?h.oembedResponses[d].thumbnail_url:null),f=h.selectedAttachment.get("mime"),f&&c&&(_.contains(_.values(wp.media.view.settings.embedMimes),f)||(g="unsupported_file_type")),a=h.$el.find(".media-widget-preview"),b=wp.template("wp-media-widget-video-preview"),a.html(b({model:{attachment_id:h.model.get("attachment_id"),src:d,poster:e},is_hosted_embed:i,error:g})),wp.mediaelement.initialize())},editMedia:function(){var a,b,c,e=this;b=e.mapModelToMediaFrameProps(e.model.toJSON()),a=new d({frame:"video",state:"video-details",metadata:b}),wp.media.frame=a,a.$el.addClass("media-widget"),c=function(a){e.selectedAttachment.set(a),e.model.set(_.extend(_.omit(e.model.defaults(),"title"),e.mapMediaToModelProps(a),{error:!1}))},a.state("video-details").on("update",c),a.state("replace-video").on("replace",c),a.on("close",function(){a.detach()}),a.open()}}),a.controlConstructors.media_video=c,a.modelConstructors.media_video=b}(wp.mediaWidgets);
|
||||
!function(a){"use strict";var b,c,d;d=wp.media.view.MediaFrame.VideoDetails.extend({createStates:function(){this.states.add([new wp.media.controller.VideoDetails({media:this.media}),new wp.media.controller.MediaLibrary({type:"video",id:"add-video-source",title:wp.media.view.l10n.videoAddSourceTitle,toolbar:"add-video-source",media:this.media,menu:!1}),new wp.media.controller.MediaLibrary({type:"text",id:"add-track",title:wp.media.view.l10n.videoAddTrackTitle,toolbar:"add-track",media:this.media,menu:"video-details"})])}}),b=a.MediaWidgetModel.extend({}),c=a.MediaWidgetControl.extend({showDisplaySettings:!1,oembedResponses:{},mapModelToMediaFrameProps:function(b){var c,d=this;return c=a.MediaWidgetControl.prototype.mapModelToMediaFrameProps.call(d,b),c.link="embed",c},fetchEmbed:function(){var a,b=this;a=b.model.get("url"),b.oembedResponses[a]||(b.fetchEmbedDfd&&"pending"===b.fetchEmbedDfd.state()&&b.fetchEmbedDfd.abort(),b.fetchEmbedDfd=wp.apiRequest({url:wp.media.view.settings.oEmbedProxyUrl,data:{url:b.model.get("url"),maxwidth:b.model.get("width"),maxheight:b.model.get("height"),discover:!1},type:"GET",dataType:"json",context:b}),b.fetchEmbedDfd.done(function(c){b.oembedResponses[a]=c,b.renderPreview()}),b.fetchEmbedDfd.fail(function(){b.oembedResponses[a]=null}))},isHostedVideo:function(a){return!1},renderPreview:function(){var a,b,c,d,e,f,g,h,i,j=this,k="",l=!1;c=j.model.get("attachment_id"),d=j.model.get("url"),g=j.model.get("error"),(c||d)&&(f=j.selectedAttachment.get("mime"),f&&c?_.contains(_.values(wp.media.view.settings.embedMimes),f)||(g="unsupported_file_type"):c||(h=document.createElement("a"),h.href=d,i=h.pathname.toLowerCase().match(/\.(\w+)$/),i?_.contains(_.keys(wp.media.view.settings.embedMimes),i[1])||(g="unsupported_file_type"):l=!0),l&&(j.fetchEmbed(),j.oembedResponses[d]&&(e=j.oembedResponses[d].thumbnail_url,k=j.oembedResponses[d].html.replace(/\swidth="\d+"/,' width="100%"').replace(/\sheight="\d+"/,""))),a=j.$el.find(".media-widget-preview"),b=wp.template("wp-media-widget-video-preview"),a.html(b({model:{attachment_id:c,html:k,src:d,poster:e},is_oembed:l,error:g})),wp.mediaelement.initialize())},editMedia:function(){var a,b,c,e=this;b=e.mapModelToMediaFrameProps(e.model.toJSON()),a=new d({frame:"video",state:"video-details",metadata:b}),wp.media.frame=a,a.$el.addClass("media-widget"),c=function(a){e.selectedAttachment.set(a),e.model.set(_.extend(_.omit(e.model.defaults(),"title"),e.mapMediaToModelProps(a),{error:!1}))},a.state("video-details").on("update",c),a.state("replace-video").on("replace",c),a.on("close",function(){a.detach()}),a.open()}}),a.controlConstructors.media_video=c,a.modelConstructors.media_video=b}(wp.mediaWidgets);
|
||||
|
|
@ -184,12 +184,6 @@ wp.mediaWidgets = ( function( $ ) {
|
|||
return;
|
||||
}
|
||||
|
||||
// If video, test for Vimeo and YouTube, otherwise, renderFail(). This should be removed once #34115 is resolved.
|
||||
if ( 'video' === this.controller.options.mimeType && ! /vimeo|youtu\.?be/.test( urlParser.host ) ) {
|
||||
embedLinkView.renderFail();
|
||||
return;
|
||||
}
|
||||
|
||||
// Support YouTube embed links.
|
||||
url = embedLinkView.model.get( 'url' );
|
||||
re = /https?:\/\/www\.youtube\.com\/embed\/([^/]+)/;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -4,7 +4,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '4.9-alpha-41758';
|
||||
$wp_version = '4.9-alpha-41759';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
|
|||
|
|
@ -121,17 +121,21 @@ class WP_Widget_Media_Video extends WP_Widget_Media {
|
|||
return;
|
||||
}
|
||||
|
||||
add_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) );
|
||||
if ( $attachment ) {
|
||||
add_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) );
|
||||
|
||||
echo wp_video_shortcode(
|
||||
array_merge(
|
||||
$instance,
|
||||
compact( 'src' )
|
||||
),
|
||||
$instance['content']
|
||||
);
|
||||
echo wp_video_shortcode(
|
||||
array_merge(
|
||||
$instance,
|
||||
compact( 'src' )
|
||||
),
|
||||
$instance['content']
|
||||
);
|
||||
|
||||
remove_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) );
|
||||
remove_filter( 'wp_video_shortcode', array( $this, 'inject_video_max_width_style' ) );
|
||||
} else {
|
||||
echo $this->inject_video_max_width_style( wp_oembed_get( $src ) );
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -227,11 +231,11 @@ class WP_Widget_Media_Video extends WP_Widget_Media {
|
|||
<div class="notice notice-error notice-alt">
|
||||
<p><?php _e( 'Unable to preview media due to an unknown error.' ); ?></p>
|
||||
</div>
|
||||
<# } else if ( data.is_hosted_embed && data.model.poster ) { #>
|
||||
<# } else if ( data.is_oembed && data.model.poster ) { #>
|
||||
<a href="{{ data.model.src }}" target="_blank" class="media-widget-video-link">
|
||||
<img src="{{ data.model.poster }}" />
|
||||
</a>
|
||||
<# } else if ( data.is_hosted_embed ) { #>
|
||||
<# } else if ( data.is_oembed ) { #>
|
||||
<a href="{{ data.model.src }}" target="_blank" class="media-widget-video-link no-poster">
|
||||
<span class="dashicons dashicons-format-video"></span>
|
||||
</a>
|
||||
|
|
|
|||
Loading…
Reference in New Issue