WordPress.org

Make WordPress Core

Ticket #38342: 38342.13.diff

File 38342.13.diff, 18.9 KB (added by joehoyle, 4 years ago)
  • src/wp-admin/css/dashboard.css

    diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css
    index 72b0230..3ef5d82 100644
    a b form.initial-form.quickpress-open input#title { 
    518518        resize: none;
    519519}
    520520
     521#quick-press.is-saving .spinner {
     522        visibility: inherit;
     523}
     524
    521525/* Dashboard Quick Draft - Drafts list */
    522526
    523527.js #dashboard_quick_press .drafts {
    form.initial-form.quickpress-open input#title { 
    541545        margin: 0 12px;
    542546}
    543547
     548#dashboard_quick_press .drafts ul.is-placeholder li {
     549        padding: 3px 0;
     550        color: transparent;
     551}
     552
     553@keyframes loading-fade {
     554        0% { opacity: .5; }
     555        50% { opacity: 1; }
     556        100% { opacity: .5; }
     557}
     558
     559#dashboard_quick_press .drafts ul.is-placeholder li:before,
     560#dashboard_quick_press .drafts ul.is-placeholder li:after {
     561        content: '';
     562        display: block;
     563        height: 13px;
     564        background: #eee;
     565        animation: loading-fade 1.6s ease-in-out infinite;
     566}
     567
     568#dashboard_quick_press .drafts ul.is-placeholder li:before {
     569        margin-bottom: 5px;
     570        width: 40%;
     571}
     572
     573#dashboard_quick_press .drafts ul.is-placeholder li:after {
     574        width: 80%;
     575}
     576
    544577#dashboard_quick_press .drafts li {
    545578        margin-bottom: 1em;
    546579}
     580
     581#dashboard_quick_press .drafts li.is-new {
     582        background-color: #fffbe5;
     583}
     584
    547585#dashboard_quick_press .drafts li time {
    548586        color: #72777c;
    549587}
  • src/wp-admin/includes/dashboard.php

    diff --git a/src/wp-admin/includes/dashboard.php b/src/wp-admin/includes/dashboard.php
    index 0ecf0a2..805798b 100644
    a b function wp_dashboard_setup() { 
    5050        if ( is_blog_admin() && current_user_can( get_post_type_object( 'post' )->cap->create_posts ) ) {
    5151                $quick_draft_title = sprintf( '<span class="hide-if-no-js">%1$s</span> <span class="hide-if-js">%2$s</span>', __( 'Quick Draft' ), __( 'Drafts' ) );
    5252                wp_add_dashboard_widget( 'dashboard_quick_press', $quick_draft_title, 'wp_dashboard_quick_press' );
     53                add_action( 'admin_footer', 'wp_dashboard_print_recent_drafts_template' );
    5354        }
    5455
    5556        // WordPress News
    function wp_dashboard_quick_press( $error_msg = false ) { 
    494495        $post_ID = (int) $post->ID;
    495496?>
    496497
    497         <form name="post" action="<?php echo esc_url( admin_url( 'post.php' ) ); ?>" method="post" id="quick-press" class="initial-form hide-if-no-js">
    498 
    499                 <?php if ( $error_msg ) : ?>
    500                 <div class="error"><?php echo $error_msg; ?></div>
    501                 <?php endif; ?>
     498        <form name="post" method="post" id="quick-press" class="initial-form hide-if-no-js">
    502499
    503500                <div class="input-text-wrap" id="title-wrap">
    504                         <label class="screen-reader-text prompt" for="title" id="title-prompt-text">
     501                        <label class="prompt" for="title" id="title-prompt-text">
    505502
    506503                                <?php
    507504                                /** This filter is documented in wp-admin/edit-form-advanced.php */
    508505                                echo apply_filters( 'enter_title_here', __( 'Title' ), $post );
    509506                                ?>
    510507                        </label>
    511                         <input type="text" name="post_title" id="title" autocomplete="off" />
     508                        <input type="text" name="title" id="title" autocomplete="off" />
    512509                </div>
    513510
    514511                <div class="textarea-wrap" id="description-wrap">
    515                         <label class="screen-reader-text prompt" for="content" id="content-prompt-text"><?php _e( 'What&#8217;s on your mind?' ); ?></label>
     512                        <label class="prompt" for="content" id="content-prompt-text"><?php _e( 'What&#8217;s on your mind?' ); ?></label>
    516513                        <textarea name="content" id="content" class="mceEditor" rows="3" cols="15" autocomplete="off"></textarea>
    517514                </div>
    518 
    519515                <p class="submit">
    520                         <input type="hidden" name="action" id="quickpost-action" value="post-quickdraft-save" />
    521                         <input type="hidden" name="post_ID" value="<?php echo $post_ID; ?>" />
    522                         <input type="hidden" name="post_type" value="post" />
    523                         <?php wp_nonce_field( 'add-post' ); ?>
     516                        <div class="error inline" style="display: none;"><p></p></div>
     517                        <div class="spinner no-float"></div>
    524518                        <?php submit_button( __( 'Save Draft' ), 'primary', 'save', false, array( 'id' => 'save-post' ) ); ?>
    525519                        <br class="clear" />
    526520                </p>
    527521
    528522        </form>
     523        <div id="quick-press-drafts" class="drafts">
     524                <p class="view-all" style="display: none;">
     525                        <a href="<?php echo esc_url( admin_url( 'edit.php?post_status=draft' ) ) ?>" aria-label="<?php esc_attr_e( 'View all drafts' ) ?>"><?php _ex( 'View all', 'drafts' ) ?></a>
     526                </p>
     527                <h2 class="hide-if-no-js"><?php esc_html_e( 'Drafts' ) ?></h2>
     528                <ul class="drafts-list is-placeholder">
     529                        <li><span class="screen-reader-text"><?php esc_html_e( 'Loading…' ) ?></span></li>
     530                </ul>
     531        </div>
    529532        <?php
    530         wp_dashboard_recent_drafts();
    531533}
    532534
    533535/**
    534536 * Show recent drafts of the user on the dashboard.
    535537 *
    536538 * @since 2.7.0
     539 * @deprecated 4.7
    537540 *
    538541 * @param array $drafts
    539542 */
    function wp_dashboard_recent_drafts( $drafts = false ) { 
    548551                        'order'          => 'DESC'
    549552                );
    550553
    551                 /**
    552                  * Filters the post query arguments for the 'Recent Drafts' dashboard widget.
    553                  *
    554                  * @since 4.4.0
    555                  *
    556                  * @param array $query_args The query arguments for the 'Recent Drafts' dashboard widget.
    557                  */
     554                /** This filter is documented in wp-includes/rest-api.php */
    558555                $query_args = apply_filters( 'dashboard_recent_drafts_query_args', $query_args );
    559556
    560557                $drafts = get_posts( $query_args );
    function wp_dashboard_recent_drafts( $drafts = false ) { 
    586583}
    587584
    588585/**
     586 * Get the HTML template for the Quick Draft recent posts.
     587 *
     588 * @since 4.7.0
     589 *
     590 * @return string The template HTML.
     591 */
     592function wp_dashboard_print_recent_drafts_template() {
     593        ?>
     594        <script id="tmpl-item-quick-press-draft" type="text/template">
     595                <div class="draft-title">
     596                        <a href="post.php?post={{ data.id }}&action=edit" aria-label="<?php esc_attr_e( 'Edit Post' ) ?>">{{ data.formattedTitle }}</a>
     597                        <time datetime="{{ data.date }}">{{ data.formattedDate }}</time>
     598                </div>
     599                {{{ data.formattedContent }}}
     600        </script>
     601        <?php
     602}
     603
     604/**
    589605 * Outputs a row for the Recent Comments widget.
    590606 *
    591607 * @access private
  • src/wp-admin/js/dashboard.js

    diff --git a/src/wp-admin/js/dashboard.js b/src/wp-admin/js/dashboard.js
    index fa100dd..7fbdec6 100644
    a b  
    1 /* global pagenow, ajaxurl, postboxes, wpActiveEditor:true */
    2 var ajaxWidgets, ajaxPopulateWidgets, quickPressLoad;
     1/* global _, wp, quickPress, pagenow, ajaxurl, postboxes, wpActiveEditor:true */
     2var ajaxWidgets, ajaxPopulateWidgets, QuickPress = {};
    33
    44jQuery(document).ready( function($) {
    55        var welcomePanel = $( '#welcome-panel' ),
    jQuery(document).ready( function($) { 
    5959        };
    6060        ajaxPopulateWidgets();
    6161
    62         postboxes.add_postbox_toggles(pagenow, { pbshow: ajaxPopulateWidgets } );
    63 
    64         /* QuickPress */
    65         quickPressLoad = function() {
    66                 var act = $('#quickpost-action'), t;
    67 
    68                 $( '#quick-press .submit input[type="submit"], #quick-press .submit input[type="reset"]' ).prop( 'disabled' , false );
    69 
    70                 t = $('#quick-press').submit( function( e ) {
    71                         e.preventDefault();
    72                         $('#dashboard_quick_press #publishing-action .spinner').show();
    73                         $('#quick-press .submit input[type="submit"], #quick-press .submit input[type="reset"]').prop('disabled', true);
    74 
    75                         $.post( t.attr( 'action' ), t.serializeArray(), function( data ) {
    76                                 // Replace the form, and prepend the published post.
    77                                 $('#dashboard_quick_press .inside').html( data );
    78                                 $('#quick-press').removeClass('initial-form');
    79                                 quickPressLoad();
    80                                 highlightLatestPost();
    81                                 $('#title').focus();
    82                         });
    83 
    84                         function highlightLatestPost () {
    85                                 var latestPost = $('.drafts ul li').first();
    86                                 latestPost.css('background', '#fffbe5');
    87                                 setTimeout(function () {
    88                                         latestPost.css('background', 'none');
    89                                 }, 1000);
    90                         }
    91                 } );
    92 
    93                 $('#publish').click( function() { act.val( 'post-quickpress-publish' ); } );
    94 
    95                 $('#title, #tags-input, #content').each( function() {
    96                         var input = $(this), prompt = $('#' + this.id + '-prompt-text');
    97 
    98                         if ( '' === this.value ) {
    99                                 prompt.removeClass('screen-reader-text');
    100                         }
    101 
    102                         prompt.click( function() {
    103                                 $(this).addClass('screen-reader-text');
    104                                 input.focus();
    105                         });
    106 
    107                         input.blur( function() {
    108                                 if ( '' === this.value ) {
    109                                         prompt.removeClass('screen-reader-text');
    110                                 }
    111                         });
    112 
    113                         input.focus( function() {
    114                                 prompt.addClass('screen-reader-text');
    115                         });
    116                 });
    117 
    118                 $('#quick-press').on( 'click focusin', function() {
    119                         wpActiveEditor = 'content';
    120                 });
     62        postboxes.add_postbox_toggles(pagenow, { pbshow: function( id ) {
     63                ajaxPopulateWidgets();
    12164
    122                 autoResizeTextarea();
    123         };
    124         quickPressLoad();
     65                if ( 'dashboard_quick_press' === id ) {
     66                        QuickPress.init();
     67                }
     68        } } );
    12569
    12670        $( '.meta-box-sortables' ).sortable( 'option', 'containment', '#wpwrap' );
    12771
    jQuery(document).ready( function($) { 
    186130                });
    187131        }
    188132
     133        autoResizeTextarea();
     134
     135        if ( jQuery( '#dashboard_quick_press' ).is( ':visible' ) ) {
     136                QuickPress.init();
     137        }
     138});
     139
     140/**
     141 * Collections
     142 */
     143
     144QuickPress.Views = {};
     145
     146QuickPress.Views.Form = wp.Backbone.View.extend( {
     147        events: {
     148                'click :input': 'hidePromptAndFocus',
     149                'focus :input': 'hidePrompt',
     150                'blur :input': 'showPrompt',
     151                reset: 'showAllPrompts',
     152                click: 'setActiveEditor',
     153                focusin: 'setActiveEditor',
     154                submit: 'submit'
     155        },
     156
     157        initialize: function() {
     158                this.showAllPrompts();
     159
     160                this.listenTo( this.model, 'invalid', this.render );
     161                this.listenTo( this.model, 'error', this.showSyncError );
     162        },
     163
     164        togglePrompt: function( element, visible ) {
     165                var $input = jQuery( element ),
     166                        hasContent = $input.val().length > 0;
     167
     168                jQuery( element ).siblings( '.prompt' ).toggleClass( 'screen-reader-text', ! visible || hasContent );
     169        },
     170
     171        showAllPrompts: function() {
     172                this.$el.find( ':input' ).each( _.bind( function( i, input ) {
     173                        // Prompt toggling must be deferred because the reset event is
     174                        // fired before the input values have been cleared
     175                        _.defer( _.bind( this.togglePrompt, this, input, true ) );
     176                }, this ) );
     177        },
     178
     179        showPrompt: function( event ) {
     180                this.togglePrompt( event.target, true );
     181        },
     182
     183        hidePrompt: function( event ) {
     184                this.togglePrompt( event.target, false );
     185        },
     186
     187        hidePromptAndFocus: function( event ) {
     188                this.togglePrompt( event.target, false );
     189                jQuery( ':input', event.target ).focus();
     190        },
     191
     192        setActiveEditor: function() {
     193                wpActiveEditor = 'content';
     194        },
     195
     196        showSyncError: function( model, error ) {
     197                try {
     198                        this.syncError = JSON.parse( error.responseText ).message;
     199                } catch( e ) {
     200                        this.syncError = quickPress.l10n.error;
     201                }
     202
     203                this.render();
     204        },
     205
     206        submit: function( event ) {
     207                var values;
     208
     209                delete this.syncError;
     210                event.preventDefault();
     211
     212                // jQuery's serializeArray returns an array of field tuples, which
     213                // we need to transform into an object before sending to API
     214                values = _.reduce( this.$el.serializeArray(), function( memo, field ) {
     215                        memo[ field.name ] = field.value;
     216                        return memo;
     217                }, {} );
     218
     219                // Ensure that by setting these fields on model that it is valid
     220                // before proceeding with save
     221                this.model.set( values );
     222                if ( ! this.model.isValid() ) {
     223                        return;
     224                }
     225
     226                // Show a spinner during the callback.
     227                this.$el.addClass( 'is-saving' );
     228
     229                this.model.save()
     230                        .always( _.bind( function() {
     231                                this.$el.removeClass( 'is-saving' );
     232                        }, this ) )
     233                        .success( _.bind( function() {
     234                                this.collection.add( this.model, { at: 0 } );
     235                                this.model = new wp.api.models.Post();
     236                                this.el.reset();
     237                        }, this ) );
     238        },
     239
     240        render: function() {
     241                var $error = this.$el.find( '.error' ),
     242                        errorText;
     243
     244                if ( this.syncError ) {
     245                        // Error via API save failure
     246                        errorText = this.syncError;
     247                }
     248
     249                // Error notice is only visible if error text determined
     250                $error.toggle( !! errorText );
     251                if ( errorText ) {
     252                        $error.html( jQuery( '<p />', { text: errorText } ) );
     253                }
     254        }
     255} );
     256
     257QuickPress.Views.DraftList = wp.Backbone.View.extend( {
     258
     259        initialize: function() {
     260                this.listenTo( this.collection, 'sync', this.onDraftsLoaded );
     261        },
     262
     263        onDraftsLoaded: function() {
     264                this.listenTo( this.collection, 'add', this.renderNew );
     265                this.render();
     266        },
     267
     268        renderNew: function() {
     269                // Display highlight effect to first (added) item for one second
     270                var $newEl = this.render().$el.find( 'li:first' ).addClass( 'is-new' );
     271                setTimeout( function() {
     272                        $newEl.removeClass( 'is-new' );
     273                }, 1000 );
     274        },
     275
     276        render: function() {
     277                // Hide drafts list if no drafts exist
     278                this.$el.toggle( this.collection.length > 0 );
     279
     280                // "View All" link is visible if 5 or more drafts, since we only
     281                // show a maximum of 5 drafts in the list
     282                this.$el.find( '.view-all' ).toggle( this.collection.length > 0 );
     283
     284                // If after drafts load, this could be the first render, so remove
     285                // placeholder effect and render the first four drafts
     286                this.$el.find( '.drafts-list' )
     287                        .removeClass( 'is-placeholder' )
     288                        .html( _.map( this.collection.models, function( draft ) {
     289                                return new QuickPress.Views.DraftListItem( {
     290                                        model: draft
     291                                } ).render().el;
     292                        } ) );
     293
     294                return this;
     295        }
     296} );
     297
     298QuickPress.Views.DraftListItem = wp.Backbone.View.extend( {
     299        tagName: 'li',
     300
     301        template: wp.template( 'item-quick-press-draft' ),
     302
     303        render: function() {
     304                var attributes = _.clone( this.model.attributes );
     305                attributes.formattedContent = wp.formatting.trimWords( attributes.content.rendered, 10 );
     306                attributes.formattedTitle = attributes.title.rendered.length > 0 ? attributes.title.rendered.length : quickPress.l10n.no_title;
     307                // We can format dates using newer browser i18n features, but also
     308                // provide a fallback to the not-as-nice Date#toLocaleDateString
     309                date = new Date( wp.api.utils.parseISO8601( attributes.date + quickPress.timezoneOffset ) );
     310                if ( 'undefined' !== typeof Intl && Intl.DateTimeFormat ) {
     311                        attributes.formattedDate = new Intl.DateTimeFormat( undefined, {
     312                                month: 'long',
     313                                day: 'numeric',
     314                                year: 'numeric'
     315                        } ).format( date );
     316                } else {
     317                        attributes.formattedDate = date.toLocaleDateString();
     318                }
     319
     320                this.$el.html( this.template( attributes ) );
     321
     322                return this;
     323        }
    189324} );
     325
     326QuickPress.init = function() {
     327        wp.api.loadPromise.done( function() {
     328                // Fetch drafts
     329                draftsCollection = new wp.api.collections.Posts();
     330                draftsCollection.fetch( {
     331                        data: {
     332                                status: 'draft',
     333                                author: quickPress.currentUserId,
     334                                per_page: 4,
     335                                order_by: 'date',
     336                                'quick-draft-post-list': true
     337                        }
     338                } );
     339
     340                // Drafts list is initialized but not rendered until drafts load
     341                new QuickPress.Views.DraftList( {
     342                        el: '#quick-press-drafts',
     343                        collection: draftsCollection
     344                } );
     345
     346                new QuickPress.Views.Form( {
     347                        el: '#quick-press',
     348                        model: new wp.api.models.Post(),
     349                        collection: draftsCollection
     350                } ).render();
     351        })
     352}
  • src/wp-includes/js/wp-util.js

    diff --git a/src/wp-includes/js/wp-util.js b/src/wp-includes/js/wp-util.js
    index 527441d..79ab07e 100644
    a b window.wp = window.wp || {}; 
    121121                }
    122122        };
    123123
     124        // wp.formatting
     125        // ------
     126        //
     127        // Tools for formatting strings
     128        wp.formatting = {
     129                settings: settings.formatting || {},
     130
     131                /**
     132                 * Trims text to a certain number of words.
     133                 *
     134                 * @see wp_trim_words
     135                 *
     136                 * @param  {string}  text     Text to trim.
     137                 * @param  {?number} numWords Number of words (default: 55).
     138                 * @param  {?string} more     What to append if text needs to be trimmed (default: '…').
     139                 * @return {string}           Trimmed text.
     140                 */
     141                trimWords: function( text, numWords, more ) {
     142                        var words, separator;
     143
     144                        if ( 'undefined' === typeof numWords ) {
     145                                numWords = 55;
     146                        }
     147
     148                        if ( 'undefined' === typeof more ) {
     149                                more = wp.formatting.settings.trimWordsMore;
     150                        }
     151
     152                        text = text.replace( /[\n\r\t ]+/g, ' ' ).replace( /^ | $/g, '' );
     153
     154                        if ( wp.formatting.settings.trimWordsByCharacter ) {
     155                                separator = '';
     156                        } else {
     157                                separator = ' ';
     158                        }
     159
     160                        words = text.split( separator );
     161
     162                        if ( words.length <= numWords ) {
     163                                return words.join( separator );
     164                        }
     165
     166                        return words.slice( 0, numWords ).join( separator ) + more;
     167                }
     168        };
     169
    124170}(jQuery));
  • src/wp-includes/rest-api.php

    diff --git a/src/wp-includes/rest-api.php b/src/wp-includes/rest-api.php
    index 3d0b7ee..3711e32 100644
    a b function rest_api_default_filters() { 
    164164        add_filter( 'rest_post_dispatch', 'rest_send_allow_header', 10, 3 );
    165165
    166166        add_filter( 'rest_pre_dispatch', 'rest_handle_options_request', 10, 3 );
     167
     168        // Legacy filter for Quick Draft recent posts.
     169        add_filter( 'rest_post_query', 'rest_filter_quick_draft_query', 10, 2 );
     170}
     171
     172/**
     173 * Filter query args used by he Quick Draft recent posts list.
     174 *
     175 * @param array           $args    Key value array of query var to query value.
     176 * @param WP_REST_Request $request The request used.
     177 */
     178function rest_filter_quick_draft_query( $query_args, $request ) {
     179
     180        // Only modify Quick Draft queries.
     181        $params = $request->get_query_params();
     182
     183        if ( ! isset( $params['quick-draft-post-list'] ) ) {
     184                return $query_args;
     185        }
     186
     187        /**
     188         * Filters the post query arguments for the 'Recent Drafts' dashboard widget.
     189         *
     190         * @since 4.4.0
     191         *
     192         * @param array $query_args The query arguments for the 'Recent Drafts' dashboard widget.
     193         */
     194        $query_args = apply_filters( 'dashboard_recent_drafts_query_args', $query_args );
     195
     196        return $query_args;
     197
    167198}
    168199
    169200/**
  • src/wp-includes/script-loader.php

    diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php
    index be32073..58df1ef 100644
    a b function wp_default_scripts( &$scripts ) { 
    336336                'ajax' => array(
    337337                        'url' => admin_url( 'admin-ajax.php', 'relative' ),
    338338                ),
     339                'formatting' => array(
     340                        'trimWordsMore'  => __( '&hellip;' ),
     341                        /*
     342                         * translators: If your word count is based on single characters (e.g. East Asian characters),
     343                         * enter 'characters_excluding_spaces' or 'characters_including_spaces'. Otherwise, enter 'words'.
     344                         * Do not translate into your own language.
     345                         */
     346                        'trimWordsByCharacter' => strpos( _x( 'words', 'Word count type. Do not translate!' ), 'characters' ) === 0 && preg_match( '/^utf\-?8$/i', get_option( 'blog_charset' ) ),
     347                ),
    339348        ) );
    340349
    341350        $scripts->add( 'wp-backbone', "/wp-includes/js/wp-backbone$suffix.js", array('backbone', 'wp-util'), false, 1 );
    function wp_default_scripts( &$scripts ) { 
    721730                        'current' => __( 'Current Color' ),
    722731                ) );
    723732
    724                 $scripts->add( 'dashboard', "/wp-admin/js/dashboard$suffix.js", array( 'jquery', 'admin-comments', 'postbox' ), false, 1 );
     733                $scripts->add( 'dashboard', "/wp-admin/js/dashboard$suffix.js", array( 'jquery', 'admin-comments', 'postbox', 'wp-api', 'wp-backbone' ), false, 1 );
     734                did_action( 'init' ) && $scripts->localize( 'dashboard', 'quickPress', array(
     735                        'currentUserId'  => get_current_user_id(),
     736                        'l10n' => array(
     737                                'error'      => __( 'An error has occurred. Please reload the page and try again.' ),
     738                                'no_title'   => __( '(no title)' ),
     739                        ),
     740                        'timezoneOffset' => ( get_option( 'gmt_offset' ) >= 0 ? '+' : '-' ) . date( 'H:i', abs( get_option( 'gmt_offset' ) * 3600 ) ),
     741                ) );
    725742
    726743                $scripts->add( 'list-revisions', "/wp-includes/js/wp-list-revisions$suffix.js" );
    727744