Skip to content

Commit 6cf7d60

Browse files
Administration: Add box reordering toggle to Screen Options.
1 parent 0a9838d commit 6cf7d60

12 files changed

Lines changed: 297 additions & 3 deletions

File tree

‎src/js/_enqueues/admin/common.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1859,6 +1859,7 @@ $( function() {
18591859
var width = navigator.userAgent.indexOf('AppleWebKit/') > -1 ? $window.width() : window.innerWidth;
18601860

18611861
if (
1862+
$body.hasClass( 'meta-box-reordering-disabled' ) ||
18621863
( width <= 782 ) ||
18631864
( 1 >= $sortables.find( '.ui-sortable-handle:visible' ).length && jQuery( '.columns-prefs-1 input' ).prop( 'checked' ) )
18641865
) {

‎src/js/_enqueues/admin/postbox.js‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,10 @@
104104
postboxWithinSortablesIndex = postboxesWithinSortables.index( postbox ),
105105
firstOrLastPositionMessage;
106106

107+
if ( ! postboxes.metaBoxReorderingEnabled ) {
108+
return;
109+
}
110+
107111
if ( 'dashboard_browser_nag' === postboxId ) {
108112
return;
109113
}
@@ -344,6 +348,13 @@
344348
postboxes.save_order( page );
345349
}
346350
});
351+
352+
$( '.meta-box-reordering-toggle' ).on( 'click.postboxes', function() {
353+
var enabled = $( this ).prop( 'checked' );
354+
355+
postboxes.setMetaBoxReordering( enabled );
356+
postboxes.save_meta_box_reordering_state( enabled );
357+
} );
347358
},
348359

