Ticket #48463: 48463.4.diff
File 48463.4.diff, 11.7 KB (added by , 5 years ago) |
---|
-
src/js/_enqueues/admin/post.js
4 4 * @output wp-admin/js/post.js 5 5 */ 6 6 7 /* global postL10n, ajaxurl, wpAjax, setPostThumbnailL10n, postboxes, pagenow, tinymce, alert, deleteUserSetting */7 /* global postL10n, ajaxurl, wpAjax, setPostThumbnailL10n, postboxes, pagenow, tinymce, alert, deleteUserSetting, ClipboardJS */ 8 8 /* global theList:true, theExtraList:true, getUserSetting, setUserSetting, commentReply, commentsBox */ 9 9 /* global WPSetThumbnailHTML, wptitlehint */ 10 10 … … 297 297 $postVisibilitySelect = $('#post-visibility-select'), 298 298 $timestampdiv = $('#timestampdiv'), 299 299 $postStatusSelect = $('#post-status-select'), 300 isMac = window.navigator.platform ? window.navigator.platform.indexOf( 'Mac' ) !== -1 : false; 300 isMac = window.navigator.platform ? window.navigator.platform.indexOf( 'Mac' ) !== -1 : false, 301 copyAttachmentURLClipboard = new ClipboardJS( '.copy-attachment-url.edit-media' ), 302 copyAttachmentURLSuccessTimeout, 303 __ = wp.i18n.__; 301 304 302 305 postboxes.add_postbox_toggles(pagenow); 303 306 … … 1217 1220 window.history.replaceState( null, null, location ); 1218 1221 }); 1219 1222 } 1220 });1221 1223 1224 /** 1225 * Copies the attachment URL in the Edit Media page to the clipboard. 1226 * 1227 * @since 5.5.0 1228 * 1229 * @param {MouseEvent} event A click event. 1230 * 1231 * @returns {void} 1232 */ 1233 copyAttachmentURLClipboard.on( 'success', function( event ) { 1234 var triggerElement = $( event.trigger ), 1235 successElement = $( '.success', triggerElement.closest( '.copy-to-clipboard-container' ) ); 1236 1237 // Clear the selection and move focus back to the trigger. 1238 event.clearSelection(); 1239 // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680 1240 triggerElement.focus(); 1241 1242 // Show success visual feedback. 1243 clearTimeout( copyAttachmentURLSuccessTimeout ); 1244 successElement.removeClass( 'hidden' ); 1245 1246 // Hide success visual feedback after 3 seconds since last success. 1247 copyAttachmentURLSuccessTimeout = setTimeout( function() { 1248 successElement.addClass( 'hidden' ); 1249 }, 3000 ); 1250 1251 // Handle success audible feedback. 1252 wp.a11y.speak( __( 'The file URL has been copied to your clipboard.' ) ); 1253 } ); 1254 } ); 1255 1222 1256 /** 1223 1257 * TinyMCE word count display 1224 1258 */ -
src/js/media/views/attachment/details.js
1 /* global ClipboardJS */ 1 2 var Attachment = wp.media.view.Attachment, 2 3 l10n = wp.media.view.l10n, 3 4 $ = jQuery, 4 Details; 5 Details, 6 __ = wp.i18n.__; 5 7 6 8 Details = Attachment.extend(/** @lends wp.media.view.Attachment.Details.prototype */{ 7 9 tagName: 'div', … … 27 29 }, 28 30 29 31 /** 32 * Copies the attachment URL to the clipboard. 33 * 34 * @since 5.5.0 35 * 36 * @param {MouseEvent} event A click event. 37 * 38 * @returns {void} 39 */ 40 copyAttachmentDetailsURLClipboard: function() { 41 var clipboard = new ClipboardJS( '.copy-attachment-url' ), 42 successTimeout; 43 44 clipboard.on( 'success', function( event ) { 45 var triggerElement = $( event.trigger ), 46 successElement = $( '.success', triggerElement.closest( '.copy-to-clipboard-container' ) ); 47 48 // Clear the selection and move focus back to the trigger. 49 event.clearSelection(); 50 // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680 51 triggerElement.focus(); 52 53 // Show success visual feedback. 54 clearTimeout( successTimeout ); 55 successElement.removeClass( 'hidden' ); 56 57 // Hide success visual feedback after 3 seconds since last success. 58 successTimeout = setTimeout( function() { 59 successElement.addClass( 'hidden' ); 60 }, 3000 ); 61 62 // Handle success audible feedback. 63 wp.a11y.speak( __( 'The file URL has been copied to your clipboard.' ) ); 64 } ); 65 }, 66 67 /** 30 68 * Shows the details of an attachment. 31 69 * 32 70 * @since 3.5.0 … … 43 81 44 82 // Call 'initialize' directly on the parent class. 45 83 Attachment.prototype.initialize.apply( this, arguments ); 84 85 this.copyAttachmentDetailsURLClipboard(); 46 86 }, 47 87 48 88 /** -
src/wp-admin/css/media.css
797 797 text-decoration: none; 798 798 } 799 799 800 .copy-to-clipboard-container { 801 display: flex; 802 align-items: center; 803 margin-top: 8px; 804 clear: both; 805 } 800 806 807 .copy-to-clipboard-container .success { 808 margin-left: 8px; 809 } 810 801 811 /*------------------------------------------------------------------------------ 802 812 14.2 - Image Editor 803 813 ------------------------------------------------------------------------------*/ … … 1215 1225 width: auto; 1216 1226 max-width: none; 1217 1227 } 1228 1229 .copy-to-clipboard-container .success { 1230 font-size: 14px; 1231 } 1218 1232 } 1219 1233 1220 1234 /** -
src/wp-admin/includes/media.php
3270 3270 <div class="misc-pub-section misc-pub-attachment"> 3271 3271 <label for="attachment_url"><?php _e( 'File URL:' ); ?></label> 3272 3272 <input type="text" class="widefat urlfield" readonly="readonly" name="attachment_url" id="attachment_url" value="<?php echo esc_attr( $att_url ); ?>" /> 3273 <span class="copy-to-clipboard-container"> 3274 <button type="button" class="button copy-attachment-url edit-media" data-clipboard-target="#attachment_url"><?php _e( 'Copy URL' ); ?></button> 3275 <span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span> 3276 </span> 3273 3277 </div> 3274 3278 <div class="misc-pub-section misc-pub-filename"> 3275 3279 <?php _e( 'File name:' ); ?> <strong><?php echo $filename; ?></strong> -
src/wp-includes/css/buttons.css
354 354 margin-bottom: 4px; 355 355 } 356 356 357 /* Copy attachment URL button in the legacy edit media page. */ 358 .wp-core-ui .copy-to-clipboard-container .copy-attachment-url { 359 margin-bottom: 0; 360 } 361 357 362 #media-upload.wp-core-ui .button { 358 363 padding: 0 10px 1px; 359 364 min-height: 24px; -
src/wp-includes/css/media-views.css
457 457 font-size: 12px; 458 458 } 459 459 460 .media-sidebar .copy-to-clipboard-container, 461 .attachment-details .copy-to-clipboard-container { 462 flex-wrap: wrap; 463 margin-top: 10px; 464 margin-left: calc( 35% - 1px ); 465 padding-top: 10px; 466 } 467 468 /* Needs high specificity. */ 469 .attachment-details .attachment-info .copy-to-clipboard-container { 470 float: none; 471 } 472 473 .media-sidebar .copy-to-clipboard-container .success, 474 .attachment-details .copy-to-clipboard-container .success { 475 padding: 0; 476 min-height: 0; 477 text-align: left; 478 } 479 460 480 .compat-item label span { 461 481 text-align: right; 462 482 } … … 2539 2559 padding: 8px 2px 2px; 2540 2560 } 2541 2561 2562 /* Needs high specificity. */ 2563 .media-sidebar .setting .copy-to-clipboard-container, 2564 .attachment-details .attachment-info .copy-to-clipboard-container { 2565 margin-left: 0; 2566 padding-top: 0; 2567 } 2568 2569 .media-sidebar .setting .copy-attachment-url, 2570 .attachment-details .attachment-info .copy-attachment-url { 2571 margin: 0 1px; 2572 } 2573 2542 2574 .media-sidebar .setting .value, 2543 2575 .attachment-details .setting .value { 2544 2576 float: none; … … 2712 2744 .media-frame-toolbar .media-toolbar { 2713 2745 bottom: -54px; 2714 2746 } 2715 }2716 2747 2717 @media screen and (max-width: 782px) {2718 2748 .mode-grid .attachments-browser .media-toolbar-primary { 2719 2749 display: block; 2720 2750 } 2751 2752 .media-sidebar .copy-to-clipboard-container .success, 2753 .attachment-details .copy-to-clipboard-container .success { 2754 font-size: 14px; 2755 line-height: 2.71428571; 2756 } 2721 2757 } 2722 2758 2723 2759 /* Responsive on portrait and landscape */ -
src/wp-includes/media-template.php
500 500 </span> 501 501 <# } #> 502 502 <span class="setting" data-setting="url"> 503 <label for="attachment-details-two-column-copy-link" class="name"><?php _e( 'Copy Link' ); ?></label> 504 <input type="text" id="attachment-details-two-column-copy-link" value="{{ data.url }}" readonly /> 503 <label for="attachment-details-two-column-copy-link" class="name"><?php _e( 'File URL:' ); ?></label> 504 <input type="text" class="attachment-details-copy-link" id="attachment-details-two-column-copy-link" value="{{ data.url }}" readonly /> 505 <span class="copy-to-clipboard-container"> 506 <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-two-column-copy-link"><?php _e( 'Copy URL' ); ?></button> 507 <span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span> 508 </span> 505 509 </span> 506 510 <div class="attachment-compat"></div> 507 511 </div> … … 687 691 <textarea id="attachment-details-description" {{ maybeReadOnly }}>{{ data.description }}</textarea> 688 692 </span> 689 693 <span class="setting" data-setting="url"> 690 <label for="attachment-details-copy-link" class="name"><?php _e( 'Copy Link' ); ?></label> 691 <input type="text" id="attachment-details-copy-link" value="{{ data.url }}" readonly /> 694 <label for="attachment-details-copy-link" class="name"><?php _e( 'File URL:' ); ?></label> 695 <input type="text" class="attachment-details-copy-link" id="attachment-details-copy-link" value="{{ data.url }}" readonly /> 696 <div class="copy-to-clipboard-container"> 697 <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-copy-link"><?php _e( 'Copy URL' ); ?></button> 698 <span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span> 699 </div> 692 700 </span> 693 701 </script> 694 702 -
src/wp-includes/script-loader.php
1241 1241 1242 1242 // To enqueue media-views or media-editor, call wp_enqueue_media(). 1243 1243 // Both rely on numerous settings, styles, and templates to operate correctly. 1244 $scripts->add( 'media-views', "/wp-includes/js/media-views$suffix.js", array( 'utils', 'media-models', 'wp-plupload', 'jquery-ui-sortable', 'wp-mediaelement', 'wp-api-request', 'wp-a11y', 'wp-i18n' ), false, 1 );1244 $scripts->add( 'media-views', "/wp-includes/js/media-views$suffix.js", array( 'utils', 'media-models', 'wp-plupload', 'jquery-ui-sortable', 'wp-mediaelement', 'wp-api-request', 'wp-a11y', 'wp-i18n', 'clipboard' ), false, 1 ); 1245 1245 $scripts->set_translations( 'media-views' ); 1246 1246 $scripts->add( 'media-editor', "/wp-includes/js/media-editor$suffix.js", array( 'shortcode', 'media-views' ), false, 1 ); 1247 1247 $scripts->add( 'media-audiovideo', "/wp-includes/js/media-audiovideo$suffix.js", array( 'media-editor' ), false, 1 ); … … 1303 1303 ) 1304 1304 ); 1305 1305 1306 $scripts->add( 'post', "/wp-admin/js/post$suffix.js", array( 'suggest', 'wp-lists', 'postbox', 'tags-box', 'underscore', 'word-count', 'wp-a11y', 'wp-sanitize' ), false, 1 );1306 $scripts->add( 'post', "/wp-admin/js/post$suffix.js", array( 'suggest', 'wp-lists', 'postbox', 'tags-box', 'underscore', 'word-count', 'wp-a11y', 'wp-sanitize', 'clipboard', 'wp-i18n' ), false, 1 ); 1307 1307 did_action( 'init' ) && $scripts->localize( 1308 1308 'post', 1309 1309 'postL10n',