Skip to content

Commit

Permalink
Coding Standards: Further update the code for bulk menu items deletio…
Browse files Browse the repository at this point in the history
…n to better follow WordPress coding standards.

Follow-up to [51006], [51009].

See #21603.

git-svn-id: https://develop.svn.wordpress.org/trunk@51010 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
SergeyBiryukov committed May 25, 2021
1 parent 0011fb5 commit f6de89e
Show file tree
Hide file tree
Showing 3 changed files with 81 additions and 64 deletions.
135 changes: 74 additions & 61 deletions src/js/_enqueues/lib/nav-menu.js
Expand Up @@ -875,12 +875,12 @@
attachBulkSelectButtonListeners : function() {
var that = this;

$('.bulk-select-switcher').on( 'change', function(){
if( this.checked ){
$('.bulk-select-switcher').prop('checked',true);
$( '.bulk-select-switcher' ).on( 'change', function() {
if ( this.checked ) {
$( '.bulk-select-switcher' ).prop( 'checked', true );
that.enableBulkSelection();
}else{
$('.bulk-select-switcher').prop('checked',false);
} else {
$( '.bulk-select-switcher' ).prop( 'checked', false );
that.disableBulkSelection();
}
});
Expand All @@ -892,13 +892,14 @@
* @since 5.8.0
*/
enableBulkSelection : function() {
$('#menu-to-edit').addClass('bulk-selection');
$('#nav-menu-bulk-actions-top').addClass('bulk-selection');
$('#nav-menu-bulk-actions-bottom').addClass('bulk-selection');
var checkbox = $( '#menu-to-edit .menu-item-checkbox' );

$( '#menu-to-edit' ).addClass( 'bulk-selection' );
$( '#nav-menu-bulk-actions-top' ).addClass( 'bulk-selection' );
$( '#nav-menu-bulk-actions-bottom' ).addClass( 'bulk-selection' );

var checkbox = $('#menu-to-edit .menu-item-checkbox');
$.each( checkbox, function(){
$(this).prop('disabled',false);
$.each( checkbox, function() {
$(this).prop( 'disabled', false );
});
},

Expand All @@ -908,20 +909,22 @@
* @since 5.8.0
*/
disableBulkSelection : function() {
$('#menu-to-edit').removeClass('bulk-selection');
$('#nav-menu-bulk-actions-top').removeClass('bulk-selection');
$('#nav-menu-bulk-actions-bottom').removeClass('bulk-selection');
var checkbox = $( '#menu-to-edit .menu-item-checkbox' );

$( '#menu-to-edit' ).removeClass( 'bulk-selection' );
$( '#nav-menu-bulk-actions-top' ).removeClass( 'bulk-selection' );
$( '#nav-menu-bulk-actions-bottom' ).removeClass( 'bulk-selection' );

if ( $('.menu-items-delete').is('[aria-describedby="pending-menu-items-to-delete"]') ) {
$('.menu-items-delete').removeAttr( 'aria-describedby' );
if ( $( '.menu-items-delete' ).is( '[aria-describedby="pending-menu-items-to-delete"]' ) ) {
$( '.menu-items-delete' ).removeAttr( 'aria-describedby' );
}

var checkbox = $('#menu-to-edit .menu-item-checkbox');
$.each( checkbox, function(){
$(this).prop('disabled',true).prop('checked',false);
$.each( checkbox, function() {
$(this).prop( 'disabled', true ).prop( 'checked', false );
});
$('.menu-items-delete').addClass('disabled');
$('#pending-menu-items-to-delete ul').empty();

$( '.menu-items-delete' ).addClass( 'disabled' );
$( '#pending-menu-items-to-delete ul' ).empty();
},

/**
Expand All @@ -932,7 +935,7 @@
attachMenuCheckBoxListeners : function() {
var that = this;

$( '#menu-to-edit' ).on( 'change', '.menu-item-checkbox', function(){
$( '#menu-to-edit' ).on( 'change', '.menu-item-checkbox', function() {
that.setRemoveSelectedButtonStatus();
});
},
Expand All @@ -945,30 +948,33 @@
attachMenuItemDeleteButton : function() {
var that = this;

$( document ).on('click', '.menu-items-delete', function(e){
$( document ).on( 'click', '.menu-items-delete', function( e ) {
var itemsPendingDeletion, itemsPendingDeletionList, deletionSpeech;

e.preventDefault();

if( ! $(this).hasClass('disabled') ){
$.each( $('.menu-item-checkbox:checked'), function( index, element ) {
if ( ! $(this).hasClass( 'disabled' ) ) {
$.each( $( '.menu-item-checkbox:checked' ), function( index, element ) {
$( element ).parents( 'li' ).find( 'a.item-delete' ).trigger( 'click' );
});

$('.menu-items-delete').addClass('disabled');
$('.bulk-select-switcher').prop('checked',false);
$( '.menu-items-delete' ).addClass( 'disabled' );
$( '.bulk-select-switcher' ).prop( 'checked', false );

var itemsPendingDeletion = '';
var itemsPendingDeletionList = $('#pending-menu-items-to-delete ul li');
itemsPendingDeletion = '';
itemsPendingDeletionList = $( '#pending-menu-items-to-delete ul li' );

$.each( itemsPendingDeletionList, function( index, element ) {
var itemName = $( element ).find( '.pending-menu-item-name' ).text();
var itemSpeech = menus.menuItemDeletion.replace( '%s', itemName );
itemsPendingDeletion += itemSpeech ;
if( ( index + 1 ) < itemsPendingDeletionList.length ){
itemsPendingDeletion += ', ' ;

itemsPendingDeletion += itemSpeech;
if ( ( index + 1 ) < itemsPendingDeletionList.length ) {
itemsPendingDeletion += ', ';
}
});

var deletionSpeech = menus.itemsDeleted.replace( '%s', itemsPendingDeletion );
deletionSpeech = menus.itemsDeleted.replace( '%s', itemsPendingDeletion );
wp.a11y.speak( deletionSpeech, 'polite' );
that.disableBulkSelection();
}
Expand All @@ -980,25 +986,35 @@
*
* @since 5.8.0
*/
attachPendingMenuItemsListForDeletion : function(){
$('#post-body-content').on( 'change', '.menu-item-checkbox', function(){
attachPendingMenuItemsListForDeletion : function() {
$( '#post-body-content' ).on( 'change', '.menu-item-checkbox', function() {
var menuItemName, menuItemType, menuItemID, listedMenuItem;

if( ! $('.menu-items-delete').is('[aria-describedby="pending-menu-items-to-delete"]') ){ $('.menu-items-delete').attr( 'aria-describedby', 'pending-menu-items-to-delete' ); }
if ( ! $( '.menu-items-delete' ).is( '[aria-describedby="pending-menu-items-to-delete"]' ) ) {
$( '.menu-items-delete' ).attr( 'aria-describedby', 'pending-menu-items-to-delete' );
}

var menuItemName = $(this).next().text();
var menuItemType = $(this).parent().next('.item-controls').find('.item-type').text();
var menuItemID = $(this).attr('data-menu-item-id');
menuItemName = $(this).next().text();
menuItemType = $(this).parent().next( '.item-controls' ).find( '.item-type' ).text();
menuItemID = $(this).attr( 'data-menu-item-id' );

var ListedMenuItem = $('#pending-menu-items-to-delete ul').find('[data-menu-item-id=' + menuItemID + ']');
if( ListedMenuItem.length > 0 ){
ListedMenuItem.remove();
listedMenuItem = $( '#pending-menu-items-to-delete ul' ).find( '[data-menu-item-id=' + menuItemID + ']' );
if ( listedMenuItem.length > 0 ) {
listedMenuItem.remove();
}
if( this.checked === true ){
$('#pending-menu-items-to-delete ul').append( '<li data-menu-item-id="' + menuItemID + '"><span class="pending-menu-item-name">' + menuItemName + '</span> <span class="pending-menu-item-type">(' + menuItemType + ')</span><span class="separator"></span></li>' );

if ( this.checked === true ) {
$( '#pending-menu-items-to-delete ul' ).append(
'<li data-menu-item-id="' + menuItemID + '">' +
'<span class="pending-menu-item-name">' + menuItemName + '</span> ' +
'<span class="pending-menu-item-type">(' + menuItemType + ')</span>' +
'<span class="separator"></span>' +
'</li>'
);
}

$('#pending-menu-items-to-delete li .separator').html(', ');
$('#pending-menu-items-to-delete li .separator').last().html('.');
$( '#pending-menu-items-to-delete li .separator' ).html( ', ' );
$( '#pending-menu-items-to-delete li .separator' ).last().html( '.' );
});
},

Expand All @@ -1007,21 +1023,19 @@
*
* @since 5.8.0
*/
setBulkDeleteCheckboxStatus : function(){

setBulkDeleteCheckboxStatus : function() {
var that = this;
var checkbox = $('#menu-to-edit .menu-item-checkbox');
var checkbox = $( '#menu-to-edit .menu-item-checkbox' );

$.each( checkbox, function(){

if( $(this).prop('disabled') == true ){
$.each( checkbox, function() {
if ( $(this).prop( 'disabled' ) ) {
$(this).prop( 'disabled', false );
}else{
} else {
$(this).prop( 'disabled', true );
}

if( $(this).is(':checked')) {
$(this).prop('checked',false);
if ( $(this).is( ':checked' ) ) {
$(this).prop( 'checked', false );
}
});

Expand All @@ -1033,14 +1047,13 @@
*
* @since 5.8.0
*/
setRemoveSelectedButtonStatus : function(){

var button = $('.menu-items-delete');
setRemoveSelectedButtonStatus : function() {
var button = $( '.menu-items-delete' );

if( $('.menu-item-checkbox:checked').length > 0 ) {
button.removeClass('disabled');
if ( $( '.menu-item-checkbox:checked' ).length > 0 ) {
button.removeClass( 'disabled' );
} else {
button.addClass('disabled');
button.addClass( 'disabled' );
}
},

Expand Down
6 changes: 5 additions & 1 deletion src/wp-admin/includes/class-walker-nav-menu-edit.php
Expand Up @@ -118,7 +118,11 @@ public function start_el( &$output, $item, $depth = 0, $args = null, $id = 0 ) {
<li id="menu-item-<?php echo $item_id; ?>" class="<?php echo implode( ' ', $classes ); ?>">
<div class="menu-item-bar">
<div class="menu-item-handle">
<label class="item-title" for="menu-item-checkbox-<?php echo $item_id; ?>"><input id="menu-item-checkbox-<?php echo $item_id; ?>" type="checkbox" class="menu-item-checkbox" data-menu-item-id="<?php echo $item_id; ?>" disabled="disabled"/><span class="menu-item-title"><?php echo esc_html( $title ); ?></span> <span class="is-submenu" <?php echo $submenu_text; ?>><?php _e( 'sub item' ); ?></span></label>
<label class="item-title" for="menu-item-checkbox-<?php echo $item_id; ?>">
<input id="menu-item-checkbox-<?php echo $item_id; ?>" type="checkbox" class="menu-item-checkbox" data-menu-item-id="<?php echo $item_id; ?>" disabled="disabled" />
<span class="menu-item-title"><?php echo esc_html( $title ); ?></span>
<span class="is-submenu" <?php echo $submenu_text; ?>><?php _e( 'sub item' ); ?></span>
</label>
<span class="item-controls">
<span class="item-type"><?php echo esc_html( $item->type_label ); ?></span>
<span class="item-order hide-if-js">
Expand Down
4 changes: 2 additions & 2 deletions src/wp-admin/nav-menus.php
Expand Up @@ -984,7 +984,7 @@ function wp_nav_menu_max_depth( $classes ) {
<div id="nav-menu-bulk-actions-top" class="bulk-actions">
<label class="bulk-select-button" for="bulk-select-switcher-top">
<input type="checkbox" id="bulk-select-switcher-top" name="bulk-select-switcher-top" class="bulk-select-switcher">
<span class="bulk-select-button-label"><?php echo __( 'Bulk Select' ); ?></span>
<span class="bulk-select-button-label"><?php _e( 'Bulk Select' ); ?></span>
</label>
</div>
<?php
Expand Down Expand Up @@ -1015,7 +1015,7 @@ function wp_nav_menu_max_depth( $classes ) {
<div id="nav-menu-bulk-actions-bottom" class="bulk-actions">
<label class="bulk-select-button" for="bulk-select-switcher-bottom">
<input type="checkbox" id="bulk-select-switcher-bottom" name="bulk-select-switcher-top" class="bulk-select-switcher">
<span class="bulk-select-button-label"><?php echo __( 'Bulk Select' ); ?></span>
<span class="bulk-select-button-label"><?php _e( 'Bulk Select' ); ?></span>
</label>
<input type="button" class="deletion menu-items-delete disabled" value="<?php _e( 'Remove Selected Items' ); ?>">
<div id="pending-menu-items-to-delete">
Expand Down

0 comments on commit f6de89e

Please sign in to comment.