WordPress.org

Make WordPress Core

Ticket #25952: 25952.2.diff

File 25952.2.diff, 2.8 KB (added by shaunandrews, 6 years ago)

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

  • src/wp-admin/css/wp-admin.css

     
    99879987        margin: 10px 0 0 0;
    99889988}
    99899989
     9990/* Dropping a widget over a closed sidebar */
     9991div#widgets-right .widgets-holder-wrap.ui-sidebar-droppable {
     9992        box-shadow: 0 0 3px 2px rgba(16, 117, 160, 0.9);
     9993}
     9994div#widgets-right .widgets-holder-wrap.ui-sidebar-droppable .sidebar-description,
     9995div#widgets-right .widgets-holder-wrap.ui-sidebar-droppable .widgets-sortables {
     9996        opacity: 0.3;
     9997}
     9998
    99909999div#widgets-right .widget {
    999110000        margin: 0 auto;
    999210001        border: 1px solid #dedede !important; /* ln 991 in colors-fresh.css */
  • src/wp-admin/js/widgets.js

     
    178178                        }
    179179                });
    180180
     181                // Open the sidebar (the sortable container) when dragging a widget over its title
     182                $('#widgets-right .widgets-holder-wrap').droppable({
     183                        accept: '.widget',
     184                        tolerance: 'pointer',
     185                        over: function() {
     186                                var sidebar = $(this);
     187                                if ( sidebar.hasClass( 'closed' ) ) {
     188                                        sidebar.addClass( 'was-closed' );
     189                                        sidebar.addClass( 'ui-sidebar-droppable' );
     190
     191                                        // Spring-loaded sidebars
     192                                        //window.sidebar_spring = setTimeout( function() {
     193                                        //      sidebar.removeClass( 'closed' );
     194                                        //}, 1200 );
     195                                }
     196                        },
     197                        out: function() {
     198                                var sidebar = $(this);
     199                                //clearTimeout( window.sidebar_spring );
     200                                if ( sidebar.hasClass( 'was-closed' ) ) {
     201                                        sidebar.addClass( 'closed' );
     202                                        sidebar.removeClass( 'ui-sidebar-droppable' );
     203                                }
     204                        },
     205                        drop: function( event, ui ) {
     206                                var sidebar = $(this);
     207
     208                                if ( sidebar.hasClass( 'was-closed' ) ) {
     209                                        var sidebar_widgets = sidebar.find( '.widgets-sortables' ),
     210                                                id = the_id,
     211                                                new_widget = ui.draggable.clone(),
     212                                                n = new_widget.find( 'input.multi_number' ).val();
     213
     214                                        sidebar.removeClass( 'ui-sidebar-droppable' );
     215
     216                                        new_widget.html( ui.draggable.html().replace(/<[^<>]+>/g, function(m){ return m.replace(/__i__|%i%/g, n); } ) );
     217                                        new_widget.attr( 'id', id.replace('__i__', n) );
     218                                        n++;
     219                                        $('div#' + id).find('input.multi_number').val(n);
     220                                        new_widget.find('input.add_new').val('');
     221
     222                                        new_widget.prependTo( sidebar_widgets );
     223                                       
     224                                        sidebar.removeClass( 'closed' );
     225                                        sidebar.removeClass( 'was-closed' );
     226                                        setTimeout( function() {
     227                                                new_widget.find('a.widget-action').click();
     228                                        }, 300 );
     229
     230                                        wpWidgets.save( new_widget, 0, 0, 1 );
     231                                        sidebar_widgets.sortable('refresh');
     232                                }
     233                        }
     234                });
     235
    181236                // Area Chooser
    182237                $( '#widgets-right .widgets-holder-wrap' ).each( function( index, element ) {
    183238                        var $element = $( element ),