Allow widgets to be dropped onto closed sidebars

[shaunandrews]

It should be possible to drag-and-drop a widget onto a closed sidebar. @azaozz has an initial patch, but this needs more consideration.

[shaunandrews]

Dragging a widget over a sidebar will highlight. Dropping it will clone it and save the sidebar.

[shaunandrews]

A quick video of the 25952.2.diff in action: ​https://cloudup.com/cNpXPAOBe3w

[azaozz]

In 25952.3.diff:

• Clean up the JS a bit.
• Reuse addWidget() to process the widget after dropping.
• Fix a problem with disappearing reference element when dragging the widget over an open sidebar and then dropping it on a closed sidebar.

The css will need some refresh/tweaks.

[shaunandrews]

Changing the hover class to make a little more sense, and refreshing the css patch.

[shaunandrews]

Dragging a widget from a sidebar over to a closed sidebar doesn't work. The closed sidebar highlights on hover as expected, and once you drop the widget, the closed sidebar opens, but the widget isn't moved.

[azaozz]

In 25952.5.patch:

• Include the sidebar title in the sortable making it possible to drop widgets on the title. That increases the drop area and lets the user drop on a closed sidebar.
• Fix expanding widgets.
• Some css and js cleanup.

This works well but requires that we change the html outputted from wp_list_widget_controls() a bit. That may break couple of plugins. It is possible to add another agr to output the "new" html.

However I'm still not fully convinced this makes it more useful. As the new widgets screen layout emphasizes the sidebars, perhaps better would be to have them all open on page load. Also, maybe the left and right areas can scroll independent from each other making it possible for the user to see the desired widget and the desired sidebar side by side.

[shaunandrews]

I think 25952.5.patch makes things worse. 25952.4.diff seemed like a simpler interaction, and solved the root problem.

[azaozz]

In 26285:

Widgets: split the sidebars in two containers so there are no empty spaces when they are shown in two columns and some are open, other closed. See #25952.

[azaozz]

In 26286:

Widgets: fix html for sidebars columns when the theme has only one sidebar. See #25952.

[azaozz]

In 25952.6.patch:

• Fix possible regression in wp_list_widget_controls(), add an optional argument to output the sidebar name inside the sortable container.
• Lock the sortable containers min-height while dragging to prevent them from jumping when moving a widget to a closed sidebar.
• Move widgets dropped on closed sidebars to the top. UI Sortable places them randomly near the bottom.

Also tried to implement "jump-open" when holding a widget over a closed sidebar, however UI Sortable randomly fails to activate after the timeout and the dragged widget cannot be placed properly.

[shaunandrews]

Updating styles for sidebar description and widget-hover class.

[shaunandrews]

In 25952.7patch:

• Tweaks the styles for the sidebar description, removing the border-top and adding padding to align it with the rest of the text in the sidebar. Added a margin-top: -5px; to bring the description slightly closer to the sidebar name, making the context more obvious.
• Removing the gauche blue glow on closed sidebars when a widget is dragged overtop. Replaced it with a more subtle border color change, slight box-shadow, and subtle opacity.

[azaozz]

In 25952.8.patch:

• Merge the styling changes from 25952.7.patch.
• Kill some more !important and fix the draggable helper's size.
• Refresh after [26366].

[azaozz]

In 26426:

Widgets: drop onto closed sidebars.

• Make dropping a widget easier by preventing the source sidebar from resizing while the widget is being dragged.
• Move widgets dropped on closed sidebars to the top. UI Sortable places them randomly near the bottom.
• Fix possible regression in wp_list_widget_controls(), add an optional argument to output the sidebar name inside the sortable container.
• Updated styles for sidebar description and widget-hover class.

Part props shaunandrews, fixes #25952.

[azaozz]

In 26427:

Widgets: remove leftover debug bits and fix jshint warnings in widgets.js, see #25952.

[ocean90]

#21061 was marked as a duplicate.