Changeset 6400

Timestamp:

01/18/2018 06:36:37 PM (9 years ago)

Author:

obenland

Message:

DevHub: Add a notification for screen readers after voting on a user contributed note

Props keesiemeijer.
Fixes #1819.

Location:

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer

Files:

• inc/user-content-voting.php (modified) (2 diffs)
• js/user-notes-voting.js (modified) (1 diff)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/user-content-voting.php

@@ -65 +65 @@
                 // Only need to enqueue voting-related resources if there are comments to vote on.
                 if ( self::user_can_vote() && is_singular() && '0' != get_comments_number() ) {
-                        wp_register_script( 'wporg-developer-user-notes-voting', get_template_directory_uri() . '/js/user-notes-voting.js', array(), '20160623', true );
+                        wp_register_script( 'wporg-developer-user-notes-voting', get_template_directory_uri() . '/js/user-notes-voting.js', array( 'wp-a11y' ), '20160623', true );
                         wp_localize_script( 'wporg-developer-user-notes-voting', 'ajaxurl', admin_url( 'admin-ajax.php' ) );
                         wp_enqueue_script( 'wporg-developer-user-notes-voting' );
@@ -307 +307 @@
                 }
 
-                echo '<div class="user-note-voting" data-nonce="' . esc_attr( $nonce ) . '">';
+                echo '<div id="user-note-voting" class="user-note-voting" data-nonce="' . esc_attr( $nonce ) . '">';
 
                 // Up vote link

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/js/user-notes-voting.js

@@ -4 +4 @@
  */
 
-( function( $ ) {
-        $( document ).on( 'click', '.user-note-voting a', function(e) {
-                e.preventDefault();
+( function( $, wp ) {
+        $( '#user-note-voting' ).on( 'click', '.user-note-voting-up, .user-note-voting-down', function( event ) {
+                event.preventDefault();
 
-                var item = $(this);
+                var $item = $( this ),
+                        comment = $item.closest( '.comment' );
 
-                $.post(ajaxurl, {
-                                action:   "note_vote",
-                                comment:  $(this).attr('data-id'),
-                                vote:     $(this).attr('data-vote'),
-                                _wpnonce: $(this).parent().attr('data-nonce')
-                        }, function(data) {
-                                if ("0" != data) {
-                                        item.closest('.user-note-voting').replaceWith(data);
+                $.post(
+                        ajaxurl,
+                        {
+                                action:   'note_vote',
+                                comment:  $item.attr( 'data-id' ),
+                                vote:     $item.attr( 'data-vote' ),
+                                _wpnonce: $item.parent().attr( 'data-nonce' )
+                        },
+                        function( data ) {
+                                if ( '0' !== data ) {
+                                        $item.closest( '.user-note-voting' ).replaceWith( data );
+                                        wp.a11y.speak( $( '.user-note-voting-count', comment ).text() );
                                 }
-                        }, "text"
+                        },
+                        'text'
                 );
+
                 return false;
-        });
-} )( jQuery );
+        } );
+} )( window.jQuery, window.wp );