WordPress.org

Make WordPress Core

Ticket #51754: 51754.7.diff

File 51754.7.diff, 6.9 KB (added by antpb, 4 months ago)

Final patch passing tests

  • src/js/_enqueues/vendor/plupload/handlers.js

     
    361361        up.removeFile( file );
    362362}
    363363
     364/**
     365 * Copies the attachment URL to the clipboard.
     366 *
     367 * @since 5.8.0
     368 *
     369 * @param {MouseEvent} event A click event.
     370 *
     371 * @return {void}
     372 */
     373function copyAttachmentUploadURLClipboard() {
     374        var clipboard = new ClipboardJS( '.copy-attachment-url' ),
     375        successTimeout;
     376        clipboard.on( 'success', function( event ) {
     377                var triggerElement = jQuery( event.trigger ),
     378                        successElement = jQuery( '.success', triggerElement.closest( '.copy-to-clipboard-container' ) );
     379                // Clear the selection and move focus back to the trigger.
     380                event.clearSelection();
     381                // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680
     382                triggerElement.trigger( 'focus' );
     383                // Show success visual feedback.
     384                clearTimeout( successTimeout );
     385                successElement.removeClass( 'hidden' );
     386                // Hide success visual feedback after 3 seconds since last success.
     387                successTimeout = setTimeout( function() {
     388                        successElement.addClass( 'hidden' );
     389                }, 3000 );
     390                // Handle success audible feedback.
     391                wp.a11y.speak( pluploadL10n.file_url_copied );
     392        } );
     393}
     394
    364395jQuery( document ).ready( function( $ ) {
     396        copyAttachmentUploadURLClipboard();
    365397        var tryAgainCount = {};
    366398        var tryAgain;
    367399
  • src/wp-admin/async-upload.php

     
    4848
    4949        switch ( $_REQUEST['fetch'] ) {
    5050                case 3:
     51                        echo '<div class="attachment-details">';
    5152                        $thumb_url = wp_get_attachment_image_src( $id, 'thumbnail', true );
    5253                        if ( $thumb_url ) {
    5354                                echo '<img class="pinkynail" src="' . esc_url( $thumb_url[0] ) . '" alt="" />';
    5455                        }
    55                         if ( current_user_can( 'edit_post', $id ) ) {
    56                                 echo '<a class="edit-attachment" href="' . esc_url( get_edit_post_link( $id ) ) . '" target="_blank">' . _x( 'Edit', 'media item' ) . '</a>';
    57                         } else {
    58                                 echo '<span class="edit-attachment">' . _x( 'Success', 'media item' ) . '</span>';
    59                         }
     56                        // Title shouldn't ever be empty, but use filename just in case.
     57                        $file    = get_attached_file( $post->ID );
     58                        $fileurl = wp_get_attachment_url( $post->ID );
     59                        $title   = $post->post_title ? $post->post_title : wp_basename( $file );
    6060
    61                         // Title shouldn't ever be empty, but use filename just in case.
    62                         $file  = get_attached_file( $post->ID );
    63                         $title = $post->post_title ? $post->post_title : wp_basename( $file );
    64                         echo '<div class="filename new"><span class="title">' . esc_html( wp_html_excerpt( $title, 60, '&hellip;' ) ) . '</span></div>';
     61                        echo '<div class="filename new"><span class="media-list-title"><strong>' . esc_html( wp_html_excerpt( $title, 60, '&hellip;' ) ) . '</strong></span> <span class="media-list-subtitle">' . basename( $file ) . '</span></div>';
     62                        echo '</div>';
     63                        ?>
     64                        <div class="attachment-tools">
     65                                <span class="media-item-copy-container copy-to-clipboard-container edit-attachment">
     66                                        <button type="button" class="button button-small copy-attachment-url" data-clipboard-text="<?php echo $fileurl; ?>"><?php _e( 'Copy URL to clipboard' ); ?></button>
     67                                        <span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span>
     68                                </span>
     69                                <?php
     70                                if ( current_user_can( 'edit_post', $id ) ) {
     71                                        echo '<a class="edit-attachment" href="' . esc_url( get_edit_post_link( $id ) ) . '" target="_blank">' . _x( 'Edit', 'media item' ) . '</a>';
     72                                } else {
     73                                        echo '<span class="edit-attachment">' . _x( 'Success', 'media item' ) . '</span>';
     74                                }
     75                                ?>
     76                        </div>
     77                        <?php
    6578                        break;
    6679                case 2:
    6780                        add_filter( 'attachment_fields_to_edit', 'media_single_attachment_fields_to_edit', 10, 2 );
  • src/wp-admin/css/media.css

     
    5151        max-width: 128px;
    5252}
    5353
     54.media-list-subtitle {
     55        display: block;
     56}
     57
     58.media-list-title {
     59        display: block;
     60}
     61
    5462#wpbody-content #async-upload-wrap a {
    5563        display: none;
    5664}
     
    96104        padding: 0 0 0 5px;
    97105}
    98106
    99 .media-item .edit-attachment,
    100107.describe-toggle-on,
    101108.describe-toggle-off {
    102109        display: block;
     
    105112        margin-right: 10px;
    106113}
    107114
     115.media-item {
     116        display: grid;
     117        grid-template-columns: repeat( 2, 1fr );
     118}
     119
     120.media-item .attachment-tools {
     121        display: flex;
     122        justify-content: flex-end;
     123        align-items: center;
     124}
     125
     126.media-item .edit-attachment {
     127        padding: 14px 0;
     128        display: block;
     129        margin-right: 10px;
     130}
     131
     132.media-item .edit-attachment.copy-to-clipboard-container {
     133        margin-top: 0;
     134}
     135
     136.media-item-copy-container .success {
     137        line-height: 0;
     138}
     139
     140.media-item button .copy-attachment-url {
     141        margin-top:14px;
     142}
     143
     144.media-item .copy-to-clipboard-container {
     145        margin-top:7px;
     146}
     147
    108148.media-item .describe-toggle-off,
    109149.media-item.open .describe-toggle-on {
    110150        display: none;
     
    115155}
    116156
    117157.media-upload-form .media-item {
    118         min-height: 36px;
     158        min-height: 70px;
    119159        margin-bottom: 1px;
    120160        position: relative;
    121161        width: 100%;
     
    132172}
    133173
    134174.media-item .filename {
    135         line-height: 2.76923076;
     175        padding: 14px 0;
    136176        overflow: hidden;
    137177        margin-left: 6px;
    138178}
     
    139179
    140180.media-item .pinkynail {
    141181        float: left;
    142         margin: 2px 10px 0 3px;
    143         max-width: 40px;
    144         max-height: 32px;
     182        margin: 0 10px 0 0;
     183        max-height: 70px;
     184        max-width: 70px;
    145185}
    146186
    147187.media-item .startopen,
  • src/wp-includes/script-loader.php

     
    883883                /* translators: %s: File name. */
    884884                'error_uploading'           => __( '&#8220;%s&#8221; has failed to upload.' ),
    885885                'unsupported_image'         => __( 'This image cannot be displayed in a web browser. For best results convert it to JPEG before uploading.' ),
     886                'file_url_copied'           => __( 'The file URL has been copied to your clipboard' ),
    886887        );
    887888
    888889        $scripts->add( 'moxiejs', "/wp-includes/js/plupload/moxie$suffix.js", array(), '1.3.5' );
     
    892893                $scripts->add( "plupload-$handle", false, array( 'plupload' ), '2.1.1' );
    893894        }
    894895
    895         $scripts->add( 'plupload-handlers', "/wp-includes/js/plupload/handlers$suffix.js", array( 'plupload', 'jquery' ) );
     896        $scripts->add( 'plupload-handlers', "/wp-includes/js/plupload/handlers$suffix.js", array( 'clipboard', 'jquery', 'plupload', 'underscore', 'wp-a11y', 'wp-i18n' ) );
    896897        did_action( 'init' ) && $scripts->localize( 'plupload-handlers', 'pluploadL10n', $uploader_l10n );
    897898
    898899        $scripts->add( 'wp-plupload', "/wp-includes/js/plupload/wp-plupload$suffix.js", array( 'plupload', 'jquery', 'json2', 'media-models' ), false, 1 );