Upstream
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Allow inline editing of `width` and `height` parameters while previewing an embed in the media modal: 

* Use `wp.shortcode()` instead of manually constructing a shortcode in `views/embed/link`
* Allow a URL to transition to a shortcode (and vice versa) when returning an embed to TinyMCE
* In `WP_Embed`, store the last URL and last set of attributes requested in class properties
* `wp_ajax_parse_embed()`, allow `[embed]`s to have attributes. Return `attr` in the response.

This is a first pass to allow broad testing with recent MCE view changes. 

See #31139.

Built from https://develop.svn.wordpress.org/trunk@31620


git-svn-id: http://core.svn.wordpress.org/trunk@31601 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Scott Taylor 2015-03-05 06:00:26 +00:00
parent d3471e9850
commit cc953717b7
13 changed files with 173 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
wp-admin/includes/ajax-actions.php
View File

@ -2708,13 +2708,21 @@ function wp_ajax_parse_embed() {
}
$shortcode = wp_unslash( $_POST['shortcode'] );
$url = str_replace( '[embed]', '', str_replace( '[/embed]', '', $shortcode ) );
preg_match( '/' . get_shortcode_regex() . '/s', $shortcode, $matches );
$atts = shortcode_parse_atts( $matches[3] );
if ( ! empty( $atts[5] ) ) {
$url = $atts[5];
} elseif ( ! empty( $atts['src'] ) ) {
$url = $atts['src'];
}
$parsed = false;
setup_postdata( $post );
$wp_embed->return_false_on_fail = true;
if ( is_ssl() && preg_match( '%^\\[embed[^\\]]*\\]http://%i', $shortcode ) ) {
if ( is_ssl() && 0 === strpos( $url, 'http://' ) ) {
// Admin is ssl and the user pasted non-ssl URL.
// Check if the provider supports ssl embeds and use that for the preview.
$ssl_shortcode = preg_replace( '%^(\\[embed[^\\]]*\\])http://%i', '$1https://', $shortcode );
@ -2767,7 +2775,8 @@ function wp_ajax_parse_embed() {
}
wp_send_json_success( array(
'body' => $parsed
'body' => $parsed,
'attr' => $wp_embed->last_attr
) );
}

10
wp-includes/class-wp-embed.php
View File

@ -11,6 +11,8 @@ class WP_Embed {
public $post_ID;
public $usecache = true;
public $linkifunknown = true;
public $last_attr = array();
public $last_url = '';
/**
* When an URL cannot be embedded, return false instead of returning a link
@ -134,12 +136,18 @@ class WP_Embed {
$url = $attr['src'];
}
if ( empty( $url ) )
$this->last_url = $url;
if ( empty( $url ) ) {
$this->last_attr = $attr;
return '';
}
$rawattr = $attr;
$attr = wp_parse_args( $attr, wp_embed_defaults( $url ) );
$this->last_attr = $attr;
// kses converts & into & and we need to undo this
// See https://core.trac.wordpress.org/ticket/11311
$url = str_replace( '&', '&', $url );

24
wp-includes/css/media-views-rtl.css
View File

@ -1944,6 +1944,29 @@
clear: both;
}
.embed-link-settings .setting {
display: none;
}
.embed-link-dimensions:after {
content: '';
display: block;
clear: both;
}
.embed-link-dimensions .width,
.embed-link-dimensions .height {
float: right;
width: 125px;
clear: none;
margin-left: 10px;
}
.embed-link-dimensions input {
width: auto;
max-width: 110px;
}
.image-details .embed-media-settings .setting {
float: none;
width: auto;
@ -1990,6 +2013,7 @@
.media-embed .setting span {
display: block;
width: 200px;
max-width: 100%;
font-size: 13px;
line-height: 24px;
color: #666;

2
wp-includes/css/media-views-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

24
wp-includes/css/media-views.css
View File

@ -1944,6 +1944,29 @@
clear: both;
}
.embed-link-settings .setting {
display: none;
}
.embed-link-dimensions:after {
content: '';
display: block;
clear: both;
}
.embed-link-dimensions .width,
.embed-link-dimensions .height {
float: left;
width: 125px;
clear: none;
margin-right: 10px;
}
.embed-link-dimensions input {
width: auto;
max-width: 110px;
}
.image-details .embed-media-settings .setting {
float: none;
width: auto;
@ -1990,6 +2013,7 @@
.media-embed .setting span {
display: block;
width: 200px;
max-width: 100%;
font-size: 13px;
line-height: 24px;
color: #666;

2
wp-includes/css/media-views.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
wp-includes/js/mce-view.js
View File

@ -819,21 +819,30 @@ window.wp = window.wp || {};
edit: function( text, update ) {
var media = wp.media.embed,
frame = media.edit( text, !! this.url ),
self = this;
self = this,
events = 'change:url change:width change:height';
this.pausePlayers();
frame.state( 'embed' ).props.on( 'change:url', function( model, url ) {
if ( url ) {
frame.state( 'embed' ).props.on( events, function( model, url ) {
if ( url && model.get( 'url' ) ) {
frame.state( 'embed' ).metadata = model.toJSON();
}
} );
frame.state( 'embed' ).on( 'select', function() {
if ( self.url ) {
update( frame.state( 'embed' ).metadata.url );
var data = frame.state( 'embed' ).metadata;
if ( data.width ) {
delete self.url;
} else {
update( media.shortcode( frame.state( 'embed' ).metadata ).string() );
self.url = data.url;
}
if ( self.url ) {
update( data.url );
} else {
update( media.shortcode( data ).string() );
}
} );

2
wp-includes/js/mce-view.min.js vendored
View File

File diff suppressed because one or more lines are too long

46
wp-includes/js/media/views.js
View File

@ -4597,13 +4597,12 @@ EmbedLink = Settings.extend({
initialize: function() {
this.spinner = $('<span class="spinner" />');
this.$el.append( this.spinner[0] );
this.listenTo( this.model, 'change:url', this.updateoEmbed );
this.listenTo( this.model, 'change:url change:width change:height', this.updateoEmbed );
},
updateoEmbed: function() {
updateoEmbed: _.debounce( function() {
var url = this.model.get( 'url' );
this.$('.setting.title').show();
// clear out previous results
this.$('.embed-container').hide().find('.embed-preview').html('');
@ -4614,29 +4613,58 @@ EmbedLink = Settings.extend({
this.spinner.show();
setTimeout( _.bind( this.fetch, this ), 500 );
},
this.fetch();
}, 600 ),
fetch: function() {
var embed;
// check if they haven't typed in 500 ms
if ( $('#embed-url-field').val() !== this.model.get('url') ) {
return;
}
embed = new wp.shortcode({
tag: 'embed',
attrs: _.pick( this.model.attributes, [ 'width', 'height', 'src' ] ),
content: this.model.get('url')
});
wp.ajax.send( 'parse-embed', {
data : {
post_ID: wp.media.view.settings.post.id,
shortcode: '[embed]' + this.model.get('url') + '[/embed]'
shortcode: embed.string()
}
} ).done( _.bind( this.renderoEmbed, this ) );
},
renderoEmbed: function( response ) {
var html = ( response && response.body ) || '';
var html = ( response && response.body ) || '',
attr = {},
opts = { silent: true };
if ( response && response.attr ) {
attr = response.attr;
_.each( [ 'width', 'height' ], function ( key ) {
var $el = this.$( '.setting.' + key ),
value = attr[ key ];
if ( value ) {
this.model.set( key, value, opts );
$el.show().find( 'input' ).val( value );
} else {
this.model.unset( key, opts );
$el.hide().find( 'input' ).val( '' );
}
}, this );
} else {
this.model.unset( 'height', opts );
this.model.unset( 'width', opts );
}
this.spinner.hide();
this.$('.setting.title').hide();
this.$('.embed-container').show().find('.embed-preview').html( html );
}
});

2
wp-includes/js/media/views.min.js vendored
View File

File diff suppressed because one or more lines are too long

46
wp-includes/js/media/views/embed/link.js
View File

@ -20,13 +20,12 @@ EmbedLink = Settings.extend({
initialize: function() {
this.spinner = $('<span class="spinner" />');
this.$el.append( this.spinner[0] );
this.listenTo( this.model, 'change:url', this.updateoEmbed );
this.listenTo( this.model, 'change:url change:width change:height', this.updateoEmbed );
},
updateoEmbed: function() {
updateoEmbed: _.debounce( function() {
var url = this.model.get( 'url' );
this.$('.setting.title').show();
// clear out previous results
this.$('.embed-container').hide().find('.embed-preview').html('');
@ -37,29 +36,58 @@ EmbedLink = Settings.extend({
this.spinner.show();
setTimeout( _.bind( this.fetch, this ), 500 );
},
this.fetch();
}, 600 ),
fetch: function() {
var embed;
// check if they haven't typed in 500 ms
if ( $('#embed-url-field').val() !== this.model.get('url') ) {
return;
}
embed = new wp.shortcode({
tag: 'embed',
attrs: _.pick( this.model.attributes, [ 'width', 'height', 'src' ] ),
content: this.model.get('url')
});
wp.ajax.send( 'parse-embed', {
data : {
post_ID: wp.media.view.settings.post.id,
shortcode: '[embed]' + this.model.get('url') + '[/embed]'
shortcode: embed.string()
}
} ).done( _.bind( this.renderoEmbed, this ) );
},
renderoEmbed: function( response ) {
var html = ( response && response.body ) || '';
var html = ( response && response.body ) || '',
attr = {},
opts = { silent: true };
if ( response && response.attr ) {
attr = response.attr;
_.each( [ 'width', 'height' ], function ( key ) {
var $el = this.$( '.setting.' + key ),
value = attr[ key ];
if ( value ) {
this.model.set( key, value, opts );
$el.show().find( 'input' ).val( value );
} else {
this.model.unset( key, opts );
$el.hide().find( 'input' ).val( '' );
}
}, this );
} else {
this.model.unset( 'height', opts );
this.model.unset( 'width', opts );
}
this.spinner.hide();
this.$('.setting.title').hide();
this.$('.embed-container').show().find('.embed-preview').html( html );
}
});

10
wp-includes/media-template.php
View File

@ -819,6 +819,16 @@ function wp_print_media_templates() {
<span><?php _e( 'Title' ); ?></span>
<input type="text" class="alignment" data-setting="title" />
</label>
<div class="embed-link-dimensions">
<label class="setting width">
<span><?php _e( 'Maximum Width' ); ?></span>
<input type="text" class="alignment" data-setting="width" />
</label>
<label class="setting height">
<span><?php _e( 'Maximum Height' ); ?></span>
<input type="text" class="alignment" data-setting="height" />
</label>
</div>
<div class="embed-container" style="display: none;">
<div class="embed-preview"></div>
</div>

2
wp-includes/version.php
View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.2-alpha-31619';
$wp_version = '4.2-alpha-31620';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.