WordPress.org
Get WordPress

Make WordPress Core

Ticket #54426: 54426.4.diff

File 54426.4.diff, 4.3 KB (added by pbiron, 3 years ago)

  • src/js/_enqueues/admin/media.js 

    From 92fcdc69a977837827ef897fbfa8ca79343ca636 Mon Sep 17 00:00:00 2001
From: Paul Biron <paul@sparrowhawkcomputing.com>
Date: Sat, 4 Dec 2021 09:32:12 -0700
Subject: [PATCH] Add a "Copy URL to clipboard" row action in Media >
 Library...similar to the button on the Edit Media screen.

---
 src/js/_enqueues/admin/media.js               | 36 ++++++++++++++++++-
 .../includes/class-wp-media-list-table.php    |  9 +++++
 src/wp-includes/script-loader.php             |  2 +-
 3 files changed, 45 insertions(+), 2 deletions(-)

diff --git a/src/js/_enqueues/admin/media.js b/src/js/_enqueues/admin/media.js
index 13d46e485b..feae563816 100644
    a b  
    141141         * @return {void}
    142142         */
    143143        $( function() {
    144                 var settings, $mediaGridWrap = $( '#wp-media-grid' );
     144                var settings,
     145                        $mediaGridWrap             = $( '#wp-media-grid' ),
     146                        copyAttachmentURLClipboard = new ClipboardJS( '.copy-attachment-url.media-library' ),
     147                        copyAttachmentURLSuccessTimeout;
    145148
    146149                // Opens a manage media frame into the grid.
    147150                if ( $mediaGridWrap.length && window.wp && window.wp.media ) {
    … …  
    205208                $( '.find-box-inside' ).on( 'click', 'tr', function() {
    206209                        $( this ).find( '.found-radio input' ).prop( 'checked', true );
    207210                });
     211
     212                /**
     213                 * Handles media list copy media URL button.
     214                 *
     215                 * @since 6.0
     216                 *
     217                 * @param {MouseEvent} event A click event.
     218                 * @return {void}
     219                 */
     220                copyAttachmentURLClipboard.on( 'success', function( event ) {
     221                        var triggerElement = $( event.trigger ),
     222                                successElement = $( '.success', triggerElement.closest( '.copy-to-clipboard-container' ) );
     223       
     224                        // Clear the selection and move focus back to the trigger.
     225                        event.clearSelection();
     226                        // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680
     227                        triggerElement.trigger( 'focus' );
     228       
     229                        // Show success visual feedback.
     230                        clearTimeout( copyAttachmentURLSuccessTimeout );
     231                        successElement.removeClass( 'hidden' );
     232       
     233                        // Hide success visual feedback after 3 seconds since last success and unfocus the trigger.
     234                        copyAttachmentURLSuccessTimeout = setTimeout( function() {
     235                                successElement.addClass( 'hidden' );
     236                                triggerElement.trigger( 'blur' );
     237                        }, 3000 );
     238       
     239                        // Handle success audible feedback.
     240                        wp.a11y.speak( wp.i18n.__( 'The file URL has been copied to your clipboard' ) );
     241                } );
    208242        });
    209243})( jQuery );

  • src/wp-admin/includes/class-wp-media-list-table.php 

    diff --git a/src/wp-admin/includes/class-wp-media-list-table.php b/src/wp-admin/includes/class-wp-media-list-table.php
index d425bccfbf..030e2ada99 100644
    a b class WP_Media_List_Table extends WP_List_Table { 
    806806                                        esc_attr( sprintf( __( 'View &#8220;%s&#8221;' ), $att_title ) ),
    807807                                        __( 'View' )
    808808                                );
     809
     810                                $actions['copy'] = sprintf(
     811                                        '<span class="copy-to-clipboard-container" style="display: inline;"><button type="button" class="button-link copy-attachment-url media-library" data-clipboard-text="%s" aria-label="%s">%s</button><span class="success hidden" aria-hidden="true">%s</span></span>',
     812                                        esc_url( wp_get_attachment_url( $post->ID ) ),
     813                                        /* translators: %s: Attachment title. */
     814                                        esc_attr( sprintf( __( 'Copy &#8220;%s&#8221; URL to clipboard' ), $att_title ) ),
     815                                        __( 'Copy URL to clipboard' ),
     816                                        __( 'Copied!' )
     817                                );
    809818                        }
    810819                }
    811820

  • src/wp-includes/script-loader.php 

    diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php
index 8313088e67..3322406d8c 100644
    a b function wp_default_scripts( $scripts ) { 
    13511351                $scripts->add( 'list-revisions', "/wp-includes/js/wp-list-revisions$suffix.js" );
    13521352
    13531353                $scripts->add( 'media-grid', "/wp-includes/js/media-grid$suffix.js", array( 'media-editor' ), false, 1 );
    1354                 $scripts->add( 'media', "/wp-admin/js/media$suffix.js", array( 'jquery' ), false, 1 );
     1354                $scripts->add( 'media', "/wp-admin/js/media$suffix.js", array( 'jquery', 'clipboard', 'wp-i18n', 'wp-a11y' ), false, 1 );
    13551355                $scripts->set_translations( 'media' );
    13561356
    13571357                $scripts->add( 'image-edit', "/wp-admin/js/image-edit$suffix.js", array( 'jquery', 'jquery-ui-core', 'json2', 'imgareaselect', 'wp-a11y' ), false, 1 );