<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[49325] trunk/src: Revert the improvenents to arranging of postboxes/metaboxes, [49179].</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { white-space: pre-line; overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="https://core.trac.wordpress.org/changeset/49325">49325</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"https://core.trac.wordpress.org/changeset/49325","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>azaozz</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2020-10-27 10:45:36 +0000 (Tue, 27 Oct 2020)</dd>
</dl>
<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Revert the improvenents to arranging of postboxes/metaboxes, <a href="https://core.trac.wordpress.org/changeset/49179">[49179]</a>. The current patch fixes about half a dozen problems, but seems more general improvements are needed to how Screen Options work.
See <a href="https://core.trac.wordpress.org/ticket/50699">#50699</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcjs_enqueuesadminpostboxjs">trunk/src/js/_enqueues/admin/postbox.js</a></li>
<li><a href="#trunksrcjs_enqueueswpdashboardjs">trunk/src/js/_enqueues/wp/dashboard.js</a></li>
<li><a href="#trunksrcwpadmincsscommoncss">trunk/src/wp-admin/css/common.css</a></li>
<li><a href="#trunksrcwpadmincssdashboardcss">trunk/src/wp-admin/css/dashboard.css</a></li>
<li><a href="#trunksrcwpadmincsseditcss">trunk/src/wp-admin/css/edit.css</a></li>
<li><a href="#trunksrcwpadminincludestemplatephp">trunk/src/wp-admin/includes/template.php</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcjs_enqueuesadminpostboxjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/js/_enqueues/admin/postbox.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/js/_enqueues/admin/postbox.js 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/js/_enqueues/admin/postbox.js 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -9,9 +9,8 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /* global ajaxurl, postboxes */
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-( function( $ ) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+(function($) {
</ins><span class="cx" style="display: block; padding: 0 10px"> var $document = $( document ),
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $body = $( 'body' ),
</del><span class="cx" style="display: block; padding: 0 10px"> __ = wp.i18n.__;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -64,7 +63,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( postboxes.page !== 'press-this' ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes.save_state();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.save_state( postboxes.page );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( id ) {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -119,8 +118,8 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Move a postbox up.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( button.hasClass( 'handle-order-higher' ) ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Move a postbox up.
</del><span class="cx" style="display: block; padding: 0 10px"> // If the box is first within a sortable area, move it to the previous sortable area.
</span><span class="cx" style="display: block; padding: 0 10px"> if ( 0 === postboxWithinSortablesIndex ) {
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.handleOrderBetweenSortables( 'previous', button, postbox );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -130,9 +129,11 @@
</span><span class="cx" style="display: block; padding: 0 10px"> postbox.prevAll( '.postbox:visible' ).eq( 0 ).before( postbox );
</span><span class="cx" style="display: block; padding: 0 10px"> button.focus();
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.updateOrderButtonsProperties();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes.save_order();
- } else if ( button.hasClass( 'handle-order-lower' ) ) {
- // Move a postbox down.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.save_order( postboxes.page );
+ }
+
+ // Move a postbox down.
+ if ( button.hasClass( 'handle-order-lower' ) ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> // If the box is last within a sortable area, move it to the next sortable area.
</span><span class="cx" style="display: block; padding: 0 10px"> if ( postboxWithinSortablesIndex + 1 === postboxesWithinSortablesCount ) {
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.handleOrderBetweenSortables( 'next', button, postbox );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -142,8 +143,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> postbox.nextAll( '.postbox:visible' ).eq( 0 ).after( postbox );
</span><span class="cx" style="display: block; padding: 0 10px"> button.focus();
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.updateOrderButtonsProperties();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes.save_order();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.save_order( postboxes.page );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -189,25 +191,10 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes._mark_area();
</span><span class="cx" style="display: block; padding: 0 10px"> button.focus();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes.save_order();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.updateOrderButtonsProperties();
+ postboxes.save_order( postboxes.page );
</ins><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- showArrangeArrows: function() {
- $( '.postbox-arrange-arrow' )
- .attr( 'aria-disabled', 'false' )
- .removeClass( 'hidden' );
-
- postboxes._mark_area();
- },
-
- hideArrangeArrows: function() {
- $( '.postbox-arrange-arrow' )
- .attr( 'aria-disabled', 'true' )
- .addClass( 'hidden' );
-
- postboxes._mark_area();
- },
-
</del><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="cx" style="display: block; padding: 0 10px"> * Update the move buttons properties depending on the postbox position.
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -216,38 +203,40 @@
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><span class="cx" style="display: block; padding: 0 10px"> updateOrderButtonsProperties: function() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- var elements = $( '.postbox:visible' ),
- containers = $( '.meta-box-sortables:visible' )
- .not( '.unused-container' )
- .filter( function( i, container ) {
- if ( i > 0 && container.clientHeight === 0 ) {
- return false;
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var firstSortablesId = $( '.meta-box-sortables:visible:first' ).attr( 'id' ),
+ lastSortablesId = $( '.meta-box-sortables:visible:last' ).attr( 'id' ),
+ firstPostbox = $( '.postbox:visible:first' ),
+ lastPostbox = $( '.postbox:visible:last' ),
+ firstPostboxId = firstPostbox.attr( 'id' ),
+ lastPostboxId = lastPostbox.attr( 'id' ),
+ firstPostboxSortablesId = firstPostbox.closest( '.meta-box-sortables' ).attr( 'id' ),
+ lastPostboxSortablesId = lastPostbox.closest( '.meta-box-sortables' ).attr( 'id' ),
+ moveUpButtons = $( '.handle-order-higher' ),
+ moveDownButtons = $( '.handle-order-lower' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- return true;
- } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Enable all buttons as a reset first.
+ moveUpButtons
+ .attr( 'aria-disabled', 'false' )
+ .removeClass( 'hidden' );
+ moveDownButtons
+ .attr( 'aria-disabled', 'false' )
+ .removeClass( 'hidden' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // When there's only one "sortables" area (e.g. in the block editor)
- // and only one visible postbox, hide the buttons.
- if ( containers.length === 1 && elements.length === 1 ) {
- $( '.postbox-arrange-arrow' ).addClass( 'hidden' ).attr( 'aria-disabled', 'true' );
- return;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // When there's only one "sortables" area (e.g. in the block editor) and only one visible postbox, hide the buttons.
+ if ( firstSortablesId === lastSortablesId && firstPostboxId === lastPostboxId ) {
+ moveUpButtons.addClass( 'hidden' );
+ moveDownButtons.addClass( 'hidden' );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Reset.
- if ( $body.hasClass( 'screen-options-open' ) ) {
- $( '.postbox-arrange-arrow' ).removeClass( 'hidden' ).attr( 'aria-disabled', 'false' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Set an aria-disabled=true attribute on the first visible "move" buttons.
+ if ( firstSortablesId === firstPostboxSortablesId ) {
+ $( firstPostbox ).find( '.handle-order-higher' ).attr( 'aria-disabled', 'true' );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( elements.first().parent()[0] === containers.first()[0] ) {
- // Set an aria-disabled=true attribute on the first visible "move higher" buttons.
- elements.first().find( '.handle-order-higher' ).attr( 'aria-disabled', 'true' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Set an aria-disabled=true attribute on the last visible "move" buttons.
+ if ( lastSortablesId === lastPostboxSortablesId ) {
+ $( '.postbox:visible .handle-order-lower' ).last().attr( 'aria-disabled', 'true' );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- if ( elements.last().parent()[0] === containers.last()[0] ) {
- // Set an aria-disabled=true attribute on the last visible "move lower" buttons.
- elements.last().find( '.handle-order-lower' ).attr( 'aria-disabled', 'true' );
- }
</del><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -263,9 +252,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> * @param {Function} args.pbhide A callback that is called when a postbox closes.
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- add_postbox_toggles: function ( page, args ) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ add_postbox_toggles : function (page, args) {
</ins><span class="cx" style="display: block; padding: 0 10px"> var $handles = $( '.postbox .hndle, .postbox .handlediv' ),
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $orderButtons = $( '.postbox .postbox-arrange-arrow' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $orderButtons = $( '.postbox .handle-order-higher, .postbox .handle-order-lower' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> this.page = page;
</span><span class="cx" style="display: block; padding: 0 10px"> this.init( page, args );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -278,8 +267,8 @@
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="cx" style="display: block; padding: 0 10px"> * @since 2.7.0
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.postbox .hndle a' ).on( 'click', function( event ) {
- event.stopPropagation();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $('.postbox .hndle a').click( function(e) {
+ e.stopPropagation();
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -294,11 +283,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.postbox a.dismiss' ).on( 'click.postboxes', function( event ) {
- var hide_id = $( this ).parents( '.postbox' ).attr( 'id' ) + '-hide';
-
- event.preventDefault();
- $( '#' + hide_id ).prop( 'checked', false ).triggerHandler( 'click' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( '.postbox a.dismiss' ).on( 'click.postboxes', function( e ) {
+ var hide_id = $(this).parents('.postbox').attr('id') + '-hide';
+ e.preventDefault();
+ $( '#' + hide_id ).prop('checked', false).triggerHandler('click');
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -314,26 +302,24 @@
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.hide-postbox-tog' ).on( 'click.postboxes', function() {
- var $el = $( this ),
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $('.hide-postbox-tog').bind('click.postboxes', function() {
+ var $el = $(this),
</ins><span class="cx" style="display: block; padding: 0 10px"> boxId = $el.val(),
</span><span class="cx" style="display: block; padding: 0 10px"> $postbox = $( '#' + boxId );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $el.prop( 'checked' ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $postbox.show();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
</del><span class="cx" style="display: block; padding: 0 10px"> if ( $.isFunction( postboxes.pbshow ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.pbshow( boxId );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="cx" style="display: block; padding: 0 10px"> $postbox.hide();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
</del><span class="cx" style="display: block; padding: 0 10px"> if ( $.isFunction( postboxes.pbhide ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.pbhide( boxId );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes.save_state();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.save_state( page );
</ins><span class="cx" style="display: block; padding: 0 10px"> postboxes._mark_area();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -350,44 +336,46 @@
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.columns-prefs input[type="radio"]' ).on( 'click.postboxes', function() {
- var number = parseInt( $( this ).val(), 10 );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $('.columns-prefs input[type="radio"]').bind('click.postboxes', function(){
+ var n = parseInt($(this).val(), 10);
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( number ) {
- postboxes._pb_edit( number );
- postboxes.save_order();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( n ) {
+ postboxes._pb_edit(n);
+ postboxes.save_order( page );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- // Enable dragging/arranging of postboxes and show drop placeholders when Screen Options tab is open.
- // If there is no Screen Options tab on the screen, dragging/arranging is enabled on page load.
- $document.on( 'screen:options:open', function() {
- $body.addClass( 'screen-options-open' );
- postboxes.initializeSortable();
- postboxes.showArrangeArrows();
- } ).on( 'screen:options:close', function() {
- $body.removeClass( 'screen-options-open' );
- $( '.meta-box-sortables' ).sortable( 'destroy' );
- postboxes.hideArrangeArrows();
- } );
</del><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- initializeSortable: function() {
- var hasScreenOptions = $document.find( '#screen-options-wrap' ).length > 0;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Initializes all the postboxes, mainly their sortable behaviour.
+ *
+ * @since 2.7.0
+ *
+ * @memberof postboxes
+ *
+ * @param {string} page The page we are currently on.
+ * @param {Object} [args={}] The arguments for the postbox initializer.
+ * @param {Function} args.pbshow A callback that is called when a postbox opens.
+ * @param {Function} args.pbhide A callback that is called when a postbox
+ * closes.
+ *
+ * @return {void}
+ */
+ init : function(page, args) {
+ var isMobile = $( document.body ).hasClass( 'mobile' ),
+ $handleButtons = $( '.postbox .handlediv' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.meta-box-sortables' ).sortable( {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $.extend( this, args || {} );
+ $('.meta-box-sortables').sortable({
</ins><span class="cx" style="display: block; padding: 0 10px"> placeholder: 'sortable-placeholder',
</span><span class="cx" style="display: block; padding: 0 10px"> connectWith: '.meta-box-sortables',
</span><span class="cx" style="display: block; padding: 0 10px"> items: '.postbox',
</span><span class="cx" style="display: block; padding: 0 10px"> handle: '.hndle',
</span><span class="cx" style="display: block; padding: 0 10px"> cursor: 'move',
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- delay: ( $body.hasClass( 'mobile' ) ? 200 : 0 ),
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ delay: ( isMobile ? 200 : 0 ),
</ins><span class="cx" style="display: block; padding: 0 10px"> distance: 2,
</span><span class="cx" style="display: block; padding: 0 10px"> tolerance: 'pointer',
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- opacity: 0.65,
</del><span class="cx" style="display: block; padding: 0 10px"> forcePlaceholderSize: true,
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- containment: '#wpwrap',
-
</del><span class="cx" style="display: block; padding: 0 10px"> helper: function( event, element ) {
</span><span class="cx" style="display: block; padding: 0 10px"> /* `helper: 'clone'` is equivalent to `return element.clone();`
</span><span class="cx" style="display: block; padding: 0 10px"> * Cloning a checked radio and then inserting that clone next to the original
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -398,17 +386,14 @@
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><span class="cx" style="display: block; padding: 0 10px"> return element.clone()
</span><span class="cx" style="display: block; padding: 0 10px"> .find( ':input' )
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .attr( 'name', function( i, currentName ) {
- return 'sort_' + parseInt( Math.random() * 100000, 10 ).toString() + '_' + currentName;
- } )
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .attr( 'name', function( i, currentName ) {
+ return 'sort_' + parseInt( Math.random() * 100000, 10 ).toString() + '_' + currentName;
+ } )
</ins><span class="cx" style="display: block; padding: 0 10px"> .end();
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ opacity: 0.65,
</ins><span class="cx" style="display: block; padding: 0 10px"> start: function() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Pretend the Screen Options tab exists.
- if ( ! hasScreenOptions ) {
- $body.addClass( 'screen-options-open' );
- }
-
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( 'body' ).addClass( 'is-dragging-metaboxes' );
</ins><span class="cx" style="display: block; padding: 0 10px"> // Refresh the cached positions of all the sortable items so that the min-height set while dragging works.
</span><span class="cx" style="display: block; padding: 0 10px"> $( '.meta-box-sortables' ).sortable( 'refreshPositions' );
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -415,69 +400,41 @@
</span><span class="cx" style="display: block; padding: 0 10px"> stop: function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var $el = $( this );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( ! hasScreenOptions ) {
- $body.removeClass( 'screen-options-open' );
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( 'body' ).removeClass( 'is-dragging-metaboxes' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $el.find( '#dashboard_browser_nag' ).is( ':visible' ) && 'dashboard_browser_nag' != this.firstChild.id ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $el.sortable( 'cancel' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $el.sortable('cancel');
</ins><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- postboxes._mark_area();
- postboxes.save_order();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.updateOrderButtonsProperties();
+ postboxes.save_order(page);
</ins><span class="cx" style="display: block; padding: 0 10px"> },
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- receive: function( event, ui ) {
- if ( 'dashboard_browser_nag' == ui.item[0].id ) {
- $( ui.sender ).sortable( 'cancel' );
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ receive: function(e,ui) {
+ if ( 'dashboard_browser_nag' == ui.item[0].id )
+ $(ui.sender).sortable('cancel');
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes._mark_area();
</ins><span class="cx" style="display: block; padding: 0 10px"> $document.trigger( 'postbox-moved', ui.item );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- },
</del><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- /**
- * Initializes the postboxes, mainly their sortable behaviour.
- *
- * @since 2.7.0
- *
- * @memberof postboxes
- *
- * @param {string} page The page we are currently on. Not used, here for back-compat.
- * @param {Object} [args={}] The arguments for the postbox initializer.
- * @param {Function} args.pbshow A callback that is called when a postbox opens.
- * @param {Function} args.pbhide A callback that is called when a postbox
- * closes.
- *
- * @return {void}
- */
- init: function( page, args ) {
- $.extend( this, args || {} );
-
- if ( $body.hasClass( 'mobile' ) ) {
- $body.on( 'orientationchange.postboxes', function() { postboxes._pb_change(); } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( isMobile ) {
+ $(document.body).bind('orientationchange.postboxes', function(){ postboxes._pb_change(); });
</ins><span class="cx" style="display: block; padding: 0 10px"> this._pb_change();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Set the "arrange" (up/down) buttons properties on page load...
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ this._mark_area();
+
+ // Update the "move" buttons properties.
</ins><span class="cx" style="display: block; padding: 0 10px"> this.updateOrderButtonsProperties();
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $document.on( 'postbox-toggled', this.updateOrderButtonsProperties );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // ...and keep updating it when postboxes are added or removed by using the checkboxes in Screen Options.
- $document.on( 'postbox-toggled', this._mark_area );
-
</del><span class="cx" style="display: block; padding: 0 10px"> // Set the handle buttons `aria-expanded` attribute initial value on page load.
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.postbox .handlediv' ).each( function () {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $handleButtons.each( function () {
</ins><span class="cx" style="display: block; padding: 0 10px"> var $el = $( this );
</span><span class="cx" style="display: block; padding: 0 10px"> $el.attr( 'aria-expanded', ! $el.closest( '.postbox' ).hasClass( 'closed' ) );
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- // Init sortables now if there is no Screen Options tab.
- // Otherwise init when Screen Options are open.
- if ( ! $document.find( '#screen-options-wrap' ).length ) {
- this.initializeSortable();
- this.showArrangeArrows();
- }
</del><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -493,11 +450,11 @@
</span><span class="cx" style="display: block; padding: 0 10px"> * @param {string} page The page we are currently on.
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- save_state : function() {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ save_state : function(page) {
</ins><span class="cx" style="display: block; padding: 0 10px"> var closed, hidden;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // Return on the nav-menus.php screen, see #35112.
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( 'nav-menus' === postboxes.page ) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( 'nav-menus' === page ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -504,12 +461,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> closed = $( '.postbox' ).filter( '.closed' ).map( function() { return this.id; } ).get().join( ',' );
</span><span class="cx" style="display: block; padding: 0 10px"> hidden = $( '.postbox' ).filter( ':hidden' ).map( function() { return this.id; } ).get().join( ',' );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $.post( ajaxurl, {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $.post(ajaxurl, {
</ins><span class="cx" style="display: block; padding: 0 10px"> action: 'closed-postboxes',
</span><span class="cx" style="display: block; padding: 0 10px"> closed: closed,
</span><span class="cx" style="display: block; padding: 0 10px"> hidden: hidden,
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- closedpostboxesnonce: $( '#closedpostboxesnonce' ).val(),
- page: postboxes.page
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ closedpostboxesnonce: jQuery('#closedpostboxesnonce').val(),
+ page: page
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -522,17 +479,20 @@
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @memberof postboxes
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ * @param {string} page The page we are currently on.
</ins><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- save_order : function() {
- var postVars = {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ save_order : function(page) {
+ var postVars, page_columns = $('.columns-prefs input:checked').val() || 0;
+
+ postVars = {
</ins><span class="cx" style="display: block; padding: 0 10px"> action: 'meta-box-order',
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- _ajax_nonce: $( '#meta-box-order-nonce' ).val(),
- page_columns: $( '.columns-prefs input:checked' ).val() || 0,
- page: postboxes.page
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ _ajax_nonce: $('#meta-box-order-nonce').val(),
+ page_columns: page_columns,
+ page: page
</ins><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '.meta-box-sortables' ).each( function() {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $('.meta-box-sortables').each( function() {
</ins><span class="cx" style="display: block; padding: 0 10px"> postVars[ 'order[' + this.id.split( '-' )[0] + ']' ] = $( this ).sortable( 'toArray' ).join( ',' );
</span><span class="cx" style="display: block; padding: 0 10px"> } );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -562,49 +522,48 @@
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><span class="cx" style="display: block; padding: 0 10px"> _mark_area : function() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- var elements = $( '.postbox:visible' ),
- containers = $( '.meta-box-sortables:visible' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var visible = $( 'div.postbox:visible' ).length,
+ visibleSortables = $( '#dashboard-widgets .meta-box-sortables:visible, #post-body .meta-box-sortables:visible' ),
+ areAllVisibleSortablesEmpty = true;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- containers.each( function( index, element ) {
- var container = $( element );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ visibleSortables.each( function() {
+ var t = $(this);
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( container.children( '.postbox:visible' ).length ) {
- container
- .removeClass( 'empty-container unused-container' )
- .removeAttr( 'data-emptystring' );
- } else {
- container.addClass( 'empty-container' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( visible == 1 || t.children( '.postbox:visible' ).length ) {
+ t.removeClass('empty-container');
+ areAllVisibleSortablesEmpty = false;
+ }
+ else {
+ t.addClass('empty-container');
+ }
+ });
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( elements.length < 1 ) {
- // Edge case: all postboxes are disabled.
- // Mark the first container as empty, the rest as unused.
- if ( index === 0 ) {
- container.attr( 'data-emptystring', __( 'Enable screen elements from the Screen Options menu' ) );
- } else {
- container.addClass( 'unused-container' );
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ postboxes.updateEmptySortablesText( visibleSortables, areAllVisibleSortablesEmpty );
+ },
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Break the loop.
- return false;
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Updates the text for the empty sortable areas on the Dashboard.
+ *
+ * @since 5.5.0
+ *
+ * @param {Object} visibleSortables The jQuery object representing the visible sortable areas.
+ * @param {boolean} areAllVisibleSortablesEmpty Whether all the visible sortable areas are "empty".
+ *
+ * @return {void}
+ */
+ updateEmptySortablesText: function( visibleSortables, areAllVisibleSortablesEmpty ) {
+ var isDashboard = $( '#dashboard-widgets' ).length,
+ emptySortableText = areAllVisibleSortablesEmpty ? __( 'Add boxes from the Screen Options menu' ) : __( 'Drag boxes here' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- container.attr( 'data-emptystring', __( 'Drag screen elements here' ) );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( ! isDashboard ) {
+ return;
+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( elements.length <= index ) {
- // If there are not enough elements (postboxes) to add to all containers,
- // (and this container is empty, as tested above)
- // mark it as "unused".
- container.addClass( 'unused-container' );
- } else {
- container.removeClass( 'unused-container' );
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ visibleSortables.each( function() {
+ if ( $( this ).hasClass( 'empty-container' ) ) {
+ $( this ).attr( 'data-emptyString', emptySortableText );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- });
-
- // Refresh up/down arrows attributes.
- if ( $body.hasClass( 'screen-options-open' ) ) {
- postboxes.updateOrderButtonsProperties();
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ } );
</ins><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -620,11 +579,11 @@
</span><span class="cx" style="display: block; padding: 0 10px"> * @param {number} n The amount of columns to divide the post edit page in.
</span><span class="cx" style="display: block; padding: 0 10px"> * @return {void}
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- _pb_edit : function( n ) {
- var el = $( '.metabox-holder' ).get( 0 );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ _pb_edit : function(n) {
+ var el = $('.metabox-holder').get(0);
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( el ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- el.className = el.className.replace( /columns-\d+/, 'columns-' + n );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ el.className = el.className.replace(/columns-\d+/, 'columns-' + n);
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -655,16 +614,16 @@
</span><span class="cx" style="display: block; padding: 0 10px"> switch ( window.orientation ) {
</span><span class="cx" style="display: block; padding: 0 10px"> case 90:
</span><span class="cx" style="display: block; padding: 0 10px"> case -90:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( ! check.length || ! check.is( ':checked' ) ) {
- this._pb_edit( 2 );
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( !check.length || !check.is(':checked') )
+ this._pb_edit(2);
</ins><span class="cx" style="display: block; padding: 0 10px"> break;
</span><span class="cx" style="display: block; padding: 0 10px"> case 0:
</span><span class="cx" style="display: block; padding: 0 10px"> case 180:
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $( '#poststuff' ).length ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- this._pb_edit( 1 );
- } else if ( ! check.length || ! check.is( ':checked' ) ) {
- this._pb_edit( 2 );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ this._pb_edit(1);
+ } else {
+ if ( !check.length || !check.is(':checked') )
+ this._pb_edit(2);
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> break;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -692,4 +651,4 @@
</span><span class="cx" style="display: block; padding: 0 10px"> pbhide : false
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-}( jQuery ));
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+}(jQuery));
</ins></span></pre></div>
<a id="trunksrcjs_enqueueswpdashboardjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/js/_enqueues/wp/dashboard.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/js/_enqueues/wp/dashboard.js 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/js/_enqueues/wp/dashboard.js 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -180,9 +180,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> autoResizeTextarea();
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
</del><span class="cx" style="display: block; padding: 0 10px"> window.quickPressLoad();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Enable the dragging functionality of the widgets.
+ $( '.meta-box-sortables' ).sortable( 'option', 'containment', '#wpwrap' );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="cx" style="display: block; padding: 0 10px"> * Adjust the height of the textarea based on the content.
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span></span></pre></div>
<a id="trunksrcwpadmincsscommoncss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/css/common.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/css/common.css 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/wp-admin/css/common.css 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1986,7 +1986,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> padding-top: 10px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.postbox-container .meta-box-sortables {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.metabox-holder .postbox-container .meta-box-sortables {
</ins><span class="cx" style="display: block; padding: 0 10px"> /* The jQuery UI Sortables need some initial height to work properly. */
</span><span class="cx" style="display: block; padding: 0 10px"> min-height: 1px;
</span><span class="cx" style="display: block; padding: 0 10px"> position: relative;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -2015,14 +2015,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> height: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> min-height: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- #wpbody-content .metabox-holder .postbox-container .empty-container:after {
- display: none;
- }
</del><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> .js .widget .widget-top,
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.js.screen-options-open .postbox .hndle {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.js .postbox .hndle {
</ins><span class="cx" style="display: block; padding: 0 10px"> cursor: move;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span></span></pre></div>
<a id="trunksrcwpadmincssdashboardcss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/css/dashboard.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/css/dashboard.css 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/wp-admin/css/dashboard.css 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -49,20 +49,24 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> #dashboard-widgets .meta-box-sortables {
</span><span class="cx" style="display: block; padding: 0 10px"> display: flow-root; /* avoid margin collapsing between parent and first/last child elements */
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /* Required min-height to make the jQuery UI Sortable drop zone work. */
+ min-height: 100px;
</ins><span class="cx" style="display: block; padding: 0 10px"> margin: 0 8px 20px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-/* The following four selectors also apply on the Edit Post screen. */
-.screen-options-open .meta-box-sortables {
- outline: 3px dashed #606a73;
- min-height: 250px;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+#dashboard-widgets .postbox-container .empty-container {
+ outline: 3px dashed #b4b9be;
+ height: 250px;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.screen-options-open .postbox-container .empty-container {
- outline-color: #b4b9be;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/* Only highlight drop zones when dragging and only in the 2 columns layout. */
+.is-dragging-metaboxes #dashboard-widgets .meta-box-sortables {
+ outline: 3px dashed #606a73;
+ /* Prevent margin on the child from collapsing with margin on the parent. */
+ display: flow-root;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.postbox-container .empty-container:after {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+#dashboard-widgets .postbox-container .empty-container:after {
</ins><span class="cx" style="display: block; padding: 0 10px"> content: attr(data-emptystring);
</span><span class="cx" style="display: block; padding: 0 10px"> margin: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> position: absolute;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -78,9 +82,6 @@
</span><span class="cx" style="display: block; padding: 0 10px"> display: none;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.screen-options-open .postbox-container .empty-container:after {
- display: block;
-}
</del><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /* @todo: this was originally in this section, but likely belongs elsewhere */
</span><span class="cx" style="display: block; padding: 0 10px"> #the-comment-list td.comment p.comment-author {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1117,7 +1118,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> min-height: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .screen-options-open #dashboard-widgets .meta-box-sortables {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .is-dragging-metaboxes #dashboard-widgets .meta-box-sortables {
</ins><span class="cx" style="display: block; padding: 0 10px"> min-height: 100px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1173,11 +1174,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> .columns-prefs .columns-prefs-4 {
</span><span class="cx" style="display: block; padding: 0 10px"> display: none;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-/*
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> #dashboard-widgets .postbox-container .empty-container:after {
</span><span class="cx" style="display: block; padding: 0 10px"> display: block;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-*/
</del><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /* three columns on the dash */
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1205,20 +1205,19 @@
</span><span class="cx" style="display: block; padding: 0 10px"> #dashboard-widgets #postbox-container-4 .empty-container:after {
</span><span class="cx" style="display: block; padding: 0 10px"> display: none;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-/*
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> #dashboard-widgets .postbox-container .empty-container:after {
</span><span class="cx" style="display: block; padding: 0 10px"> display: block;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-*/
</del><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-/* Always show the "Drag boxes here" CSS generated content on large screens.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/* Always show the "Drag boxes here" CSS generated content on large screens. */
</ins><span class="cx" style="display: block; padding: 0 10px"> @media only screen and (min-width: 1801px) {
</span><span class="cx" style="display: block; padding: 0 10px"> #dashboard-widgets .postbox-container .empty-container:after {
</span><span class="cx" style="display: block; padding: 0 10px"> display: block;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-*/
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> @media screen and (max-width: 870px) {
</span><span class="cx" style="display: block; padding: 0 10px"> .welcome-panel .welcome-panel-column,
</span><span class="cx" style="display: block; padding: 0 10px"> .welcome-panel .welcome-panel-column:first-child {
</span></span></pre></div>
<a id="trunksrcwpadmincsseditcss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/css/edit.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/css/edit.css 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/wp-admin/css/edit.css 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -148,20 +148,21 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /* Post Screen */
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.screen-options-open .metabox-holder .postbox-container .meta-box-sortables {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/* Only highlight drop zones when dragging and only in the 2 columns layout. */
+.is-dragging-metaboxes .metabox-holder .postbox-container .meta-box-sortables {
+ outline: 3px dashed #606a73;
+ /* Prevent margin on the child from collapsing with margin on the parent. */
+ display: flow-root;
+ /*
+ * This min-height is meant to limit jumpiness while dragging. It's equivalent
+ * to the minimum height of the sortable-placeholder which is given by the height
+ * of a collapsed post box (36px + 1px top and bottom borders) + the placeholder
+ * bottom margin (20px) + 2 additional pixels to compensate browsers rounding.
+ */
+ min-height: 60px;
</ins><span class="cx" style="display: block; padding: 0 10px"> margin-bottom: 20px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-.screen-options-open #postbox-container-2 #advanced-sortables.empty-container {
- height: 0;
- min-height: 0;
- outline: none;
-}
-
-.screen-options-open #postbox-container-2 #advanced-sortables.empty-container:after {
- display: none;
-}
-
</del><span class="cx" style="display: block; padding: 0 10px"> .postbox {
</span><span class="cx" style="display: block; padding: 0 10px"> position: relative;
</span><span class="cx" style="display: block; padding: 0 10px"> min-width: 255px;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1522,7 +1523,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> width: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .screen-options-open.post-type-attachment #post-body .meta-box-sortables {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .is-dragging-metaboxes.post-type-attachment #post-body .meta-box-sortables {
</ins><span class="cx" style="display: block; padding: 0 10px"> outline: none;
</span><span class="cx" style="display: block; padding: 0 10px"> min-height: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> margin-bottom: 0;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1562,10 +1563,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /* Increase min-height while dragging for the #side-sortables and any potential sortables area with custom ID. */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- .screen-options-open #poststuff #postbox-container-1 .empty-container,
- .screen-options-open #poststuff #postbox-container-1 #side-sortables:empty,
- .screen-options-open #poststuff #post-body.columns-2 #side-sortables,
- .screen-options-open #poststuff #post-body.columns-2 .meta-box-sortables {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ .is-dragging-metaboxes #poststuff #postbox-container-1 .empty-container,
+ .is-dragging-metaboxes #poststuff #postbox-container-1 #side-sortables:empty,
+ .is-dragging-metaboxes #poststuff #post-body.columns-2 #side-sortables,
+ .is-dragging-metaboxes #poststuff #post-body.columns-2 .meta-box-sortables {
</ins><span class="cx" style="display: block; padding: 0 10px"> height: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> min-height: 60px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span></span></pre></div>
<a id="trunksrcwpadminincludestemplatephp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/includes/template.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/includes/template.php 2020-10-27 09:32:50 UTC (rev 49324)
+++ trunk/src/wp-admin/includes/template.php 2020-10-27 10:45:36 UTC (rev 49325)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1335,7 +1335,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> echo '<div class="handle-actions hide-if-no-js">';
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- echo '<button type="button" class="handle-order-higher postbox-arrange-arrow hidden" aria-disabled="true" aria-describedby="' . $box['id'] . '-handle-order-higher-description">';
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ echo '<button type="button" class="handle-order-higher" aria-disabled="false" aria-describedby="' . $box['id'] . '-handle-order-higher-description">';
</ins><span class="cx" style="display: block; padding: 0 10px"> echo '<span class="screen-reader-text">' . __( 'Move up' ) . '</span>';
</span><span class="cx" style="display: block; padding: 0 10px"> echo '<span class="order-higher-indicator" aria-hidden="true"></span>';
</span><span class="cx" style="display: block; padding: 0 10px"> echo '</button>';
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1345,7 +1345,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $widget_title
</span><span class="cx" style="display: block; padding: 0 10px"> ) . '</span>';
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- echo '<button type="button" class="handle-order-lower postbox-arrange-arrow hidden" aria-disabled="true" aria-describedby="' . $box['id'] . '-handle-order-lower-description">';
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ echo '<button type="button" class="handle-order-lower" aria-disabled="false" aria-describedby="' . $box['id'] . '-handle-order-lower-description">';
</ins><span class="cx" style="display: block; padding: 0 10px"> echo '<span class="screen-reader-text">' . __( 'Move down' ) . '</span>';
</span><span class="cx" style="display: block; padding: 0 10px"> echo '<span class="order-lower-indicator" aria-hidden="true"></span>';
</span><span class="cx" style="display: block; padding: 0 10px"> echo '</button>';
</span></span></pre>
</div>
</div>
</body>
</html>