WordPress.org

Make WordPress Core

Ticket #13220: sortable.groups.improvements.2.patch

File sortable.groups.improvements.2.patch, 4.1 KB (added by koopersmith, 5 years ago)
  • wp-admin/js/nav-menu.dev.js

     
    163163                }, 
    164164 
    165165                initSortables : function() { 
    166                         var currentDepth = 0, originalDepth, minDepth, maxDepth, prevBottom, 
    167                                 menuLeft = api.menuList.offset().left, 
    168                                 newItem, transport; 
     166                        var currentDepth = 0, originalDepth, minDepth, maxDepth, 
     167                                prev, next, prevBottom, nextThreshold, helperHeight, transport, 
     168                                menuLeft = api.menuList.offset().left; 
    169169 
    170170                        api.menuList.sortable({ 
    171171                                handle: '.menu-item-handle', 
    172172                                placeholder: 'sortable-placeholder', 
    173173                                start: function(e, ui) { 
    174                                         var height, width, parent, children, maxChildDepth; 
     174                                        var height, width, parent, children, maxChildDepth, tempHolder; 
    175175 
    176176                                        transport = ui.item.children('.menu-item-transport'); 
    177177                                 
    178178                                        // Set depths. currentDepth must be set before children are located. 
    179                                         originalDepth = ( newItem ) ? 0 : ui.item.menuItemDepth(); 
     179                                        originalDepth = ui.item.menuItemDepth(); 
    180180                                        updateCurrentDepth(ui, originalDepth); 
    181181                                 
    182182                                        // Attach child elements to parent 
     
    185185                                        children = parent.childMenuItems(); 
    186186                                        transport.append( children ); 
    187187 
    188                                         // Now that the element is complete, we can update... 
    189                                         updateDepthRange(ui); 
    190  
    191188                                        // Update the height of the placeholder to match the moving item. 
    192189                                        height = transport.outerHeight(); 
    193190                                        // If there are children, account for distance between top of children and parent 
    194191                                        height += ( height > 0 ) ? (ui.placeholder.css('margin-top').slice(0, -2) * 1) : 0; 
    195192                                        height += ui.helper.outerHeight(); 
     193                                        helperHeight = height; 
    196194                                        height -= 2; // Subtract 2 for borders 
    197195                                        ui.placeholder.height(height); 
    198196 
     
    206204                                        width += api.depthToPx(maxChildDepth - originalDepth); // Account for children 
    207205                                        width -= 2; // Subtract 2 for borders 
    208206                                        ui.placeholder.width(width); 
     207                                         
     208                                        // Update the list of menu items. 
     209                                        tempHolder = ui.placeholder.next(); 
     210                                        tempHolder.css( 'margin-top', helperHeight + 'px' ); // Set the margin to absorb the placeholder 
     211                                        ui.placeholder.detach(); // detach or jQuery UI will think the placeholder is a menu item 
     212                                        $(this).sortable( "refresh" ); // The children aren't sortable. We should let jQ UI know. 
     213                                        ui.item.after( ui.placeholder ); // reattach the placeholder. 
     214                                        tempHolder.css('margin-top', 0); // reset the margin 
     215                                         
     216                                        // Now that the element is complete, we can update... 
     217                                        updateSharedVars(ui); 
    209218                                }, 
    210219                                stop: function(e, ui) { 
    211220                                        var children, depthChange = currentDepth - originalDepth; 
     
    227236                                        // Make sure the placeholder is inside the menu. 
    228237                                        // Otherwise fix it, or we're in trouble. 
    229238                                        if( ! ui.placeholder.parent().hasClass('menu') ) 
    230                                                 ui.placeholder.appendTo(api.menuList); 
     239                                                (prev.length) ? prev.after( ui.placeholder ) : api.menuList.prepend( ui.placeholder ); 
    231240 
    232                                         updateDepthRange(ui); 
     241                                        updateSharedVars(ui); 
    233242                                }, 
    234243                                sort: function(e, ui) { 
    235244                                        var offset = ui.helper.offset(), 
     
    242251 
    243252                                        if( depth != currentDepth ) 
    244253                                                updateCurrentDepth(ui, depth); 
     254                                                 
     255                                        // If we overlap the next element, manually shift downwards 
     256                                        if( nextThreshold && offset.top + helperHeight > nextThreshold ) { 
     257                                                next.after( ui.placeholder ); 
     258                                                updateSharedVars( ui ); 
     259                                                $(this).sortable( "refreshPositions" ); 
     260                                        } 
    245261                                } 
    246262                        }); 
    247263 
    248                         function updateDepthRange(ui) { 
    249                                 var prev = ui.placeholder.prev(), 
    250                                         next = ui.placeholder.next(), depth; 
     264                        function updateSharedVars(ui) { 
     265                                var depth; 
     266                                 
     267                                prev = ui.placeholder.prev(); 
     268                                next = ui.placeholder.next(); 
    251269 
    252270                                // Make sure we don't select the moving item. 
    253271                                if( prev[0] == ui.item[0] ) prev = prev.prev(); 
    254272                                if( next[0] == ui.item[0] ) next = next.next(); 
    255273 
    256274                                prevBottom = (prev.length) ? prev.offset().top + prev.height() : 0; 
     275                                nextThreshold = (next.length) ? next.offset().top + next.height() / 3 : 0; 
    257276                                minDepth = (next.length) ? next.menuItemDepth() : 0; 
    258277 
    259278                                if( prev.length )