Post Format UI.

* Icons
* Selection
* Prompt text
* Special fields
* Styling
* Sparkles

This is going to need testing, polish, and love.

see #19570. props melchoyce, helen, wonderboymusic, lessbloat, rachelbaker, aaroncampbell, DrewAPicture, ryelle.

git-svn-id: https://develop.svn.wordpress.org/trunk@23843 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Mark Jaquith 2013-03-29 03:35:41 +00:00
parent 191ceb01cd
commit e7cde8715f
12 changed files with 576 additions and 83 deletions

View File

@ -23,6 +23,7 @@ TABLE OF CONTENTS:
11.1 - Custom Fields
11.2 - Post Revisions
11.3 - Featured Images
11.4 - Post Format Selection
12.0 - Categories
13.0 - Tags
14.0 - Media Screen
@ -966,6 +967,33 @@ table.diff td, table.diff th {
float: right;
}
/*------------------------------------------------------------------------------
11.4 - Post format selection
------------------------------------------------------------------------------*/
.post-format-options a {
border-left: 1px solid #ebebeb;
border-right: none;
}
.post-format-options a:first-child {
-webkit-border-bottom-left-radius: 0;
-webkit-border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.post-format-options a:last-child {
-webkit-border-bottom-right-radius: 3px;
-webkit-border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
.post-format-tip {
float: left;
}
/*------------------------------------------------------------------------------
12.0 - Categories
------------------------------------------------------------------------------*/

View File

@ -24,6 +24,7 @@ TABLE OF CONTENTS:
11.1 - Custom Fields
11.2 - Post Revisions
11.3 - Featured Images
11.4 - Post Format Selection
12.0 - Categories
13.0 - Tags
14.0 - Media Screen
@ -3150,10 +3151,14 @@ input#link_url {
display: none;
}
.wp-format-gallery .post-formats-fields,
.wp-format-image .post-formats-fields,
.wp-format-link .post-formats-fields,
.wp-format-quote .post-formats-fields,
.wp-format-video .post-formats-fields,
.wp-format-audio .post-formats-fields,
.wp-format-gallery .field.wp-format-gallery,
.wp-format-image .field.wp-format-image,
.wp-format-chat .field.wp-format-chat,
.wp-format-link .field.wp-format-link,
.wp-format-quote .field.wp-format-quote,
@ -3165,6 +3170,7 @@ input#link_url {
.post-formats-fields .field {
display: none;
margin-bottom: 10px;
overflow: hidden;
}
.post-formats-fields input,
@ -3173,6 +3179,66 @@ input#link_url {
font-size: 1.2em;
}
.wp-format-media-holder {
float: left;
overflow: hidden;
width: 40%;
height: 200px;
border: 1px dashed #dfdfdf;
background: #f5f5f5 url(../images/media-button-2x.png) no-repeat 50% 25%;
}
.wp-format-media-holder.empty {
height: auto;
padding: 55px 0 20px;
}
.wp-format-media-holder:hover {
background-color: #eee;
}
.wp-format-media-preview {
margin-bottom: 20px;
}
.mejs-audio audio,
.mejs-video video {
display: block;
}
.wp-format-media-select {
display: block;
height: 200px;
text-align: center;
}
.wp-format-media-select img {
max-width: 100%;
max-height: 100%;
}
.empty .wp-format-media-select {
height: 20px;
}
.empty .wp-format-media-metaedit {
height: 20px;
display: block;
text-align: center;
}
.edit-format-preview {
display: block;
margin: 5px 0;
}
#wp_format_audio, #wp_format_video {
float: left;
margin-right: 23px;
max-width: 50%;
min-height: 97px;
}
/* Post Screen */
#post-body #normal-sortables {
min-height: 50px;
@ -4065,6 +4131,151 @@ body .ui-tooltip {
display: none;
}
/*------------------------------------------------------------------------------
11.4 - Post format selection
------------------------------------------------------------------------------*/
#icon-edit.standard {
background: url(../images/post-formats32.png) no-repeat -3px -4px;
}
#icon-edit.image {
background: url(../images/post-formats32.png) no-repeat -43px -4px;
}
#icon-edit.gallery {
background: url(../images/post-formats32.png) no-repeat -83px -4px;
}
#icon-edit.audio {
background: url(../images/post-formats32.png) no-repeat -123px -4px;
}
#icon-edit.video {
background: url(../images/post-formats32.png) no-repeat -163px -4px;
}
#icon-edit.chat {
background: url(../images/post-formats32.png) no-repeat -202px -4px;
}
#icon-edit.status {
background: url(../images/post-formats32.png) no-repeat -242px -4px;
}
#icon-edit.aside {
background: url(../images/post-formats32.png) no-repeat -282px -4px;
}
#icon-edit.quote {
background: url(../images/post-formats32.png) no-repeat -322px -4px;
}
#icon-edit.link {
background: url(../images/post-formats32.png) no-repeat -362px -4px;
}
.post-format-description {
color: #666;
display: none;
margin: 10px 0;
}
.post-format-options {
height: 29px;
background: #f9f9f9;
border: 1px solid #dfdfdf;
-webkit-border-radius: 3px;
border-radius: 3px;
margin: 0 0 9px 1px;
padding: 0;
}
.post-format-options a {
border-right: 1px solid #ebebeb;
display: inline-block;
height: 16px;
width: 16px;
padding: 6px;
position: relative;
text-decoration: none;
}
.post-format-options a:first-child {
-webkit-border-bottom-left-radius: 3px;
-webkit-border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.post-format-options a.active,
.post-format-options a:focus,
.post-format-options a:hover {
background: #fff;
outline: none;
opacity: 1;
}
.post-format-options a div {
height: 16px;
width: 16px;
opacity: 0.4;
}
.post-format-options a.active div,
.post-format-options a:focus div,
.post-format-options a:hover div {
opacity: 1;
}
.post-format-options .standard {
background: url(../images/post-formats.png) no-repeat -8px -8px;
}
.post-format-options .image {
background: url(../images/post-formats.png) no-repeat -40px -8px;
}
.post-format-options .gallery {
background: url(../images/post-formats.png) no-repeat -72px -8px;
}
.post-format-options .audio {
background: url(../images/post-formats.png) no-repeat -104px -8px;
}
.post-format-options .video {
background: url(../images/post-formats.png) no-repeat -136px -8px;
}
.post-format-options .chat {
background: url(../images/post-formats.png) no-repeat -168px -8px;
}
.post-format-options .status {
background: url(../images/post-formats.png) no-repeat -200px -8px;
}
.post-format-options .aside {
background: url(../images/post-formats.png) no-repeat -232px -8px;
}
.post-format-options .quote {
background: url(../images/post-formats.png) no-repeat -264px -8px;
}
.post-format-options .link {
background: url(../images/post-formats.png) no-repeat -296px -8px;
}
.post-format-tip {
color: #999;
font-size: 14px;
float: right;
padding: 6px 10px;
text-transform: capitalize;
}
/*------------------------------------------------------------------------------
12.0 - Categories
------------------------------------------------------------------------------*/

View File

@ -130,6 +130,8 @@ foreach ( get_object_taxonomies( $post ) as $tax_name ) {
$format_class = '';
if ( post_type_supports( $post_type, 'post-formats' ) ) {
wp_enqueue_script( 'post-formats' );
wp_enqueue_script( 'wp-mediaelement' );
wp_enqueue_style( 'wp-mediaelement' );
$post_format = get_post_format();
if ( ! $post_format )
@ -138,6 +140,57 @@ if ( post_type_supports( $post_type, 'post-formats' ) ) {
$format_class = " class='wp-format-{$post_format}'";
}
if ( post_type_supports( $post_type, 'post-formats' ) ) {
$all_post_formats = array(
'standard' => array (
'description' => __( 'Add a title and use the editor to compose your post.' )
),
'image' => array (
'description' => __( 'Select or upload an image to use for your post.' )
),
'gallery' => array (
'description' => __( 'Use the Add Media button to select or upload images for your gallery.' )
),
'link' => array (
'description' => __( 'Add a link URL below.' )
),
'video' => array (
'description' => __( 'Paste a video embed into the box, upload a video file, or choose one from your Media Library.' )
),
'audio' => array (
'description' => __( 'Paste an audio embed into the box, upload an audio file, or choose one from your Media Library.' )
),
'chat' => array (
'description' => __( 'Copy a chat or Q&A transcript into the editor.' )
),
'status' => array (
'description' => __( 'Use the editor to compose a status update. What’s new?' )
),
'quote' => array (
'description' => __( 'Copy a quotation into the box. Also add the source and URL if you have them.' )
),
'aside' => array (
'description' => __( 'An aside is a quick thought or side topic. Use the editor to compose one.' )
)
);
$post_format_options = '';
foreach ( $all_post_formats as $slug => $attr ) {
$class = '';
if ( $post_format == $slug ) {
$class = 'class="active"';
$active_post_type_slug = $slug;
$active_post_type_label = ucfirst( $slug );
$active_post_format_description = $attr['description'];
}
$post_format_options .= '<a ' . $class . ' href="?format=' . $slug . '" data-description="' . $attr['description'] . '" data-wp-format="' . $slug . '" title="' . ucfirst( sprintf( __( '%s Post' ), $slug ) ) . '"><div class="' . $slug . '"></div></a>';
}
}
$current_post_format = array( 'currentPostFormat' => esc_html( $active_post_type_slug ) );
wp_localize_script( 'post', 'postFormats', $current_post_format );
if ( post_type_supports($post_type, 'page-attributes') )
add_meta_box('pageparentdiv', 'page' == $post_type ? __('Page Attributes') : __('Attributes'), 'page_attributes_meta_box', null, 'side', 'core');
@ -337,29 +390,16 @@ wp_nonce_field( 'closedpostboxes', 'closedpostboxesnonce', false );
?>
<div id="poststuff">
<?php
if ( post_type_supports( $post_type, 'post-formats' ) ) {
$all_post_formats = get_post_format_strings();
echo '<h2 class="nav-tab-wrapper post-format-select">';
foreach ( $all_post_formats as $slug => $label ) {
if ( $post_format == $slug )
$class = 'nav-tab nav-tab-active';
else
$class = 'nav-tab';
echo '<a class="' . $class . '" href="?format=' . $slug . '" data-wp-format="' . $slug . '">' . $label . '</a>';
}
echo '</h2>';
}
?>
<div id="post-body" class="metabox-holder columns-<?php echo 1 == get_current_screen()->get_columns() ? '1' : '2'; ?>">
<div id="post-body-content"<?php echo $format_class; ?>>
<?php if ( ! empty( $post_format_options ) ) : ?>
<div class="post-format-options">
<span class="post-format-tip">Standard Post</span>
<?php echo $post_format_options; ?>
</div>
<?php endif; ?>
<?php if ( post_type_supports($post_type, 'title') ) { ?>
<div id="titlediv">
<div id="titlewrap">
@ -373,10 +413,12 @@ $shortlink = wp_get_shortlink($post->ID, 'post');
if ( !empty($shortlink) )
$sample_permalink_html .= '<input id="shortlink" type="hidden" value="' . esc_attr($shortlink) . '" /><a href="#" class="button button-small" onclick="prompt(&#39;URL:&#39;, jQuery(\'#shortlink\').val()); return false;">' . __('Get Shortlink') . '</a>';
if ( $post_type_object->public && ! ( 'pending' == get_post_status( $post ) && !current_user_can( $post_type_object->cap->publish_posts ) ) ) { ?>
<div id="edit-slug-box" class="hide-if-no-js">
if ( $post_type_object->public && ! ( 'pending' == get_post_status( $post ) && !current_user_can( $post_type_object->cap->publish_posts ) ) ) {
$has_sample_permalink = $sample_permalink_html && 'auto-draft' != $post->post_status;
?>
<div id="edit-slug-box" class="hide-if-no-js<?php if ( ! $has_sample_permalink ) echo ' hidden' ?>">
<?php
if ( $sample_permalink_html && 'auto-draft' != $post->post_status )
if ( $has_sample_permalink )
echo $sample_permalink_html;
?>
</div>
@ -398,36 +440,8 @@ if ( has_action( 'edit_form_after_title' ) ) {
}
// post format fields
if ( post_type_supports( $post_type, 'post-formats' ) ) {
$format_meta = get_post_format_meta( $post_ID );
?>
<div class="post-formats-fields edit-form-section">
<input type="hidden" name="post_format" id="post_format" value="<?php echo esc_attr( $post_format ); ?>" />
<div class="field wp-format-quote">
<label for="_wp_format_quote" class="screen-reader-text"><?php _e( 'Quote' ); ?>:</label>
<textarea name="_wp_format_quote" placeholder="<?php esc_attr_e( 'Quote' ); ?>" class="widefat"><?php echo esc_textarea( $format_meta['quote'] ); ?></textarea>
</div>
<div class="field wp-format-quote">
<label for="_wp_format_quote_source" class="screen-reader-text"><?php _e( 'Quote source' ); ?>:</label>
<input type="text" name="_wp_format_quote_source" value="<?php echo esc_attr( $format_meta['quote_source'] ); ?>" placeholder="<?php esc_attr_e( 'Quote source' ); ?>" class="widefat" />
</div>
<div class="field wp-format-link wp-format-quote">
<label for="_wp_format_url" class="screen-reader-text"><?php _e( 'Link URL' ); ?>:</label>
<input type="text" name="_wp_format_url" value="<?php echo esc_url( $format_meta['url'] ); ?>" placeholder="<?php esc_attr_e( 'Link URL' ); ?>" class="widefat" />
</div>
<div class="field wp-format-audio wp-format-video">
<label for="_wp_format_media" class="screen-reader-text"><?php _e( 'Embed code or URL' ); ?>:</label>
<textarea name="_wp_format_media" placeholder="<?php esc_attr_e( 'Embed code or URL' ); ?>" class="widefat"><?php echo esc_textarea( $format_meta['media'] ); ?></textarea>
</div>
</div>
<?php
}
if ( post_type_supports( $post_type, 'post-formats' ) )
require_once( './includes/post-formats.php' );
if ( post_type_supports($post_type, 'editor') ) {
?>

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

View File

@ -0,0 +1,114 @@
<?php
global $wp_embed;
$format_meta = get_post_format_meta( $post_ID );
?>
<div class="post-format-description"></div>
<div class="post-formats-fields edit-form-section">
<input type="hidden" name="post_format" id="post_format" value="<?php echo esc_attr( $post_format ); ?>" />
<div class="field wp-format-quote">
<label for="_wp_format_quote" class="screen-reader-text"><?php _e( 'Quote' ); ?>:</label>
<textarea name="_wp_format_quote" placeholder="<?php esc_attr_e( 'Quote' ); ?>" class="widefat"><?php echo esc_textarea( $format_meta['quote'] ); ?></textarea>
</div>
<div class="field wp-format-quote">
<label for="_wp_format_quote_source" class="screen-reader-text"><?php _e( 'Quote source' ); ?>:</label>
<input type="text" name="_wp_format_quote_source" value="<?php echo esc_attr( $format_meta['quote_source'] ); ?>" placeholder="<?php esc_attr_e( 'Quote source' ); ?>" class="widefat" />
</div>
<?php
$image = false;
if ( isset( $format_meta['image'] ) )
$image = is_numeric( $format_meta['image'] ) ? wp_get_attachment_url( $format_meta['image'] ) : $format_meta['image'];
?>
<div class="field wp-format-image">
<div data-format="image" class="wp-format-media-holder hide-if-no-js<?php if ( ! $image ) echo ' empty'; ?>">
<a href="#" class="wp-format-media-select"
data-choose="<?php esc_attr_e( 'Choose an Image' ); ?>"
data-update="<?php esc_attr_e( 'Select Image' ); ?>">
<?php
if ( $image )
echo '<img src="' . esc_url( $image ) . '" />';
else
_e( 'Select / Upload Image' );
?>
</a>
</div>
<label for="_wp_format_image" class="screen-reader-text"><?php _e( 'Image URL' ); ?>:</label>
<input id="wp_format_image" type="hidden" name="_wp_format_image" value="<?php echo esc_url( $format_meta['image'] ); ?>" placeholder="<?php esc_attr_e( 'Image URL' ); ?>" class="widefat" />
</div>
<div class="field wp-format-link wp-format-quote wp-format-image">
<label for="_wp_format_url" class="screen-reader-text"><?php _e( 'Link URL' ); ?>:</label>
<input type="text" name="_wp_format_url" value="<?php echo esc_url( $format_meta['url'] ); ?>" placeholder="<?php esc_attr_e( 'Link URL' ); ?>" class="widefat" />
</div>
<?php
$show_video_preview = ! empty( $format_meta['video'] );
?>
<div class="field wp-format-video<?php if ( $show_video_preview ) echo ' has-media-preview' ?>">
<?php if ( $show_video_preview ): ?>
<div id="video-preview" class="wp-format-media-preview">
<?php
if ( is_numeric( $format_meta['video'] ) ) {
$url = wp_get_attachment_url( $format_meta['video'] );
echo do_shortcode( sprintf( '[video src="%s"]', $url ) );
} elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $format_meta['video'] ) ) {
echo do_shortcode( $format_meta['video'] );
} elseif ( ! preg_match( '#<[^>]+>#', $format_meta['video'] ) ) {
if ( strstr( $format_meta['video'], home_url() ) )
echo do_shortcode( sprintf( '[video src="%s"]', $format_meta['video'] ) );
else
echo $wp_embed->autoembed( $format_meta['video'] );
} else {
echo $format_meta['video'];
}
?>
</div>
<?php endif ?>
<label for="_wp_format_video" class="screen-reader-text"><?php _e( 'Video embed code or URL' ); ?>:</label>
<textarea id="wp_format_video" type="text" name="_wp_format_video" placeholder="<?php esc_attr_e( 'Video embed code or URL' ); ?>" class="widefat"><?php esc_html_e( $format_meta['video'] ); ?></textarea>
<div data-format="video" class="wp-format-media-holder hide-if-no-js<?php if ( ! $image ) echo ' empty'; ?>">
<a href="#" class="wp-format-media-select"
data-choose="<?php esc_attr_e( 'Choose a Video' ); ?>"
data-update="<?php esc_attr_e( 'Select Video' ); ?>">
<?php _e( 'Select Video From Media Library' ) ?>
</a>
</div>
</div>
<?php
$show_audio_preview = ! empty( $format_meta['audio'] );
?>
<div class="field wp-format-audio<?php if ( $show_audio_preview ) echo ' has-media-preview' ?>">
<?php if ( $show_audio_preview ): ?>
<div id="audio-preview" class="wp-format-media-preview">
<?php
if ( is_numeric( $format_meta['audio'] ) ) {
$url = wp_get_attachment_url( $format_meta['audio'] );
echo do_shortcode( sprintf( '[audio src="%s"]', $url ) );
} elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $format_meta['audio'] ) ) {
echo do_shortcode( $format_meta['audio'] );
} elseif ( ! preg_match( '#<[^>]+>#', $format_meta['audio'] ) ) {
if ( strstr( $format_meta['audio'], home_url() ) )
echo do_shortcode( sprintf( '[audio src="%s"]', $format_meta['audio'] ) );
else
echo $wp_embed->autoembed( $format_meta['audio'] );
} else {
echo $format_meta['audio'];
}
?>
</div>
<?php endif ?>
<label for="_wp_format_audio" class="screen-reader-text"><?php _e( 'Audio embed code or URL' ); ?>:</label>
<textarea id="wp_format_audio" name="_wp_format_audio" placeholder="<?php esc_attr_e( 'Audio embed code or URL' ); ?>" class="widefat"><?php esc_html_e( $format_meta['audio'] );
?></textarea>
<div data-format="audio" class="wp-format-media-holder hide-if-no-js<?php if ( empty( $format_meta['audio'] ) ) echo ' empty'; ?>">
<a href="#" class="wp-format-media-select" data-choose="<?php esc_attr_e( 'Choose Audio' ); ?>" data-update="<?php esc_attr_e( 'Select Audio' ); ?>">
<?php _e( 'Select Audio From Media Library' ) ?>
</a>
</div>
</div>
</div>

View File

@ -200,7 +200,7 @@ function edit_post( $post_data = null ) {
update_post_meta( $post_ID, '_wp_format_url', wp_slash( esc_url_raw( wp_unslash( $post_data['_wp_format_url'] ) ) ) );
}
$format_keys = array( 'quote', 'quote_source', 'image', 'gallery', 'media' );
$format_keys = array( 'quote', 'quote_source', 'image', 'gallery', 'image', 'gallery', 'audio', 'video' );
foreach ( $format_keys as $key ) {
if ( isset( $post_data[ '_wp_format_' . $key ] ) )

View File

@ -142,11 +142,13 @@ function screen_icon( $screen = '' ) {
*
* @since 3.2.0
*
* @global $post_ID
* @param string|WP_Screen $screen Optional. Accepts a screen object (and defaults to the current screen object)
* which it uses to determine an icon HTML ID. Or, if a string is provided, it is used to form the icon HTML ID.
* @return string HTML for the screen icon.
*/
function get_screen_icon( $screen = '' ) {
global $post_ID;
if ( empty( $screen ) )
$screen = get_current_screen();
elseif ( is_string( $screen ) )
@ -165,6 +167,12 @@ function get_screen_icon( $screen = '' ) {
if ( $screen->post_type )
$class .= ' ' . sanitize_html_class( 'icon32-posts-' . $screen->post_type );
if ( $post_ID ) {
$format = get_post_format( $post_ID );
if ( $format )
$class .= ' ' . $format;
}
}
return '<div id="icon-' . esc_attr( $icon_id ) . '" class="' . $class . '"><br /></div>';

View File

@ -1,19 +1,30 @@
(function($){
window.wp = window.wp || {};
(function($) {
var mediaFrame, lastMimeType, lastMenu, mediaPreview;
// Post formats selection
$('.post-format-select a').on( 'click.post-format', function(e) {
var $this = $(this),
editor,
body,
$('.post-format-options a').on( 'click', function(e){
var $this = $(this), editor, body,
parent = $this.parent(),
format = $this.data('wp-format'),
container = $('#post-body-content');
container = $('#post-body-content'),
description = $('.post-format-description');
$('.post-format-select a.nav-tab-active').removeClass('nav-tab-active');
$this.addClass('nav-tab-active').blur();
parent.find('a.active').removeClass('active');
$this.addClass('active');
$('#icon-edit').removeClass(postFormats.currentPostFormat).addClass(format);
$('#post_format').val(format);
container.get(0).className = container.get(0).className.replace( /\bwp-format-[^ ]+/, '' );
container.addClass('wp-format-' + format);
$('#title').focus();
// Update description line
description.html($this.data('description'));
if (description.not(':visible'))
description.slideDown('fast');
if ( typeof tinymce != 'undefined' ) {
editor = tinymce.get('content');
@ -25,7 +36,95 @@
}
}
postFormats.currentPostFormat = format;
e.preventDefault();
}).on('mouseenter focusin', function () {
$('.post-format-tip').html( $(this).prop('title') );
}).on('mouseleave focusout', function () {
$('.post-format-tip').html( $('.post-format-options a.active').prop('title') );
});
})(jQuery);
// Media selection
$('.wp-format-media-select').click(function (event) {
event.preventDefault();
var $el = $(this), $holder, $field, mime = 'image', menu = '',
$holder = $el.closest('.wp-format-media-holder'),
$field = $( '#wp_format_' + $holder.data('format') );
switch ( $holder.data('format') ) {
case 'audio':
mime = 'audio';
break;
case 'video':
mime = 'video';
break;
}
// If the media frame already exists, reopen it.
if ( mediaFrame && lastMimeType === mime && lastMenu === menu ) {
mediaFrame.open();
return;
}
lastMimeType = mime;
lastMenu = menu;
// Create the media frame.
mediaFrame = wp.media.frames.formatMedia = wp.media({
// Set the title of the modal.
title: $el.data('choose'),
// Set the menu sidebar of the modal, if applicable
toolbar: menu,
// Tell the modal to show only items matching the current mime type.
library: {
type: mime
},
// Customize the submit button.
button: {
// Set the text of the button.
text: $el.data('update')
}
});
mediaPreview = function (format, url, mime) {
$('#' + format + '-preview').remove();
$holder.parent().prepend( '<div id="' + format + '-preview" class="wp-format-media-preview">' +
'<' + format + ' class="wp-' + format + '-shortcode" controls="controls" preload="none">' +
'<source type="' + mime + '" src="' + url + '" />' +
'</' + format + '></div>' );
$('.wp-' + format + '-shortcode').mediaelementplayer();
};
// When an image is selected, run a callback.
mediaFrame.on( 'select', function () {
// Grab the selected attachment.
var attachment = mediaFrame.state().get('selection').first(), mime, url, id;
id = attachment.get('id');
url = attachment.get('url');
mime = attachment.get('mime');
if ( 0 === mime.indexOf('audio') ) {
$field.val(url);
// show one preview at a time
mediaPreview('audio', url, mime);
} else if ( 0 === mime.indexOf('video') ) {
$field.val(url);
// show one preview at a time
mediaPreview('video', url, mime);
} else {
// set the hidden input's value
$field.val(url);
// Show the image in the placeholder
$el.html('<img src="' + url + '" />');
$holder.removeClass('empty').show();
}
});
mediaFrame.open();
});
})(jQuery);

View File

@ -641,7 +641,13 @@ jQuery(document).ready( function($) {
new_title: $('#title').val(),
samplepermalinknonce: $('#samplepermalinknonce').val()
}, function(data) {
$('#edit-slug-box').html(data);
var box = $('#edit-slug-box');
box.html(data);
if (box.hasClass('hidden')) {
box.fadeIn('fast', function () {
box.removeClass('hidden');
});
}
b.html(revert_b);
real_slug.val(new_slug);
makeSlugeditClickable();

View File

@ -199,7 +199,13 @@ function autosave_update_slug(post_id) {
},
function(data) {
if ( data !== '-1' ) {
jQuery('#edit-slug-box').html(data);
var box = jQuery('#edit-slug-box');
box.html(data);
if (box.hasClass('hidden')) {
box.fadeIn('fast', function () {
box.removeClass('hidden');
});
}
makeSlugeditClickable();
}
}

View File

@ -2043,21 +2043,21 @@ function get_the_media( $type, &$post = null ) {
if ( has_post_format( $type ) ) {
$meta = get_post_format_meta( $post->ID );
if ( ! empty( $meta['media'] ) ) {
if ( is_numeric( $meta['media'] ) ) {
$url = wp_get_attachment_url( $meta['media'] );
if ( ! empty( $meta[$type] ) ) {
if ( is_integer( $meta[$type] ) ) {
$url = wp_get_attachment_url( $meta[$type] );
$shortcode = sprintf( '[%s src="%s"]', $type, $url );
} elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $meta['media'] ) ) {
$shortcode = $meta['media'];
} elseif ( preg_match( '#<[^>]+>#', $meta['media'] ) ) {
$post->format_content = $meta['media'];
} elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $meta[$type] ) ) {
$shortcode = $meta[$type];
} elseif ( preg_match( '#<[^>]+>#', $meta[$type] ) ) {
$post->format_content = $meta[$type];
return $post->format_content;
} elseif ( 0 === strpos( $meta['media'], 'http' ) ) {
$post->split_content = str_replace( $meta['media'], '', $post->post_content, $count );
if ( strstr( $meta['media'], home_url() ) ) {
$shortcode = sprintf( '[%s src="%s"]', $type, $meta['media'] );
} elseif ( 0 === strpos( $meta[$type], 'http' ) ) {
$post->split_content = str_replace( $meta[$type], '', $post->post_content, $count );
if ( strstr( $meta[$type], home_url() ) ) {
$shortcode = sprintf( '[%s src="%s"]', $type, $meta[$type] );
} else {
$post->format_content = $wp_embed->autoembed( $meta['media'] );
$post->format_content = $wp_embed->autoembed( $meta[$type] );
return $post->format_content;
}
}

View File

@ -84,7 +84,10 @@ function get_post_format_meta( $post_id = 0 ) {
'quote' => '',
'quote_source' => '',
'url' => '',
'media' => '',
'image' => '',
'gallery' => '',
'audio' => '',
'video' => '',
);
foreach ( $values as $key => $value )
@ -351,13 +354,17 @@ function post_formats_compat( $content, $id = 0 ) {
case 'video':
case 'audio':
if ( ! has_shortcode( $post->post_content, $format ) && ! empty( $meta['media'] ) ) {
if ( ! has_shortcode( $post->post_content, $format ) && ! empty( $meta[$format] ) ) {
// the metadata is an attachment ID
if ( is_numeric( $meta[$format] ) ) {
$url = wp_get_attachment_url( $meta[$format] );
$format_output .= sprintf( '[%s src="%s"]', $format, $url );
// the metadata is a shortcode or an embed code
if ( preg_match( '/' . get_shortcode_regex() . '/s', $meta['media'] ) || preg_match( '#<[^>]+>#', $meta['media'] ) ) {
$format_output .= $meta['media'];
} elseif ( ! stristr( $content, $meta['media'] ) ) {
} elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $meta[$format] ) || preg_match( '#<[^>]+>#', $meta[$format] ) ) {
$format_output .= $meta[$format];
} elseif ( ! stristr( $content, $meta[$format] ) ) {
// attempt to embed the URL
$format_output .= sprintf( '[embed]%s[/embed]', $meta['media'] );
$format_output .= sprintf( '[embed]%s[/embed]', $meta[$format] );
}
}
break;