Changeset 35229

Timestamp:

10/16/2015 11:01:58 PM (9 years ago)

Author:

SergeyBiryukov

Message:

Sample permalink: Improve accessibility of changing the permalink on Edit Post screen.

Props afercia.
Fixes #34255.

Location:

trunk/src

Files:

• wp-admin/css/edit.css (modified) (1 diff)
• wp-admin/includes/post.php (modified) (1 diff)
• wp-admin/js/post.js (modified) (3 diffs)
• wp-includes/script-loader.php (modified) (2 diffs)

trunk/src/wp-admin/css/edit.css

@@ -105 +105 @@
 #edit-slug-box .cancel {
     margin-right: 10px;
+    padding: 0;
     font-size: 11px;
+    text-decoration: underline;
+    color: #0073aa;
 }
 

trunk/src/wp-admin/includes/post.php

@@ -1347 +1347 @@
         $return .= '<span id="sample-permalink"><a href="' . esc_url( $view_link ) . '"' . $preview_target . '>' . $display_link . "</a></span>\n";
         $return .= '&lrm;'; // Fix bi-directional text display defect in RTL languages.
-        $return .= '<span id="edit-slug-buttons"><button type="button" class="edit-slug button button-small hide-if-no-js">' . __( 'Edit' ) . "</button></span>\n";
+        $return .= '<span id="edit-slug-buttons"><button type="button" class="edit-slug button button-small hide-if-no-js" aria-label="' . __( 'Edit permalink' ) . '">' . __( 'Edit' ) . "</button></span>\n";
         $return .= '<span id="editable-post-name-full">' . $post_name . "</span>\n";
     }

trunk/src/wp-admin/js/post.js

@@ -742 +742 @@
         revert_e = $el.html();
 
-        buttons.html('<button type="button" class="save button button-small">'+postL10n.ok+'</button> <a class="cancel" href="#">'+postL10n.cancel+'</a>');
-        buttons.children('.save').click( function( e ) {
+        buttons.html( '<button type="button" class="save button button-small">' + postL10n.ok + '</button> <button type="button" class="cancel button-link">' + postL10n.cancel + '</button>' );
+        buttons.children( '.save' ).click( function() {
             var new_slug = $el.children( 'input' ).val();
-            e.preventDefault();
+
             if ( new_slug == $('#editable-post-name-full').text() ) {
                 buttons.children('.cancel').click();
@@ -769 +769 @@
                 real_slug.val(new_slug);
                 $( '.edit-slug' ).focus();
+                wp.a11y.speak( postL10n.permalinkSaved );
             });
         });
 
-        buttons.children('.cancel').click( function( e ) {
-            e.preventDefault();
+        buttons.children( '.cancel' ).click( function() {
             $('#view-post-btn').show();
             $el.html(revert_e);
@@ -788 +788 @@
 
         slug_value = ( c > full.length / 4 ) ? '' : full;
-        $el.html( '<input type="text" id="new-post-slug" value="'+slug_value+'" autocomplete="off" />').children('input').keypress(function(e) {
-            var key = e.keyCode || 0;
-            // on enter, just save the new slug, don't save the post
-            if ( 13 == key ) {
-                buttons.children('.save').click();
-                return false;
-            }
-            if ( 27 == key ) {
-                buttons.children('.cancel').click();
-                return false;
+        $el.html( '<input type="text" id="new-post-slug" value="' + slug_value + '" autocomplete="off" />' ).children( 'input' ).keydown( function( e ) {
+            var key = e.which;
+            // On enter, just save the new slug, don't save the post.
+            if ( 13 === key ) {
+                e.preventDefault();
+                buttons.children( '.save' ).click();
+            }
+            if ( 27 === key ) {
+                buttons.children( '.cancel' ).click();
             }
         } ).keyup( function() {
-            real_slug.val(this.value);
+            real_slug.val( this.value );
         }).focus();
     }
 
-    $('#edit-slug-box').on( 'click', '.edit-slug', function() {
+    $( '#titlediv' ).on( 'click', '.edit-slug', function() {
         editPermalink();
     });

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

@@ -501 +501 @@
         ) );
 
-        $scripts->add( 'post', "/wp-admin/js/post$suffix.js", array( 'suggest', 'wp-lists', 'postbox', 'tags-box', 'underscore', 'word-count' ), false, 1 );
+        $scripts->add( 'post', "/wp-admin/js/post$suffix.js", array( 'suggest', 'wp-lists', 'postbox', 'tags-box', 'underscore', 'word-count', 'wp-a11y' ), false, 1 );
         did_action( 'init' ) && $scripts->localize( 'post', 'postL10n', array(
             'ok' => __('OK'),
@@ -525 +525 @@
             'saveAlert' => __('The changes you made will be lost if you navigate away from this page.'),
             'savingText' => __('Saving Draft…'),
+            'permalinkSaved' => __( 'Permalink saved' ),
         ) );