Customizer: Make reordering menu items via drag and drop easier.

Introduce `wpNavMenu.options.targetTolerance` to define a tolerance when dragging items where no margins between the sortable items exists.

props adamsilverstein.
fixes #32821.

git-svn-id: https://develop.svn.wordpress.org/trunk@33030 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Dominik Schilling (ocean90) 2015-07-01 16:43:02 +00:00
parent 568721eef1
commit d1bedc6769
2 changed files with 11 additions and 5 deletions

View File

@ -8,6 +8,7 @@
wpNavMenu.originalInit = wpNavMenu.init;
wpNavMenu.options.menuItemDepthPerLevel = 20;
wpNavMenu.options.sortableItems = '> .customize-control-nav_menu_item';
wpNavMenu.options.targetTolerance = 10;
wpNavMenu.init = function() {
this.jQueryExtensions();
};

View File

@ -20,8 +20,9 @@ var wpNavMenu;
options : {
menuItemDepthPerLevel : 30, // Do not use directly. Use depthToPx and pxToDepth instead.
globalMaxDepth : 11,
sortableItems: '> *'
globalMaxDepth: 11,
sortableItems: '> *',
targetTolerance: 0
},
menuList : undefined, // Set in init.
@ -438,7 +439,7 @@ var wpNavMenu;
totalMenuItems = $('#menu-to-edit li').length,
hasSameDepthSibling = menuItem.nextAll( '.menu-item-depth-' + depth ).length;
menuItem.find( '.field-move' ).toggle( totalMenuItems > 1 );
menuItem.find( '.field-move' ).toggle( totalMenuItems > 1 );
// Where can they move this menu item?
if ( 0 !== position ) {
@ -721,11 +722,15 @@ var wpNavMenu;
var offset = ui.helper.offset(),
edge = api.isRTL ? offset.left + ui.helper.width() : offset.left,
depth = api.negateIfRTL * api.pxToDepth( edge - menuEdge );
// Check and correct if depth is not within range.
// Also, if the dragged element is dragged upwards over
// an item, shift the placeholder to a child position.
if ( depth > maxDepth || offset.top < prevBottom ) depth = maxDepth;
else if ( depth < minDepth ) depth = minDepth;
if ( depth > maxDepth || offset.top < ( prevBottom - api.options.targetTolerance ) ) {
depth = maxDepth;
} else if ( depth < minDepth ) {
depth = minDepth;
}
if( depth != currentDepth )
updateCurrentDepth(ui, depth);