diff --git a/src/wp-admin/includes/ajax-actions.php b/src/wp-admin/includes/ajax-actions.php
index 10fedc2baa..c848a17036 100644
--- a/src/wp-admin/includes/ajax-actions.php
+++ b/src/wp-admin/includes/ajax-actions.php
@@ -2309,6 +2309,8 @@ function wp_ajax_send_attachment_to_editor() {
* @since 3.5.0
*/
function wp_ajax_send_link_to_editor() {
+ global $post, $wp_embed;
+
check_ajax_referer( 'media-send-to-editor', 'nonce' );
if ( ! $src = wp_unslash( $_POST['src'] ) )
@@ -2323,9 +2325,20 @@ function wp_ajax_send_link_to_editor() {
if ( ! $title = trim( wp_unslash( $_POST['title'] ) ) )
$title = wp_basename( $src );
- $html = '';
- if ( $title )
+ $post = get_post( isset( $_POST['post_id'] ) ? $_POST['post_id'] : 0 );
+ // ping WordPress for an embed
+ $check_embed = $wp_embed->run_shortcode( '[embed]'. $src .'[/embed]' );
+ // fallback that WordPress creates when no oEmbed was found
+ $fallback = $wp_embed->maybe_make_link( $src );
+
+ if ( $check_embed !== $fallback ) {
+ // TinyMCE view for [embed] will parse this
+ $html = '[embed]' . $src . '[/embed]';
+ } elseif ( $title ) {
$html = '' . $title . '';
+ } else {
+ $html = '';
+ }
// Figure out what filter to run:
$type = 'file';
diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css
index 8cb499e13a..f4c3f21f24 100644
--- a/src/wp-includes/css/media-views.css
+++ b/src/wp-includes/css/media-views.css
@@ -1583,7 +1583,7 @@
.media-frame .embed-url .spinner {
position: absolute;
- top: 16px;
+ top: 32px;
right: 26px;
}
@@ -1594,7 +1594,7 @@
.embed-link-settings,
.embed-media-settings {
position: absolute;
- top: 60px;
+ top: 70px;
left: 0;
right: 0;
bottom: 0;
@@ -1602,6 +1602,14 @@
overflow: auto;
}
+.embed-preview img, .embed-preview iframe, .embed-preview embed {
+ max-width: 100%;
+}
+
+.embed-preview img {
+ height: auto;
+}
+
.image-details .media-modal {
left: 140px;
right: 140px;
diff --git a/src/wp-includes/js/media-views.js b/src/wp-includes/js/media-views.js
index edf2db4fb9..736ceb285b 100644
--- a/src/wp-includes/js/media-views.js
+++ b/src/wp-includes/js/media-views.js
@@ -6150,7 +6150,7 @@
},
initialize: function() {
- this.$input = $('').attr( 'type', 'text' ).val( this.model.get('url') );
+ this.$input = $('').attr( 'type', 'text' ).val( this.model.get('url') );
this.input = this.$input[0];
this.spinner = $('')[0];
@@ -6206,7 +6206,51 @@
*/
media.view.EmbedLink = media.view.Settings.extend({
className: 'embed-link-settings',
- template: media.template('embed-link-settings')
+ template: media.template('embed-link-settings'),
+
+ initialize: function() {
+ this.spinner = $('');
+ this.$el.append( this.spinner[0] );
+ this.listenTo( this.model, 'change:url', this.updateoEmbed );
+ },
+
+ updateoEmbed: function() {
+ var url = this.model.get( 'url' );
+
+ this.$('.setting.title').show();
+ // clear out previous results
+ this.$('.embed-container').hide().find('.embed-preview').html('');
+
+ // only proceed with embed if the field contains more than 6 characters
+ if ( url && url.length < 6 ) {
+ return;
+ }
+
+ this.spinner.show();
+
+ setTimeout( _.bind( this.fetch, this ), 500 );
+ },
+
+ fetch: function() {
+ // check if they haven't typed in 500 ms
+ if ( $('#embed-url-field').val() !== this.model.get('url') ) {
+ return;
+ }
+
+ wp.ajax.send( 'parse-embed', {
+ data : {
+ post_ID: media.view.settings.post.id,
+ content: '[embed]' + this.model.get('url') + '[/embed]'
+ }
+ } ).done( _.bind( this.renderoEmbed, this ) );
+ },
+
+ renderoEmbed: function(html) {
+ this.spinner.hide();
+
+ this.$('.setting.title').hide();
+ this.$('.embed-container').show().find('.embed-preview').html( html );
+ }
});
/**
diff --git a/src/wp-includes/media-template.php b/src/wp-includes/media-template.php
index 65803d4715..324ddf2ff2 100644
--- a/src/wp-includes/media-template.php
+++ b/src/wp-includes/media-template.php
@@ -546,10 +546,13 @@ function wp_print_media_templates() {