WordPress.org

Make WordPress Core

Ticket #25952: 25952.3.diff

File 25952.3.diff, 4.4 KB (added by azaozz, 6 years ago)
  • src/wp-admin/css/wp-admin.css

     
    1031410314        margin: 10px 0 0 0;
    1031510315}
    1031610316
     10317/* Dropping a widget over a closed sidebar */
     10318div#widgets-right .widgets-holder-wrap.was-closed {
     10319        box-shadow: 0 0 3px 2px rgba(16, 117, 160, 0.9);
     10320}
     10321div#widgets-right .widgets-holder-wrap.ui-sidebar-droppable .sidebar-description,
     10322div#widgets-right .widgets-holder-wrap.ui-sidebar-droppable .widgets-sortables {
     10323        opacity: 0.3;
     10324}
     10325
    1031710326div#widgets-right .widget {
    1031810327        margin: 0 auto;
    1031910328        border: 1px solid #dedede !important; /* ln 991 in colors-fresh.css */
     
    1280412813        #wpadminbar #wp-admin-bar-wp-logo {
    1280512814                display: none;
    1280612815        }
    12807 }
    12808  No newline at end of file
     12816}
  • src/wp-admin/js/widgets.js

     
    8585                        zIndex: 100,
    8686                        containment: 'document',
    8787                        start: function(e,ui) {
     88                                // Mark the widget that is dragged. Needed as a workaround for dropping on a closed sidebar.
     89                                $(this).addClass('widget-in-question');
     90
    8891                                ui.helper.find('div.widget-description').hide();
    8992                                the_id = this.id;
    9093                        },
    9194                        stop: function() {
     95                                $(this).removeClass('widget-in-question');
     96
    9297                                if ( rem )
    9398                                        $(rem).hide();
    9499
     
    178183                        }
    179184                });
    180185
     186                // Open the sidebar (the sortable container) when dragging a widget over its title
     187                $('#widgets-right .widgets-holder-wrap').droppable({
     188                        accept: '.widget',
     189                        tolerance: 'pointer',
     190                        over: function( event, ui ) {
     191                                var sidebarWrap = $(this);
     192
     193                                if ( sidebarWrap.hasClass( 'closed' ) ) {
     194                                        sidebarWrap.addClass( 'was-closed' );
     195
     196                                        // Spring-loaded sidebars
     197                                        //window.sidebar_spring = setTimeout( function() {
     198                                        //      sidebarWrap.removeClass( 'closed' );
     199                                        //}, 1200 );
     200                                }
     201                        },
     202                        out: function() {
     203                                var sidebarWrap = $(this);
     204                                //clearTimeout( window.sidebar_spring );
     205                                if ( sidebarWrap.hasClass( 'was-closed' ) ) {
     206                                        sidebarWrap.addClass( 'closed' ).removeClass( 'was-closed' );
     207                                }
     208                        },
     209                        drop: function( event, ui ) {
     210                                var sidebarWrap = $(this);
     211
     212                                if ( sidebarWrap.hasClass( 'was-closed' ) ) {
     213                                        sidebarWrap.removeClass( 'was-closed' );
     214
     215                                        // Prepend the widget and save position
     216                                        self.addWidget( sidebarWrap.children('.widgets-sortables').attr('id') );
     217                                        self.clearWidgetSelection();
     218                                }
     219                        }
     220                });
     221
    181222                // Area Chooser
    182223                $( '#widgets-right .widgets-holder-wrap' ).each( function( index, element ) {
    183224                        var $element = $( element ),
     
    216257                        var $target = $( event.target );
    217258
    218259                        if ( $target.hasClass('button-primary') ) {
    219                                 self.addWidget( chooser );
     260                                self.addWidget( chooser.find( '.widgets-chooser-selected' ).data('sidebarId') );
    220261                                self.closeChooser();
    221262                        } else if ( $target.hasClass('button-secondary') ) {
    222263                                self.closeChooser();
     
    336377                });
    337378        },
    338379
    339         addWidget: function( chooser ) {
    340                 var widget = $('#available-widgets').find('.widget-in-question').clone(),
     380        addWidget: function( sidebarId ) {
     381                var top,
     382                        widget = $('#available-widgets').find('.widget-in-question').clone(),
    341383                        widgetId = widget.attr('id'),
    342384                        add = widget.find( 'input.add_new' ).val(),
    343385                        n = widget.find( 'input.multi_number' ).val(),
    344                         sidebarId = chooser.find( '.widgets-chooser-selected' ).data('sidebarId'),
    345386                        sidebar = $( '#' + sidebarId );
    346387
    347388                if ( 'multi' === add ) {
     
    369410                // No longer "new" widget
    370411                widget.find( 'input.add_new' ).val('');
    371412
    372                 $( 'html, body' ).animate({
    373                         scrollTop: sidebar.offset().top - 130
    374                 }, 200 );
     413                top = sidebar.offset().top;
    375414
     415                if ( top && top - 130 > 0 ) {
     416                        $( 'html, body' ).animate({
     417                                scrollTop: ( top - 130 )
     418                        }, 200 );
     419                }
     420
    376421                window.setTimeout( function() {
    377                         // Cannot use a callback in the animation above as it fires twice,
    378                         // have to queue this "by hand".
    379422                        widget.find( '.widget-title' ).trigger('click');
    380423                }, 250 );
    381424        },
     
    391434
    392435        clearWidgetSelection: function() {
    393436                $( '#widgets-left' ).removeClass( 'chooser' );
    394                 $( '#available-widgets' ).find( '.widget-in-question' ).removeClass( 'widget-in-question' );
     437                $( '.widget-in-question' ).removeClass( 'widget-in-question' );
    395438        }
    396439};
    397440