349360
/**
@@ -419,6 +430,8 @@
419430
}
420431
});
421432

433+
this.setMetaBoxReordering( this.isMetaBoxReorderingEnabled() );
434+
422435
if ( isMobile ) {
423436
$(document.body).on('orientationchange.postboxes', function(){ postboxes._pb_change(); });
424437
this._pb_change();
@@ -437,6 +450,68 @@
437450
});
438451
},
439452

453+
/**
454+
* Checks whether meta box reordering is enabled.
455+
*
456+
* @since 7.1.0
457+
*
458+
* @return {boolean} Whether meta box reordering is enabled.
459+
*/
460+
isMetaBoxReorderingEnabled: function() {
461+
var $toggle = $( '#meta-box-reordering' );
462+
463+
if ( $toggle.length ) {
464+
return $toggle.prop( 'checked' );
465+
}
466+
467+
return ! $( document.body ).hasClass( 'meta-box-reordering-disabled' );
468+
},
469+
470+
/**
471+
* Enables or disables the meta box reordering UI.
472+
*
473+
* @since 7.1.0
474+
*
475+
* @param {boolean} enabled Whether reordering should be enabled.
476+
* @return {void}
477+
*/
478+
setMetaBoxReordering: function( enabled ) {
479+
var $body = $( document.body ),
480+
$orderButtons = $( '.postbox .handle-order-higher, .postbox .handle-order-lower' );
481+
482+
this.metaBoxReorderingEnabled = !! enabled;
483+
484+
$body
485+
.toggleClass( 'meta-box-reordering-enabled', this.metaBoxReorderingEnabled )
486+
.toggleClass( 'meta-box-reordering-disabled', ! this.metaBoxReorderingEnabled );
487+
488+
if ( this.metaBoxReorderingEnabled ) {
489+
$orderButtons
490+
.prop( 'disabled', false )
491+
.removeAttr( 'tabindex aria-hidden' );
492+
this.updateOrderButtonsProperties();
493+
} else {
494+
$orderButtons
495+
.prop( 'disabled', true )
496+
.attr( {
497+
'aria-hidden': 'true',
498+
tabindex: '-1'
499+
} );
500+
}
501+
502+
if ( window.wpResponsive && window.wpResponsive.maybeDisableSortables ) {
503+
window.wpResponsive.maybeDisableSortables();
504+
return;
505+
}
506+
507+
try {
508+
$( '.meta-box-sortables' )
509+
.sortable( this.metaBoxReorderingEnabled ? 'enable' : 'disable' )
510+
.find( '.ui-sortable-handle' )
511+
.toggleClass( 'is-non-sortable', ! this.metaBoxReorderingEnabled );
512+
} catch ( e ) {}
513+
},
514+
440515
/**
441516
* Saves the state of the postboxes to the server.
442517
*
@@ -476,6 +551,30 @@
476551
);
477552
},
478553

554+
/**
555+
* Saves the meta box reordering setting to the server.
556+
*
557+
* @since 7.1.0
558+
*
559+
* @memberof postboxes
560+
*
561+
* @param {boolean} enabled Whether meta box reordering is enabled.
562+
* @return {void}
563+
*/
564+
save_meta_box_reordering_state : function( enabled ) {
565+
$.post(
566+
ajaxurl,
567+
{
568+
action: 'meta-box-reordering',
569+
enabled: enabled ? 1 : 0,
570+
screenoptionnonce: $( '#screenoptionnonce' ).val()
571+
},
572+
function() {
573+
wp.a11y.speak( __( 'Screen Options updated.' ) );
574+
}
575+
);
576+
},
577+
479578
/**
480579
* Saves the order of the postboxes to the server.
481580
*

‎src/wp-admin/admin-ajax.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
'add-user',
8080
'closed-postboxes',
8181
'hidden-columns',
82+
'meta-box-reordering',
8283
'update-welcome-panel',
8384
'menu-get-metabox',
8485
'wp-link-ajax',

‎src/wp-admin/admin-header.php‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -214,6 +214,8 @@
214214
$admin_body_class .= ' block-editor-page wp-embed-responsive';
215215
}
216216

217+
$admin_body_class .= wp_is_meta_box_reordering_enabled() ? ' meta-box-reordering-enabled' : ' meta-box-reordering-disabled';
218+
217219
$admin_body_class .= ' wp-theme-' . sanitize_html_class( get_template() );
218220
if ( is_child_theme() ) {
219221
$admin_body_class .= ' wp-child-theme-' . sanitize_html_class( get_stylesheet() );

‎src/wp-admin/css/common.css‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1947,6 +1947,26 @@ p.auto-update-status {
19471947
line-height: 2.35;
19481948
}
19491949

1950+
.metabox-prefs > p {
1951+
margin: 0 0 8px;
1952+
}
1953+
1954+
.meta-box-reordering-prefs {
1955+
margin-top: 14px;
1956+
}
1957+
1958+
.meta-box-reordering-prefs legend {
1959+
padding-bottom: 2px;
1960+
}
1961+
1962+
.meta-box-reordering-prefs p {
1963+
margin: 0 0 4px;
1964+
}
1965+
1966+
.meta-box-reordering-prefs label {
1967+
line-height: 2;
1968+
}
1969+
19501970
#number-of-columns {
19511971
display: inline-block;
19521972
vertical-align: middle;
@@ -2244,6 +2264,11 @@ html.wp-toolbar {
22442264
width: 1.62rem;
22452265
}
22462266

2267+
.js.meta-box-reordering-disabled .postbox .handle-order-higher,
2268+
.js.meta-box-reordering-disabled .postbox .handle-order-lower {
2269+
display: none;
2270+
}
2271+
22472272
/* Post box order buttons in the block editor meta boxes area. */
22482273
.edit-post-meta-boxes-area .postbox .handle-order-higher,
22492274
.edit-post-meta-boxes-area .postbox .handle-order-lower {

‎src/wp-admin/css/dashboard.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1385,6 +1385,10 @@ a.rsswidget {
13851385
}
13861386
}
13871387

