joomla / joomla-cms

Home of the Joomla! Content Management System
https://www.joomla.org
GNU General Public License v2.0
4.73k stars 3.64k forks source link

[4.0] Moving front-end menu items not always possible in admin menu manager #26523

Open Scrabble96 opened 4 years ago

Scrabble96 commented 4 years ago

Steps to reproduce the issue

Create several menu items in the main Cassiopeia menu and add a number of child items to some of the parents to make sure that in order to see the last parent (level 1) item in the menu manager in the admin panel you have to scroll down to see it.

Next, grab the last parent item to drag it to a new position near the top.

Expected result

  1. As in J3x the child items for that item and any others at the same level should collapse/concertina down so that only the items at the level of the one you are moving are visible.
  2. Additionally, if all those menu items are not visible on the screen then it is possible to drag the item up or down and the list display will move/scroll accordingly.

Actual result

Neither of these two results happen which means that the item has to be moved in several stages. However, if there are several items at a different level in between the existing and the new position, and the new position is not visible, then moving it by dropping it into the other level is not allowed.

System information (as much as possible)

Have tested this in both last night's Dev 12 nightly and also the latest Backend Dev 12 template.

Additional comments

meet2410shah commented 4 years ago

I want to contribute to this issue.

Scrabble96 commented 4 years ago

By all means :-)

Scrabble96 commented 4 years ago

This seems to be a similar issue to the module ordering that was fixed with the now-merged PR #24358.

Perhaps a version of this fix could be used to fix the menu ordering?

Scrabble96 commented 3 years ago

This is still an issue with Beta 6. The only way to move a level 1 menu item in a long list of items is to filter it to max level 1.

joomdonation commented 1 year ago

@Scrabble96 Could you please check to see if the issue still happens on our latest Joomla 4.2 ? There were some PRs to deal with drag & drop re-ordering, so I think the issue could be fixed now. If Yes, please close this issue. Thanks !

Scrabble96 commented 1 year ago

Sorry, but no, it doesn't. In J3, as soon as you start to drag a parent item, the child items collapse. See screenshots:

Joomla 3x - I am about to grab the 'Support Us' parent item: Menu-J3-1

Joomla 3x - child menu items collapse: Menu-J3-2

Joomla 4.2.5 - before attempting to move 'Who's Who' and its children. See the child items above the 'Who's Who' menu item: Menu-J4-1

Joomla 4.2.5 - while attempting to move the item. The child items don't collapse and pushing up the list doesn't scroll. Menu-J4-2

joomdonation commented 1 year ago

Thanks @Scrabble96 for the feedback.

@Fedik @dgrammatiko Could you please check to see if we can address this issue or it is a limitation of dragula script and we will have to live with it? Thanks !

Fedik commented 1 year ago

If I right remember it was fixed somehow already, in joomla 4, when you drag parent the children will be rearanged to new position after drag finished.

Fedik commented 1 year ago

This one #34584 and issue #34389

joomdonation commented 1 year ago

Yes, change ordering works well. As I understand, @Scrabble96 wants that when we start drag the parent menu item, it's children items will be collapsed like in Joomla 3. In Joomla 4, the children items still stay at it's own position and only moved to new position after parent menu item dragged on the new position (see the screenshot she posted earlier to understand more about it). I don't know if it is possible with dragula script which we are using, thus the question.

dgrammatiko commented 1 year ago

Draggula creates a copy of the element that is dragged with a class gu-mirror https://github.com/joomla/joomla-cms/blob/06038e5b820f09fbb9490c5ecd5c326efdcc612d/build/media_source/templates/administrator/atum/scss/vendor/_dragula.scss#L3 You could try target that element and apply, let's say, el.style.display='none' to all the children elements (or something like that) on the drag event and revert that on the drop/cancel events (that part might be unnecessary depending on how dragula is actually disposing the mirror element). My 2c anyways

joomdonation commented 1 year ago

Thanks @dgrammatiko. That could be the solution. I wonder if you could give it a try?

Scrabble96 commented 1 year ago

My problem was also that the child elements for ALL top level menu items collapsed in J3 but not in J4. In J4, if there are several child elements in the menu above, then it's not possible to move the parent element below to a higher position because you can't drag the item higher up. Excessive padding around all the elements in the Atum template doesn't help matters, either. The only way I can think of getting around this without changing code is to view the parent item level only before attempting to move the item.