WordPress.org

Make WordPress Core

Changeset 47572


Ignore:
Timestamp:
04/12/2020 02:24:38 PM (3 months ago)
Author:
SergeyBiryukov
Message:

Privacy: Add an indication when the Copy action in Privacy Policy Guide is complete.

This adds a "Copied!" text near the "Copy this section to clipboard" button to provide direct feedback that the action was completed.

Props garrett-eclipse, nickylimjj, xkon, desrosj, birgire.
Fixes #44588.

Location:
trunk/src
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/js/_enqueues/admin/privacy-tools.js

    r47420 r47572  
    260260    });
    261261
    262     // Privacy policy page, copy button.
     262    // Privacy Policy page, copy action.
    263263    $( document ).on( 'click', function( event ) {
    264         var $target = $( event.target );
    265         var $parent, $container, range;
     264        var $parent,
     265            $container,
     266            range,
     267            __ = wp.i18n.__,
     268            $target = $( event.target ),
     269            copiedNotice = $target.siblings( '.success' );
    266270
    267271        if ( $target.is( 'button.privacy-text-copy' ) ) {
     
    278282                        bodyPosition     = document.body.scrollTop;
    279283
     284                    // Setup copy.
    280285                    window.getSelection().removeAllRanges();
     286
     287                    // Hide tutorial content to remove from copied content.
    281288                    range = document.createRange();
    282289                    $container.addClass( 'hide-privacy-policy-tutorial' );
    283290
     291                    // Copy action.
    284292                    range.selectNodeContents( $container[0] );
    285293                    window.getSelection().addRange( range );
    286294                    document.execCommand( 'copy' );
    287295
     296                    // Reset section.
    288297                    $container.removeClass( 'hide-privacy-policy-tutorial' );
    289298                    window.getSelection().removeAllRanges();
    290299
     300                    // Return scroll position - see #49540.
    291301                    if ( documentPosition > 0 && documentPosition !== document.documentElement.scrollTop ) {
    292302                        document.documentElement.scrollTop = documentPosition;
     
    294304                        document.body.scrollTop = bodyPosition;
    295305                    }
     306
     307                    // Display and speak notice to indicate action complete.
     308                    copiedNotice.addClass( 'visible' );
     309                    wp.a11y.speak( __( 'The section has been copied to your clipboard.' ) );
     310
     311                    // Delay notice dismissal.
     312                    setTimeout( function(){ copiedNotice.removeClass( 'visible' ); }, 3000 );
    296313                } catch ( er ) {}
    297314            }
  • trunk/src/wp-admin/css/edit.css

    r47560 r47572  
    727727    line-height: 2.46153846;
    728728    padding-bottom: 6px;
     729}
     730
     731.privacy-text-actions .success {
     732    display: none;
     733    color: #40860a;
     734    float: right;
     735    padding-right: 1em;
     736}
     737
     738.privacy-text-actions .success.visible {
     739    display: inline-block;
     740    height: 32px;
    729741}
    730742
  • trunk/src/wp-admin/includes/class-wp-privacy-policy-content.php

    r47284 r47572  
    373373
    374374        $content_array = self::get_suggested_policy_text();
    375 
    376375        $content       = '';
    377376        $toc           = array( '<li><a href="#wp-privacy-policy-guide-introduction">' . __( 'Introduction' ) . '</a></li>' );
    378377        $date_format   = __( 'F j, Y' );
    379         $copy          = __( 'Copy this section to clipboard' );
    380         $return_to_top = '<a href="#" class="return-to-top">' . __( '&uarr; Return to Top' ) . '</a>';
    381378
    382379        foreach ( $content_array as $section ) {
     
    386383
    387384            if ( ! empty( $section['removed'] ) ) {
    388                 $class = ' text-removed';
     385                $class = 'text-removed';
    389386                $date  = date_i18n( $date_format, $section['removed'] );
    390387                /* translators: %s: Date of plugin deactivation. */
     
    395392                $removed = '<div class="error inline"><p>' . sprintf( $removed, $date ) . '</p></div>';
    396393            } elseif ( ! empty( $section['updated'] ) ) {
    397                 $class = ' text-updated';
     394                $class = 'text-updated';
    398395                $date  = date_i18n( $date_format, $section['updated'] );
    399396                /* translators: %s: Date of privacy policy text update. */
     
    409406            $toc[]       = sprintf( '<li><a href="#%1$s">%2$s</a>' . $meta . '</li>', $toc_id, $plugin_name );
    410407
    411             $content .= '<div class="privacy-text-section' . $class . '">';
     408            $content .= '<div class="privacy-text-section ' . $class . '">';
    412409            $content .= '<a id="' . $toc_id . '">&nbsp;</a>';
    413410            /* translators: %s: Plugin name. */
     
    416413
    417414            $content .= '<div class="policy-text">' . $section['policy_text'] . '</div>';
    418             $content .= $return_to_top;
     415            $content .= '<a href="#" class="return-to-top">' . __( '&uarr; Return to Top' ) . '</a>';
    419416
    420417            if ( empty( $section['removed'] ) ) {
    421                 $content         .= '<div class="privacy-text-actions">';
    422                     $content     .= '<button type="button" class="privacy-text-copy button">';
    423                         $content .= $copy;
    424                         $content .= '<span class="screen-reader-text">';
    425                         /* translators: %s: Plugin name. */
    426                         $content .= sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name );
    427                         $content .= '</span>';
    428                     $content     .= '</button>';
    429                 $content         .= '</div>';
    430             }
    431 
    432             $content .= "</div>\n"; // End of .privacy-text-section.
     418                $content .= '<div class="privacy-text-actions">';
     419                $content .= '<button type="button" class="privacy-text-copy button">';
     420                $content .= __( 'Copy this section to clipboard' );
     421                $content .= '<span class="screen-reader-text">';
     422                /* translators: %s: Plugin name. */
     423                $content .= sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name );
     424                $content .= '</span>';
     425                $content .= '</button>';
     426                $content .= '<span class="success" aria-hidden="true">' . __( 'Copied!' ) . '</span>';
     427                $content .= '</div>';
     428            }
     429
     430            $content .= '</div>'; // End of .privacy-text-section.
    433431        }
    434432
    435433        if ( count( $toc ) > 2 ) {
    436434            ?>
    437             <div  class="privacy-text-box-toc">
     435            <div class="privacy-text-box-toc">
    438436                <p><?php _e( 'Table of Contents' ); ?></p>
    439437                <ol>
    440                     <?php echo implode( "\n", $toc ); ?>
     438                    <?php echo implode( $toc ); ?>
    441439                </ol>
    442440            </div>
  • trunk/src/wp-includes/script-loader.php

    r47416 r47572  
    14181418        $scripts->set_translations( 'site-health' );
    14191419
    1420         $scripts->add( 'privacy-tools', "/wp-admin/js/privacy-tools$suffix.js", array( 'jquery' ), false, 1 );
     1420        $scripts->add( 'privacy-tools', "/wp-admin/js/privacy-tools$suffix.js", array( 'jquery', 'wp-a11y', 'wp-i18n' ), false, 1 );
    14211421        did_action( 'init' ) && $scripts->localize(
    14221422            'privacy-tools',
Note: See TracChangeset for help on using the changeset viewer.