Make it possible to tab out of the plugin and theme editors textareas by pressing Esc followed by Tab, fixes #21347

git-svn-id: http://core.svn.wordpress.org/trunk@21310 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
azaozz 2012-07-23 23:46:27 +00:00
parent 63df9ad5e0
commit 6d556cbcdb
3 changed files with 26 additions and 12 deletions

View File

@ -321,10 +321,24 @@ $(document).ready( function() {
// tab in textareas
$('#newcontent').bind('keydown.wpevent_InsertTab', function(e) {
if ( e.keyCode != 9 )
return true;
var el = e.target, selStart, selEnd, val, scroll, sel;
var el = e.target, selStart = el.selectionStart, selEnd = el.selectionEnd, val = el.value, scroll, sel;
if ( e.keyCode == 27 ) { // escape key
$(el).data('tab-out', true);
return;
}
if ( e.keyCode != 9 || e.ctrlKey || e.altKey || e.shiftKey ) // tab key
return;
if ( $(el).data('tab-out') ) {
$(el).data('tab-out', false);
return;
}
selStart = el.selectionStart;
selEnd = el.selectionEnd;
val = el.value;
try {
this.lastKey = 9; // not a standard DOM property, lastKey is to help stop Opera tab event. See blur handler below.

View File

@ -226,7 +226,8 @@ foreach ( $plugin_files as $plugin_file ) :
</div>
<form name="template" id="template" action="plugin-editor.php" method="post">
<?php wp_nonce_field('edit-plugin_' . $file) ?>
<div><textarea cols="70" rows="25" name="newcontent" id="newcontent" tabindex="1"><?php echo $content ?></textarea>
<div><textarea cols="70" rows="25" name="newcontent" id="newcontent" aria-describedby="newcontent-description" tabindex="1"><?php echo $content ?></textarea>
<span id="newcontent-description" class="screen-reader-text"><?php _e('Content of the edited file. The Tab key enters a tab character, to move below this area, press the Esc key followed by the Tab key. Shift + Tab works as expected.'); ?></span>
<input type="hidden" name="action" value="update" />
<input type="hidden" name="file" value="<?php echo esc_attr($file) ?>" />
<input type="hidden" name="plugin" value="<?php echo esc_attr($plugin) ?>" />
@ -256,12 +257,10 @@ foreach ( $plugin_files as $plugin_file ) :
<br class="clear" />
</div>
<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function($){
$('#template').submit(function(){ $('#scrollto').val( $('#newcontent').scrollTop() ); });
$('#newcontent').scrollTop( $('#scrollto').val() );
});
/* ]]> */
</script>
<?php
break;

View File

@ -198,12 +198,13 @@ if ( $allowed_files ) :
else : ?>
<form name="template" id="template" action="theme-editor.php" method="post">
<?php wp_nonce_field( 'edit-theme_' . $file . $stylesheet ); ?>
<div><textarea cols="70" rows="30" name="newcontent" id="newcontent" tabindex="1"><?php echo $content ?></textarea>
<input type="hidden" name="action" value="update" />
<input type="hidden" name="file" value="<?php echo esc_attr( $relative_file ); ?>" />
<input type="hidden" name="theme" value="<?php echo esc_attr( $theme->get_stylesheet() ); ?>" />
<input type="hidden" name="scrollto" id="scrollto" value="<?php echo $scrollto; ?>" />
</div>
<div><textarea cols="70" rows="30" name="newcontent" id="newcontent" aria-describedby="newcontent-description" tabindex="1"><?php echo $content ?></textarea>
<span id="newcontent-description" class="screen-reader-text"><?php _e('Content of the edited file. The Tab key enters a tab character, to move below this area, press the Esc key followed by the Tab key. Shift + Tab works as expected.'); ?></span>
<input type="hidden" name="action" value="update" />
<input type="hidden" name="file" value="<?php echo esc_attr( $relative_file ); ?>" />
<input type="hidden" name="theme" value="<?php echo esc_attr( $theme->get_stylesheet() ); ?>" />
<input type="hidden" name="scrollto" id="scrollto" value="<?php echo $scrollto; ?>" />
</div>
<?php if ( ! empty( $functions ) ) : ?>
<div id="documentation" class="hide-if-no-js">
<label for="docs-list"><?php _e('Documentation:') ?></label>