WordPress.org

Make WordPress Core

Ticket #19570: 19570.15.diff

File 19570.15.diff, 19.2 KB (added by lessbloat, 5 years ago)
  • wp-includes/post-formats.php

     
    8484                'quote'        => '',
    8585                'quote_source' => '',
    8686                'url'          => '',
    87                 'media'        => '',
     87                'image'        => '',
     88                'gallery'      => '',
     89                'audio'        => '',
     90                'video'        => '',
    8891        );
    8992
    9093        foreach ( $values as $key => $value )
     
    355358                case 'video':
    356359                case 'audio':
    357360                        if ( ! has_shortcode( $post->post_content, $format ) && ! empty( $meta['media'] ) ) {
     361                                // the metadata is an attachment ID
     362                                if ( is_numeric( $meta['media'] ) ) {
     363                                        $url = wp_get_attachment_url( $meta['media'] );
     364                                        $format_output .= sprintf( '[%s src="%s"]', $format, $url );
    358365                                // the metadata is a shortcode or an embed code
    359                                 if ( preg_match( '/' . get_shortcode_regex() . '/s', $meta['media'] ) || preg_match( '#<[^>]+>#', $meta['media'] ) ) {
     366                                } elseif ( preg_match( '/' . get_shortcode_regex() . '/s', $meta['media'] ) || preg_match( '#<[^>]+>#', $meta['media'] ) ) {
    360367                                        $format_output .= $meta['media'];
    361368                                } elseif ( ! stristr( $content, $meta['media'] ) ) {
    362369                                        // attempt to embed the URL
  • wp-admin/includes/post.php

     
    200200                update_post_meta( $post_ID, '_wp_format_url', wp_slash( esc_url_raw( wp_unslash( $post_data['_wp_format_url'] ) ) ) );
    201201        }
    202202
    203         $format_keys = array( 'quote', 'quote_source', 'image', 'gallery', 'media' );
     203        $format_keys = array( 'quote', 'quote_source', 'image', 'gallery', 'image', 'gallery', 'audio', 'video' );
    204204
    205205        foreach ( $format_keys as $key ) {
    206206                if ( isset( $post_data[ '_wp_format_' . $key ] ) )
  • wp-admin/js/post-formats.js

     
    1 (function($){
     1window.wp = window.wp || {};
    22
     3(function($) {
     4        var mediaFrame, lastMimeType, lastMenu, mediaPreview;
     5
    36        // Post formats selection
    4         $('.post-format-select a').on( 'click.post-format', function(e) {
    5                 var $this = $(this),
    6                         editor,
    7                         body,
     7        $('.post-format-options a').on( 'click', function(e){
     8                var $this = $(this), editor, body,
     9                        parent = $this.parent(),
    810                        format = $this.data('wp-format'),
    9                         container = $('#post-body-content');
     11                        container = $('#post-body-content'),
     12                        description = $('.post-format-description');
    1013
    11                 $('.post-format-select a.nav-tab-active').removeClass('nav-tab-active');
    12                 $this.addClass('nav-tab-active').blur();
     14                parent.find('a.active').removeClass('active');
     15                $this.addClass('active');
     16                $('#icon-edit').removeClass(postFormats.currentPostFormat).addClass(format);
    1317                $('#post_format').val(format);
    1418
    1519                container.get(0).className = container.get(0).className.replace( /\bwp-format-[^ ]+/, '' );
    1620                container.addClass('wp-format-' + format);
     21                $('#title').focus();
    1722
     23                // Update description line
     24                description.html($this.data('description'));
     25
     26                if (description.not(':visible'))
     27                        description.slideDown('fast');
     28
    1829                if ( typeof tinymce != 'undefined' ) {
    1930                        editor = tinymce.get('content');
    2031
     
    2536                        }
    2637                }
    2738
     39                postFormats.currentPostFormat = format;
     40
    2841                e.preventDefault();
     42        }).on('mouseenter focusin', function () {
     43                $('.post-format-tip').html( $(this).prop('title') );
     44        }).on('mouseleave focusout', function () {
     45                $('.post-format-tip').html( $('.post-format-options a.active').prop('title') );
    2946        });
    3047
    31 })(jQuery);
     48        function editPreview(format) {
     49                return '<a class="edit-format-preview" data-format="' + format + '" href="#">Update Media</a>';
     50        }
     51
     52        $('.post-formats-fields').on( 'click', '.edit-format-preview', function (e) {
     53                e.preventDefault();
     54                var elem = $(e.currentTarget);
     55
     56                if ( elem.data('format') )
     57                        $( '.wp-format-' + elem.data('format') + ' .wp-format-media-holder' ).addClass('empty').show();
     58        });
     59
     60        $('.wp-format-media-metaedit').click(function (e) {
     61                e.preventDefault();
     62
     63                var elem = $(e.currentTarget), format, lastType, field,
     64                        format = elem.parent().data('format'),
     65                        field = $('#wp_format_' + format),
     66                        lastType = field.prop('type');
     67
     68                field.prop('type', 'hidden' === lastType ? 'text' : 'hidden');
     69        });
     70
     71        // Media selection
     72        $('.wp-format-media-select').click(function (event) {
     73                event.preventDefault();
     74                var $el = $(this), $holder, $field, mime = 'image', menu = '',
     75                        $holder = $el.closest('.wp-format-media-holder'),
     76                        $field = $( '#wp_format_' + $holder.data('format') );
     77
     78                switch ( $holder.data('format') ) {
     79                        case 'gallery':
     80                                menu = 'main-gallery';
     81                                break;
     82                        case 'audio':
     83                                mime = 'audio';
     84                                break;
     85                        case 'video':
     86                                mime = 'video';
     87                                break;
     88                }
     89
     90                if ( $('.wp-format-' + $holder.data('format') + ' .edit-format-preview').length )
     91                        $holder.hide();
     92
     93                // If the media frame already exists, reopen it.
     94                if ( mediaFrame && lastMimeType === mime && lastMenu === menu ) {
     95                        mediaFrame.open();
     96                        return;
     97                }
     98
     99                lastMimeType = mime;
     100                lastMenu = menu;
     101
     102                // Create the media frame.
     103                mediaFrame = wp.media.frames.formatMedia = wp.media({
     104                        // Set the title of the modal.
     105                        title: $el.data('choose'),
     106
     107                        // Set the menu sidebar of the modal, if applicable
     108                        toolbar: menu,
     109
     110                        // Tell the modal to show only items matching the current mime type.
     111                        library: {
     112                                type: mime
     113                        },
     114
     115                        // Customize the submit button.
     116                        button: {
     117                                // Set the text of the button.
     118                                text: $el.data('update')
     119                        }
     120                });
     121
     122                mediaPreview = function (format, url, mime) {
     123                        $('#' + format + '-preview').remove();
     124                        $holder.before( '<div id="' + format + '-preview"><' + format + ' class="wp-' + format + '-shortcode" controls="controls" preload="none">' +
     125                                '<source type="' + mime + '" src="' + url + '" />' +
     126                                '</' + format + '> ' + editPreview(format) + '</div>' );
     127                        $('.wp-' + format + '-shortcode').mediaelementplayer();
     128                };
     129
     130                // When an image is selected, run a callback.
     131                mediaFrame.on( 'select', function () {
     132                        // Grab the selected attachment.
     133                        var attachment = mediaFrame.state().get('selection').first(), mime, url, id;
     134
     135                        id = attachment.get('id');
     136                        url = attachment.get('url');
     137                        mime = attachment.get('mime');
     138
     139                        if ( 0 === mime.indexOf('audio') ) {
     140                                $field.attr('value', id);
     141                                // show one preview at a time
     142                                mediaPreview('audio', url, mime);
     143                                // hide the upload trigger
     144                                $holder.hide();
     145                        } else if ( 0 === mime.indexOf('video') ) {
     146                                $field.attr('value', id);
     147                                // show one preview at a time
     148                                mediaPreview('video', url, mime);
     149                                // hide the upload trigger
     150                                $holder.hide();
     151                        } else if ( 0 === mime.indexOf('gallery') ) {
     152
     153                        } else {
     154                                // set the hidden input's value
     155                                $field.attr('value', id);
     156                                // Show the image in the placeholder
     157                                $el.html('<img src="' + url + '" />');
     158                                $holder.removeClass('empty').show();
     159                        }
     160                });
     161
     162                mediaFrame.open();
     163        });
     164})(jQuery);
     165 No newline at end of file
  • wp-admin/edit-form-advanced.php

     
    130130$format_class = '';
    131131if ( post_type_supports( $post_type, 'post-formats' ) ) {
    132132        wp_enqueue_script( 'post-formats' );
     133        wp_enqueue_script( 'wp-mediaelement' );
     134        wp_enqueue_style( 'wp-mediaelement' );
    133135        $post_format = get_post_format();
    134136
    135137        if ( ! $post_format )
     
    138140        $format_class = " class='wp-format-{$post_format}'";
    139141}
    140142
     143if ( post_type_supports( $post_type, 'post-formats' ) ) {
     144        $all_post_formats = array(
     145                'standard' => array (
     146                        'description' => __('Add a title and description for your post below.')
     147                ),
     148                'image' => array (
     149                        'description' => __('Select an image using the Add Media button below.')
     150                ),
     151                'gallery' => array (
     152                        'description' => __('Use the Add Media button below to select images for your gallery.')
     153                ),
     154                'link' => array (
     155                        'description' => __('Add a link URL below.')
     156                ),
     157                'video' => array (
     158                        'description' => __('Paste a video embed URL below, or click Add Media to upload a video.')
     159                ),
     160                'audio' => array (
     161                        'description' => __('Paste an audio embed URL below, or click Add Media to upload an audio file.')
     162                ),
     163                'chat' => array (
     164                        'description' => __('Paste a chat transcript below.')
     165                ),
     166                'status' => array (
     167                        'description' => __('What are you up to?  Enter your status message below.')
     168                ),
     169                'quote' => array (
     170                        'description' => __('Enter a quote below.')
     171                ),
     172                'aside' => array (
     173                        'description' => __('Enter a quick thought or side topic below.')
     174                )
     175        );
     176        $post_format_options = '';
     177
     178        foreach ( $all_post_formats as $slug => $attr ) {
     179                $class = '';
     180                if ( $post_format == $slug ) {
     181                        $class = 'class="active"';
     182                        $active_post_type_slug = $slug;
     183                        $active_post_type_label = ucfirst( $slug );
     184                        $active_post_format_description = $attr['description'];
     185                }
     186
     187                $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>';
     188        }
     189}
     190
     191$current_post_format = array( 'currentPostFormat' => esc_html( $active_post_type_slug ) );
     192wp_localize_script( 'post', 'postFormats', $current_post_format );
     193
    141194if ( post_type_supports($post_type, 'page-attributes') )
    142195        add_meta_box('pageparentdiv', 'page' == $post_type ? __('Page Attributes') : __('Attributes'), 'page_attributes_meta_box', null, 'side', 'core');
    143196
     
    337390?>
    338391
    339392<div id="poststuff">
    340 
    341 <?php
    342 if ( post_type_supports( $post_type, 'post-formats' ) ) {
    343         $all_post_formats = get_post_format_strings();
    344 
    345         echo '<h2 class="nav-tab-wrapper post-format-select">';
    346 
    347         foreach ( $all_post_formats as $slug => $label ) {
    348                 if ( $post_format == $slug )
    349                         $class = 'nav-tab nav-tab-active';
    350                 else
    351                         $class = 'nav-tab';
    352 
    353                 echo '<a class="' . $class . '" href="?format=' . $slug . '" data-wp-format="' . $slug . '">' . $label . '</a>';
    354         }
    355 
    356         echo '</h2>';
    357 }
    358 ?>
    359 
    360393<div id="post-body" class="metabox-holder columns-<?php echo 1 == get_current_screen()->get_columns() ? '1' : '2'; ?>">
    361394<div id="post-body-content"<?php echo $format_class; ?>>
    362395
     396<?php if ( ! empty( $post_format_options ) ) : ?>
     397<div class="post-format-options">
     398        <span class="post-format-tip">Standard Post</span>
     399        <?php echo $post_format_options; ?>
     400</div>
     401<div class="post-format-description"></div>
     402<?php endif; ?>
     403
    363404<?php if ( post_type_supports($post_type, 'title') ) { ?>
    364405<div id="titlediv">
    365406<div id="titlewrap">
     
    398439}
    399440
    400441// post format fields
    401 if ( post_type_supports( $post_type, 'post-formats' ) ) {
    402         $format_meta = get_post_format_meta( $post_ID );
    403 ?>
    404 <div class="post-formats-fields edit-form-section">
     442if ( post_type_supports( $post_type, 'post-formats' ) )
     443        require_once( './includes/post-formats.php' );
    405444
    406 <input type="hidden" name="post_format" id="post_format" value="<?php echo esc_attr( $post_format ); ?>" />
    407 
    408 <div class="field wp-format-quote">
    409         <label for="_wp_format_quote" class="screen-reader-text"><?php _e( 'Quote' ); ?>:</label>
    410         <textarea name="_wp_format_quote" placeholder="<?php esc_attr_e( 'Quote' ); ?>" class="widefat"><?php echo esc_textarea( $format_meta['quote'] ); ?></textarea>
    411 </div>
    412 
    413 <div class="field wp-format-quote">
    414         <label for="_wp_format_quote_source" class="screen-reader-text"><?php _e( 'Quote source' ); ?>:</label>
    415         <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" />
    416 </div>
    417 
    418 <div class="field wp-format-link wp-format-quote">
    419         <label for="_wp_format_url" class="screen-reader-text"><?php _e( 'Link URL' ); ?>:</label>
    420         <input type="text" name="_wp_format_url" value="<?php echo esc_url( $format_meta['url'] ); ?>" placeholder="<?php esc_attr_e( 'Link URL' ); ?>" class="widefat" />
    421 </div>
    422 
    423 <div class="field wp-format-audio wp-format-video">
    424         <label for="_wp_format_media" class="screen-reader-text"><?php _e( 'Embed code or URL' ); ?>:</label>
    425         <textarea name="_wp_format_media" placeholder="<?php esc_attr_e( 'Embed code or URL' ); ?>" class="widefat"><?php echo esc_textarea( $format_meta['media'] ); ?></textarea>
    426 </div>
    427 
    428 </div>
    429 <?php
    430 }
    431 
    432445if ( post_type_supports($post_type, 'editor') ) {
    433446?>
    434447<div id="postdivrich" class="postarea edit-form-section">
  • wp-admin/css/wp-admin-rtl.css

     
    2323        11.1 - Custom Fields
    2424        11.2 - Post Revisions
    2525        11.3 - Featured Images
     26        11.4 - Post Format Selection
    262712.0 - Categories
    272813.0 - Tags
    282914.0 - Media Screen
     
    967968}
    968969
    969970/*------------------------------------------------------------------------------
     971  11.4 - Post format selection
     972------------------------------------------------------------------------------*/
     973
     974.post-format-options a {
     975        border-left: 1px solid #ebebeb;
     976        border-right: none;
     977}
     978
     979.post-format-options a:first-child {
     980        -webkit-border-bottom-left-radius: 0;
     981        -webkit-border-top-left-radius: 0;
     982        border-bottom-left-radius: 0;
     983        border-top-left-radius: 0;
     984}
     985
     986.post-format-options a:last-child {
     987        -webkit-border-bottom-right-radius: 3px;
     988        -webkit-border-top-right-radius: 3px;
     989        border-bottom-right-radius: 3px;
     990        border-top-right-radius: 3px;
     991}
     992
     993.post-format-tip {
     994        float: left;
     995}
     996
     997/*------------------------------------------------------------------------------
    970998  12.0 - Categories
    971999------------------------------------------------------------------------------*/
    9721000
  • wp-admin/css/wp-admin.css

     
    2424        11.1 - Custom Fields
    2525        11.2 - Post Revisions
    2626        11.3 - Featured Images
     27        11.4 - Post Format Selection
    272812.0 - Categories
    282913.0 - Tags
    293014.0 - Media Screen
     
    31503151        display: none;
    31513152}
    31523153
     3154.wp-format-gallery .post-formats-fields,
     3155.wp-format-image .post-formats-fields,
    31533156.wp-format-link .post-formats-fields,
    31543157.wp-format-quote .post-formats-fields,
    31553158.wp-format-video .post-formats-fields,
    31563159.wp-format-audio .post-formats-fields,
     3160.wp-format-gallery .field.wp-format-gallery,
     3161.wp-format-image .field.wp-format-image,
    31573162.wp-format-chat .field.wp-format-chat,
    31583163.wp-format-link .field.wp-format-link,
    31593164.wp-format-quote .field.wp-format-quote,
     
    31733178        font-size: 1.2em;
    31743179}
    31753180
     3181.wp-format-media-holder {
     3182        overflow: hidden;
     3183        width: 300px;
     3184        height: 200px;
     3185        border: 1px dashed #dfdfdf;
     3186        background: #f5f5f5 url(../images/media-button-2x.png) no-repeat 50% 25%;
     3187}
     3188
     3189.wp-format-media-holder.empty {
     3190        height: auto;
     3191        padding: 55px 0 20px;
     3192}
     3193
     3194.wp-format-media-holder:hover {
     3195        background-color: #eee;
     3196}
     3197
     3198.has-media-preview .wp-format-media-holder,
     3199.has-media-preview audio,
     3200.has-media-preview video {
     3201        display: none;
     3202}
     3203
     3204.mejs-audio audio,
     3205.mejs-video video {
     3206        display: block;
     3207}
     3208
     3209.wp-format-media-select {
     3210        display: block;
     3211        height: 200px;
     3212        text-align: center;
     3213}
     3214
     3215.wp-format-media-select img {
     3216        max-width: 100%;
     3217        max-height: 100%;
     3218}
     3219
     3220.empty .wp-format-media-select {
     3221        height: 20px;
     3222}
     3223
     3224.empty .wp-format-media-metaedit {
     3225        height: 20px;
     3226        display: block;
     3227        text-align: center;
     3228}
     3229
     3230.edit-format-preview {
     3231        display: block;
     3232        margin: 5px 0;
     3233}
     3234
     3235#wp_format_audio, #wp_format_video {
     3236        margin-top: 10px;
     3237}
     3238
    31763239/* Post Screen */
    31773240#post-body #normal-sortables {
    31783241        min-height: 50px;
     
    40664129}
    40674130
    40684131/*------------------------------------------------------------------------------
     4132  11.4 - Post format selection
     4133------------------------------------------------------------------------------*/
     4134
     4135#icon-edit.standard {
     4136        background: url(../images/post-formats32.png) no-repeat -3px -4px;
     4137}
     4138
     4139#icon-edit.image {
     4140        background: url(../images/post-formats32.png) no-repeat  -43px -4px;
     4141}
     4142
     4143#icon-edit.gallery {
     4144        background: url(../images/post-formats32.png) no-repeat -83px -4px;
     4145}
     4146
     4147#icon-edit.audio {
     4148        background: url(../images/post-formats32.png) no-repeat -123px -4px;
     4149}
     4150
     4151#icon-edit.video {
     4152        background: url(../images/post-formats32.png) no-repeat -163px -4px;
     4153}
     4154
     4155#icon-edit.chat {
     4156        background: url(../images/post-formats32.png) no-repeat -202px -4px;
     4157}
     4158
     4159#icon-edit.status {
     4160        background: url(../images/post-formats32.png) no-repeat -242px -4px;
     4161}
     4162
     4163#icon-edit.aside {
     4164        background: url(../images/post-formats32.png) no-repeat -282px -4px;
     4165}
     4166
     4167#icon-edit.quote {
     4168        background: url(../images/post-formats32.png) no-repeat -322px -4px;
     4169}
     4170
     4171#icon-edit.link {
     4172        background: url(../images/post-formats32.png) no-repeat -362px -4px;
     4173}
     4174
     4175.post-format-description {
     4176        color: #666;
     4177        display: none;
     4178        margin: 10px 0;
     4179}
     4180
     4181.post-format-options {
     4182        height: 29px;
     4183        background: #f9f9f9;
     4184        border: 1px solid #dfdfdf;
     4185        -webkit-border-radius: 3px;
     4186        border-radius: 3px;
     4187        margin: 0 0 9px 1px;
     4188        padding: 0;
     4189}
     4190
     4191.post-format-options a {
     4192        border-right: 1px solid #ebebeb;
     4193        display: inline-block;
     4194        height: 16px;
     4195        width: 16px;
     4196        padding: 6px;
     4197        position: relative;
     4198        text-decoration: none;
     4199}
     4200
     4201.post-format-options a:first-child {
     4202        -webkit-border-bottom-left-radius: 3px;
     4203        -webkit-border-top-left-radius: 3px;
     4204        border-bottom-left-radius: 3px;
     4205        border-top-left-radius: 3px;
     4206}
     4207
     4208.post-format-options a.active,
     4209.post-format-options a:focus,
     4210.post-format-options a:hover {
     4211        background: #fff;
     4212        outline: none;
     4213        opacity: 1;
     4214}
     4215
     4216.post-format-options a div {
     4217        height: 16px;
     4218        width: 16px;
     4219        opacity: 0.4;
     4220}
     4221
     4222.post-format-options a.active div,
     4223.post-format-options a:focus div,
     4224.post-format-options a:hover div {
     4225        opacity: 1;
     4226}
     4227
     4228.post-format-options .standard {
     4229        background: url(../images/post-formats.png) no-repeat -8px -8px;
     4230}
     4231
     4232.post-format-options .image {
     4233        background: url(../images/post-formats.png) no-repeat -40px -8px;
     4234}
     4235
     4236.post-format-options .gallery {
     4237        background: url(../images/post-formats.png) no-repeat -72px -8px;
     4238}
     4239
     4240.post-format-options .audio {
     4241        background: url(../images/post-formats.png) no-repeat -104px -8px;
     4242}
     4243
     4244.post-format-options .video {
     4245        background: url(../images/post-formats.png) no-repeat -136px -8px;
     4246}
     4247
     4248.post-format-options .chat {
     4249        background: url(../images/post-formats.png) no-repeat -168px -8px;
     4250}
     4251
     4252.post-format-options .status {
     4253        background: url(../images/post-formats.png) no-repeat -200px -8px;
     4254}
     4255
     4256.post-format-options .aside {
     4257        background: url(../images/post-formats.png) no-repeat -232px -8px;
     4258}
     4259
     4260.post-format-options .quote {
     4261        background: url(../images/post-formats.png) no-repeat -264px -8px;
     4262}
     4263
     4264.post-format-options .link {
     4265        background: url(../images/post-formats.png) no-repeat -296px -8px;
     4266}
     4267
     4268.post-format-tip {
     4269        color: #999;
     4270        font-size: 14px;
     4271        float: right;
     4272        padding: 6px 10px;
     4273        text-transform: capitalize;
     4274}
     4275
     4276/*------------------------------------------------------------------------------
    40694277  12.0 - Categories
    40704278------------------------------------------------------------------------------*/
    40714279