1388+
.js.meta-box-reordering-disabled #dashboard-widgets .postbox-container .empty-container {
1389+
display: none;
1390+
}
1391+
13881392
@media screen and (max-width: 870px) {
13891393
/* @deprecated 5.9.0 -- Lists removed from welcome panel. */
13901394
.welcome-panel .welcome-panel-column li {

‎src/wp-admin/includes/ajax-actions.php‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1856,6 +1856,25 @@ function wp_ajax_hidden_columns() {
18561856
wp_die( 1 );
18571857
}
18581858

1859+
/**
1860+
* Handles the meta box reordering setting via Ajax.
1861+
*
1862+
* @since 7.1.0
1863+
*/
1864+
function wp_ajax_meta_box_reordering() {
1865+
check_ajax_referer( 'screen-options-nonce', 'screenoptionnonce' );
1866+
1867+
$user = wp_get_current_user();
1868+
if ( ! $user ) {
1869+
wp_die( -1 );
1870+
}
1871+
1872+
$enabled = isset( $_POST['enabled'] ) && '1' === (string) $_POST['enabled'];
1873+
update_user_meta( $user->ID, 'meta_box_reordering', $enabled ? 'enabled' : 'disabled' );
1874+
1875+
wp_die( 1 );
1876+
}
1877+
18591878
/**
18601879
* Handles updating whether to display the welcome panel via AJAX.
18611880
*

‎src/wp-admin/includes/class-wp-screen.php‎

Lines changed: 41 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1023,7 +1023,7 @@ public function show_screen_options() {
10231023
*/
10241024
$this->_screen_settings = apply_filters( 'screen_settings', $this->_screen_settings, $this );
10251025

1026-
if ( $this->_screen_settings || $this->_options ) {
1026+
if ( $this->_screen_settings || $this->_options || $this->show_meta_box_reordering_options() ) {
10271027
$show_screen = true;
10281028
}
10291029

@@ -1081,6 +1081,7 @@ public function render_screen_options( $options = array() ) {
10811081
$this->render_meta_boxes_preferences();
10821082
$this->render_list_table_columns_preferences();
10831083
$this->render_screen_layout();
1084+
$this->render_meta_box_reordering_options();
10841085
$this->render_per_page_options();
10851086
$this->render_view_mode();
10861087
echo $this->_screen_settings;
@@ -1120,8 +1121,8 @@ public function render_meta_boxes_preferences() {
11201121
<fieldset class="metabox-prefs">
11211122
<legend><?php _e( 'Screen elements' ); ?></legend>
11221123
<p>
1123-
<?php _e( 'Some screen elements can be shown or hidden by using the checkboxes.' ); ?>
1124-
<?php _e( 'Expand or collapse the elements by clicking on their headings, and arrange them by dragging their headings or by clicking on the up and down arrows.' ); ?>
1124+
<?php _e( 'Use the checkboxes to show or hide screen elements.' ); ?>
1125+
<?php _e( 'Expand or collapse screen elements by clicking their headings.' ); ?>
11251126
</p>
11261127
<div class="metabox-prefs-container">
11271128
<?php
@@ -1148,6 +1149,43 @@ public function render_meta_boxes_preferences() {
11481149
<?php
11491150
}
11501151

1152+
/**
1153+
* Renders the option to enable or disable meta box reordering.
1154+
*
1155+
* @since 7.1.0
1156+
*/
1157+
public function render_meta_box_reordering_options() {
1158+
if ( ! $this->show_meta_box_reordering_options() ) {
1159+
return;
1160+
}
1161+
1162+
?>
1163+
<fieldset class="metabox-prefs meta-box-reordering-prefs">
1164+
<legend><?php _e( 'Reordering' ); ?></legend>
1165+
<p><?php _e( 'When enabled, boxes can be rearranged by dragging their headings or using the up and down controls.' ); ?></p>
1166+
<label for="meta-box-reordering">
1167+
<input class="meta-box-reordering-toggle" name="meta-box-reordering" type="checkbox" id="meta-box-reordering" value="enabled" <?php checked( wp_is_meta_box_reordering_enabled() ); ?> />
1168+
<?php _e( 'Enable box reordering' ); ?>
1169+
</label>
1170+
</fieldset>
1171+
<?php
1172+
}
1173+
1174+
/**
1175+
* Determines whether to show the meta box reordering option.
1176+
*
1177+
* @since 7.1.0
1178+
*
1179+
* @global array $wp_meta_boxes Global meta box state.
1180+
*
1181+
* @return bool Whether to show the option.
1182+
*/
1183+
private function show_meta_box_reordering_options() {
1184+
global $wp_meta_boxes;
1185+
1186+
return ! empty( $wp_meta_boxes[ $this->id ] );
1187+
}
1188+
11511189
/**
11521190
* Renders the list table columns preferences.
11531191
*

‎src/wp-admin/includes/screen.php‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,19 @@ function get_hidden_meta_boxes( $screen ) {
194194
return apply_filters( 'hidden_meta_boxes', $hidden, $screen, $use_defaults );
195195
}
196196

197+
/**
198+
* Determines whether meta box reordering is enabled.
199+
*
200+
* @since 7.1.0
201+
*
202+
* @return bool Whether meta box reordering is enabled.
203+
*/
204+
function wp_is_meta_box_reordering_enabled() {
205+
$setting = get_user_option( 'meta_box_reordering' );
206+
207+
return false === $setting ? true : 'disabled' !== $setting;
208+
}
209+
197210
/**
198211
* Register and configure an admin screen option
199212
*

‎tests/phpunit/includes/testcase-ajax.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ abstract class WP_Ajax_UnitTestCase extends WP_UnitTestCase {
6666
'add-user',
6767
'closed-postboxes',
6868
'hidden-columns',
69+
'meta-box-reordering',
6970
'update-welcome-panel',
7071
'menu-get-metabox',
7172
'wp-link-ajax',

0 commit comments

Comments
 (0)