WordPress.org
Get WordPress

Make WordPress Core

Ticket #25952: 25952.8.patch

File 25952.8.patch, 17.9 KB (added by azaozz, 10 years ago)

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

     
    99809980}
    99819981
    99829982
    9983 /* General Widget Styles */
     9983/* General Widgets Styles */
    99849984
    99859985.widget {
    9986         margin: 10px auto;
    9987         /* min-width: 50%; Not sure if this is needed */
     9986        margin: 0 auto 10px;
    99889987        position: relative;
    99899988        box-sizing: border-box;
    9990         -moz-box-sizing:border-box;
    9991         -webkit-box-sizing:border-box;
     9989        -moz-box-sizing: border-box;
     9990        -webkit-box-sizing: border-box;
    99929991}
    99939992
    99949993.widget-top {
    … …  
    1002110020}
    1002210021
    1002310022/* Widget Dragging Helpers */
    10024 
    1002510023.widget.ui-draggable-dragging {
    10026         width: 280px !important;
    10027         min-width: 280px !important;
     10024        width: 100%;
    1002810025}
    1002910026
    1003010027.widget.ui-sortable-helper {
    … …  
    1003410031
    1003510032.widget-placeholder {
    1003610033        border: 1px dashed #bbb;
    10037         margin: 10px 0;
     10034        margin: 0 auto 10px;
    1003810035        height: 45px;
    1003910036        width: 100%;
    1004010037        -webkit-box-sizing: border-box;
    … …  
    1004610043        margin-top: 0;
    1004710044}
    1004810045
     10046/* Override UI Sortable and Draggable inline style */
     10047#widgets-right .closed .widget-placeholder {
     10048        height: 0;
     10049        border: 0;
     10050        margin-top: -10px;
     10051}
     10052
    1004910053/* Widget Sidebars */
    1005010054.sidebar-name {
    1005110055        border: none;
    … …  
    1007410078}
    1007510079
    1007610080.widgets-holder-wrap .description {
    10077         padding: 0;
     10081        padding: 0 0 15px;
    1007810082        margin: 0;
    1007910083        font-style: normal;
    1008010084        color: #777;
    1008110085}
    1008210086
    10083 #available-widgets.widgets-holder-wrap .description {
    10084         padding-bottom: 10px;
     10087#widgets-right .widgets-holder-wrap .description {
     10088        padding-left: 15px;
     10089        padding-right: 15px;
    1008510090}
    1008610091
    1008710092/* Widgets 2-col Layout */
    … …  
    1014110146        font-size: 12px;
    1014210147}
    1014310148
     10149#available-widgets #widget-list {
     10150        position: relative;
     10151}
     10152
    1014410153/* Inactive Sidebars */
    1014510154#widgets-left .inactive-sidebar {
    1014610155        clear: both;
    … …  
    1019510204        margin: 10px 0 0 0;
    1019610205}
    1019710206
    10198 div#widgets-right .widget {
    10199         margin: 0 auto;
    10200         margin-bottom: 10px;
    10201 }
    10202 
    1020310207div#widgets-right .sidebar-description {
    10204         border-top: 1px solid #eeeeee;
    10205         padding: 10px 15px;
     10208        min-height: 20px;
     10209        margin-top: -5px;
    1020610210}
    1020710211
    10208 div#widgets-right .closed .sidebar-description {
    10209         display: none;
    10210 }
    10211 
    1021210212div#widgets-right .sidebar-name h3 {
    10213         padding: 15px 15px;
     10213        padding: 15px;
    1021410214}
    1021510215
    1021610216div#widgets-right .sidebar-name .sidebar-name-arrow:before {
    … …  
    1022610226        padding: 0 8px;
    1022710227        margin-bottom: 9px;
    1022810228        position: relative;
    10229         min-height: 50px;
     10229        min-height: 140px;
    1023010230}
    1023110231
     10232div#widgets-right .closed .widgets-sortables {
     10233        min-height: 0;
     10234        margin-bottom: 0;
     10235}
     10236
    1023210237.sidebar-name .spinner {
    1023310238        margin: -5px 5px;
    1023410239        float: none;
    1023510240}
    1023610241
     10242/* Dragging a widget over a closed sidebar */
     10243#widgets-right .widgets-holder-wrap.closed.widget-hover {
     10244        border-color: #777;
     10245        box-shadow: 0 1px 2px rgba(0,0,0,0.3);
     10246        opacity: 0.6;
     10247}
     10248
    1023710249/* Accessibility Mode */
    1023810250#available-widgets .widget-control-edit .edit {
    1023910251        display :none;
    1024010252}
     10253
    1024110254#available-widgets .widget-control-edit .add {
    1024210255        display: block;
    1024310256        position: absolute;
    … …  
    1025610269        padding: 16px 15px;
    1025710270        border-left: 1px solid #DDD;
    1025810271}
     10272
    1025910273#widgets-right .widget-control-edit .add {
    1026010274        display: none;
    1026110275}
     10276
    1026210277#widgets-right .widget-control-edit:hover {
    1026310278        background: #444;
    1026410279}
     10280
    1026510281#widgets-right .widget-control-edit:before {
    1026610282        content: '\f111';
    1026710283        display: inline-block;
    … …  
    1027410290        padding-right: 4px;
    1027510291}
    1027610292
     10293.widgets-holder-wrap .sidebar-name,
     10294.widgets-holder-wrap .sidebar-description {
     10295        -webkit-user-select: none;
     10296        -moz-user-select: none;
     10297        user-select: none;
     10298}
     10299
    1027710300.editwidget {
    1027810301        margin: 0 auto;
    1027910302}
    … …  
    1028110304        margin-top: 20px;
    1028210305}
    1028310306
    10284 .js .closed .widgets-sortables,
    10285 .js .closed .widget-holder,
     10307.js .widgets-holder-wrap.closed .widget,
     10308.js .widgets-holder-wrap.closed .sidebar-description,
    1028610309.js .closed br.clear {
    1028710310        display: none;
    1028810311}
     10312
    1028910313.nav-menus-php .item-edit:before,
    1029010314.widget-top a.widget-action:after,
    1029110315.control-section .accordion-section-title:after,

  • src/wp-admin/includes/widgets.php

     
    6363 * @since 2.5.0
    6464 *
    6565 * @param string $sidebar id slug of the sidebar
     66 * @param string optional $sidebar_name Include the HTML for the sidebar name
    6667 */
    67 function wp_list_widget_controls( $sidebar ) {
     68function wp_list_widget_controls( $sidebar, $sidebar_name = '' ) {
    6869        add_filter( 'dynamic_sidebar_params', 'wp_list_widget_controls_dynamic_sidebar' );
    6970
    7071        $description = wp_sidebar_description( $sidebar );
    7172
    72         if ( !empty( $description ) ) {
    73                 echo "<div class='sidebar-description'>\n";
    74                 echo "\t<p class='description'>$description</p>";
    75                 echo "</div>\n";
     73        echo '<div id="' . esc_attr( $sidebar ) . '" class="widgets-sortables">';
     74
     75        if ( $sidebar_name ) {
     76                ?>
     77                <div class="sidebar-name">
     78                        <div class="sidebar-name-arrow"><br /></div>
     79                        <h3><?php echo esc_html( $sidebar_name ); ?> <span class="spinner"></span></h3>
     80                </div>
     81                <?php
    7682        }
    7783
    78         echo "<div id='$sidebar' class='widgets-sortables'>\n";
     84        echo '<div class="sidebar-description">';
     85
     86        if ( ! empty( $description ) ) {
     87                echo '<p class="description">' . $description . '</p>';
     88        }
     89
     90        echo '</div>';
     91
    7992        dynamic_sidebar( $sidebar );
    80         echo "</div>\n";
     93
     94        echo '</div>';
    8195}
    8296
    8397/**

  • src/wp-admin/js/widgets.js

     
    1313                        isRTL = !! ( 'undefined' !== typeof isRtl && isRtl );
    1414
    1515                $('#widgets-right .sidebar-name').click( function() {
    16                         var $this = $(this), wrap = $this.closest('.widgets-holder-wrap');
     16                        var $this = $(this),
     17                                $wrap = $this.closest('.widgets-holder-wrap');
    1718
    18                         if ( wrap.hasClass('closed') ) {
    19                                 wrap.removeClass('closed');
    20                                 $this.siblings('.widgets-sortables').sortable('refresh');
     19                        if ( $wrap.hasClass('closed') ) {
     20                                $wrap.removeClass('closed');
     21                                $this.parent().sortable('refresh');
    2122                        } else {
    22                                 wrap.addClass('closed');
     23                                $wrap.addClass('closed');
    2324                        }
    2425                });
    2526
    26                 $('#widgets-left').children('.widgets-holder-wrap').children('.sidebar-name').click(function() {
    27                         $(this).parent().toggleClass('closed');
     27                $('#widgets-left .sidebar-name').click( function() {
     28                        $(this).closest('.widgets-holder-wrap').toggleClass('closed');
    2829                });
    2930
    30                 $(document.body).bind('click.widgets-toggle', function(e){
     31                $(document.body).bind('click.widgets-toggle', function(e) {
    3132                        var target = $(e.target),
    3233                                css = { 'z-index': 100 },
    3334                                widget, inside, targetWidth, widgetWidth, margin;
    … …  
    3637                                widget = target.closest('div.widget');
    3738                                inside = widget.children('.widget-inside');
    3839                                targetWidth = parseInt( widget.find('input.widget-width').val(), 10 ),
    39                                 widgetWidth = widget.width();
     40                                widgetWidth = widget.parent().width();
    4041
    4142                                if ( inside.is(':hidden') ) {
    4243                                        if ( targetWidth > 250 && ( targetWidth + 30 > widgetWidth ) && widget.closest('div.widgets-sortables').length ) {
    … …  
    6869                        }
    6970                });
    7071
    71                 sidebars.children('.widget').each(function() {
    72                         wpWidgets.appendTitle(this);
    73                         if ( $('p.widget-error', this).length ) {
    74                                 $('a.widget-action', this).click();
     72                sidebars.children('.widget').each( function() {
     73                        var $this = $(this);
     74
     75                        wpWidgets.appendTitle( this );
     76
     77                        if ( $this.find( 'p.widget-error' ).length ) {
     78                                $this.find( 'a.widget-action' ).trigger('click');
    7579                        }
    7680                });
    7781
    … …  
    112116                        cursor: 'move',
    113117                        distance: 2,
    114118                        containment: 'document',
    115                         start: function(e,ui) {
    116                                 var inside = ui.item.children('.widget-inside');
     119                        start: function( event, ui ) {
     120                                var inside = ui.item.children('.widget-inside'),
     121                                        $wrap = $(this).parent();
    117122
    118123                                if ( inside.css('display') === 'block' ) {
    119124                                        inside.hide();
    120125                                        $(this).sortable('refreshPositions');
    121126                                }
     127
     128                                // There is a bug in UI Sortable that prevents firing of "over" when dragging a connected Draggable.
     129                                // This won't be needed when the bug is fixed.
     130                                if ( $wrap.hasClass('closed') ) {
     131                                        $wrap.addClass('widget-hover');
     132                                }
    122133                        },
    123                         stop: function(e,ui) {
    124                                 if ( ui.item.hasClass('ui-draggable') && ui.item.data('draggable') ) {
    125                                         ui.item.draggable('destroy');
    126                                 }
    127134
    128                                 if ( ui.item.hasClass('deleting') ) {
    129                                         wpWidgets.save( ui.item, 1, 0, 1 ); // delete widget
    130                                         ui.item.remove();
     135                        stop: function( event, ui ) {
     136                                var addNew, widgetNumber, $sidebar, $children, child, item,
     137                                        $widget = ui.item,
     138                                        id = the_id;
     139
     140                                if ( $widget.hasClass('deleting') ) {
     141                                        wpWidgets.save( $widget, 1, 0, 1 ); // delete widget
     142                                        $widget.remove();
    131143                                        return;
    132144                                }
    133145
    134                                 var add = ui.item.find('input.add_new').val(),
    135                                         n = ui.item.find('input.multi_number').val(),
    136                                         id = the_id,
    137                                         sb = $(this).attr('id');
     146                                addNew = $widget.find('input.add_new').val();
     147                                widgetNumber = $widget.find('input.multi_number').val();
    138148
    139                                 ui.item.attr( 'style', '' );
     149                                $widget.attr( 'style', '' );
    140150                                the_id = '';
    141151
    142                                 if ( add ) {
    143                                         if ( 'multi' === add ) {
    144                                                 ui.item.html( ui.item.html().replace(/<[^<>]+>/g, function(m){ return m.replace(/__i__|%i%/g, n); }) );
    145                                                 ui.item.attr( 'id', id.replace('__i__', n) );
    146                                                 n++;
    147                                                 $('div#' + id).find('input.multi_number').val(n);
    148                                         } else if ( 'single' === add ) {
    149                                                 ui.item.attr( 'id', 'new-' + id );
     152                                if ( addNew ) {
     153                                        if ( 'multi' === addNew ) {
     154                                                $widget.html(
     155                                                        $widget.html().replace( /<[^<>]+>/g, function( tag ) {
     156                                                                return tag.replace( /__i__|%i%/g, widgetNumber );
     157                                                        })
     158                                                );
     159
     160                                                $widget.attr( 'id', id.replace( '__i__', widgetNumber ) );
     161                                                widgetNumber++;
     162
     163                                                $( 'div#' + id ).find( 'input.multi_number' ).val( widgetNumber );
     164                                        } else if ( 'single' === addNew ) {
     165                                                $widget.attr( 'id', 'new-' + id );
    150166                                                rem = 'div#' + id;
    151167                                        }
    152                                         wpWidgets.save( ui.item, 0, 0, 1 );
    153                                         ui.item.find('input.add_new').val('');
    154                                         ui.item.find('a.widget-action').click();
    155                                         return;
     168
     169                                        wpWidgets.save( $widget, 0, 0, 1 );
     170                                        $widget.find('input.add_new').val('');
    156171                                }
    157                                 wpWidgets.saveOrder(sb);
     172
     173                                $sidebar = $widget.parent();
     174
     175                                if ( $sidebar.parent().hasClass('closed') ) {
     176                                        $sidebar.parent().removeClass('widget-hover closed jump-open');
     177                                        $children = $sidebar.children('.widget');
     178
     179                                        // Make sure the dropped widget is at the top
     180                                        if ( $children.length > 1 ) {
     181                                                child = $children.get(0);
     182                                                item = $widget.get(0);
     183
     184                                                if ( child.id && item.id && child.id !== item.id ) {
     185                                                        $( child ).before( $widget );
     186                                                }
     187                                        }
     188                                }
     189
     190                                if ( addNew ) {
     191                                        $widget.find( 'a.widget-action' ).trigger('click');
     192                                } else {
     193                                        wpWidgets.saveOrder( $sidebar.attr('id') );
     194                                }
    158195                        },
    159                         receive: function(e, ui) {
    160                                 var sender = $(ui.sender);
    161196
    162                                 if ( ! $(this).is(':visible') || this.id.indexOf('orphaned_widgets') > -1 ) {
    163                                         sender.sortable('cancel');
     197                        over: function( event, ui ) {
     198                                var $wrap = $(this).parent();
     199
     200                                if ( $wrap.hasClass('closed') ) {
     201                                        $wrap.addClass('widget-hover');
    164202                                }
     203                        },
    165204
    166                                 if ( sender.attr('id').indexOf('orphaned_widgets') > -1 && !sender.children('.widget').length ) {
    167                                         sender.parents('.orphan-sidebar').slideUp(400, function(){ $(this).remove(); });
     205                        out: function( event, ui ) {
     206                                $(this).parent().removeClass('widget-hover');
     207                        },
     208
     209                        activate: function( event, ui ) {
     210                                // Lock all sidebars min-height when starting to drag.
     211                                // Prevents jumping when dragging a widget from an open sidebar to a closed sidebar below.
     212                                $(this).css( 'min-height', $(this).height() + 'px' );
     213                        },
     214
     215                        deactivate: function( event, ui ) {
     216                                $(this).css( 'min-height', '' );
     217                        },
     218
     219                        receive: function( event, ui ) {
     220                                var $sender = $( ui.sender );
     221
     222                                // Don't add more widgets to orphaned sidebars
     223                                if ( this.id.indexOf('orphaned_widgets') > -1 ) {
     224                                        $sender.sortable('cancel');
     225                                        return;
    168226                                }
     227
     228                                // If the last widget was moved out of an orphaned sidebar, close and remove it.
     229                                if ( $sender.attr('id').indexOf('orphaned_widgets') > -1 && ! $sender.children('.widget').length ) {
     230                                        $sender.parents('.orphan-sidebar').slideUp( 400, function(){ $(this).remove(); } );
     231                                }
    169232                        }
    170                 }).sortable('option', 'connectWith', 'div.widgets-sortables');
     233                }).sortable( 'option', 'connectWith', 'div.widgets-sortables' );
    171234
    172235                $('#available-widgets').droppable({
    173236                        tolerance: 'pointer',
    … …  
    210273                });
    211274
    212275                $( '#available-widgets .widget .widget-title' ).on( 'click.widgets-chooser', function() {
    213                         var widget = $(this).closest( '.widget' );
     276                        var $widget = $(this).closest( '.widget' );
    214277
    215                         if ( widget.hasClass( 'widget-in-question' ) || ( $( '#widgets-left' ).hasClass( 'chooser' ) ) ) {
     278                        if ( $widget.hasClass( 'widget-in-question' ) || $( '#widgets-left' ).hasClass( 'chooser' ) ) {
    216279                                self.closeChooser();
    217280                        } else {
    218281                                // Open the chooser
    219282                                self.clearWidgetSelection();
    220283                                $( '#widgets-left' ).addClass( 'chooser' );
    221                                 widget.addClass( 'widget-in-question' );
     284                                $widget.addClass( 'widget-in-question' ).children( '.widget-description' ).after( chooser );
    222285
    223                                 widget.find( '.widget-description' ).after( chooser );
    224286                                chooser.slideDown( 300, function() {
    225287                                        selectSidebar.find('.widgets-chooser-selected').focus();
    226288                                });
    … …  
    257319                });
    258320        },
    259321
    260         saveOrder : function(sb) {
    261                 if ( sb ) {
    262                         $('#' + sb).closest('div.widgets-holder-wrap').find('.spinner:first').css('display', 'inline-block');
    263                 }
    264 
    265                 var a = {
     322        saveOrder : function( sidebarId ) {
     323                var data = {
    266324                        action: 'widgets-order',
    267325                        savewidgets: $('#_wpnonce_widgets').val(),
    268326                        sidebars: []
    269327                };
    270328
     329                if ( sidebarId ) {
     330                        $( '#' + sidebarId ).find('.spinner:first').css('display', 'inline-block');
     331                }
     332
    271333                $('div.widgets-sortables').each( function() {
    272334                        if ( $(this).sortable ) {
    273                                 a['sidebars[' + $(this).attr('id') + ']'] = $(this).sortable('toArray').join(',');
     335                                data['sidebars[' + $(this).attr('id') + ']'] = $(this).sortable('toArray').join(',');
    274336                        }
    275337                });
    276338
    277                 $.post( ajaxurl, a, function() {
     339                $.post( ajaxurl, data, function() {
    278340                        $('.spinner').hide();
    279341                });
    280342        },
    281343
    282         save : function(widget, del, animate, order) {
    283                 var sb = widget.closest('div.widgets-sortables').attr('id'), data = widget.find('form').serialize(), a;
     344        save : function( widget, del, animate, order ) {
     345                var sidebarId = widget.closest('div.widgets-sortables').attr('id'),
     346                        data = widget.find('form').serialize(), a;
     347               
    284348                widget = $(widget);
    285349                $('.spinner', widget).show();
    286350
    … …  
    287351                a = {
    288352                        action: 'save-widget',
    289353                        savewidgets: $('#_wpnonce_widgets').val(),
    290                         sidebar: sb
     354                        sidebar: sidebarId
    291355                };
    292356
    293357                if ( del ) {
    … …  
    296360
    297361                data += '&' + $.param(a);
    298362
    299                 $.post( ajaxurl, data, function(r){
     363                $.post( ajaxurl, data, function(r) {
    300364                        var id;
    301365
    302366                        if ( del ) {
    … …  
    321385                        } else {
    322386                                $('.spinner').hide();
    323387                                if ( r && r.length > 2 ) {
    324                                         $('div.widget-content', widget).html(r);
    325                                         wpWidgets.appendTitle(widget);
     388                                        $( 'div.widget-content', widget ).html(r);
     389                                        wpWidgets.appendTitle( widget );
    326390                                }
    327391                        }
    328392                        if ( order ) {
    … …  
    379443
    380444                // Open the widgets container
    381445                sidebar.closest( '.widgets-holder-wrap' ).removeClass('closed');
     446
     447                sidebar.find('.sidebar-description').after( widget );
    382448                sidebar.sortable('refresh');
    383449
    384                 widget.prependTo( sidebar );
    385 
    386450                wpWidgets.save( widget, 0, 0, 1 );
    387451                // No longer "new" widget
    388452                widget.find( 'input.add_new' ).val('');

  • src/wp-admin/widgets.php

     
    332332<div id="widgets-left">
    333333        <div id="available-widgets" class="widgets-holder-wrap">
    334334                <div class="sidebar-name">
    335                 <div class="sidebar-name-arrow"><br /></div>
    336                 <h3><?php _e('Available Widgets'); ?> <span id="removing-widget"><?php _ex('Deactivate', 'removing-widget'); ?> <span></span></span></h3></div>
     335                        <div class="sidebar-name-arrow"><br /></div>
     336                        <h3><?php _e('Available Widgets'); ?> <span id="removing-widget"><?php _ex('Deactivate', 'removing-widget'); ?> <span></span></span></h3>
     337                </div>
    337338                <div class="widget-holder">
    338                 <p class="description"><?php _e('Drag widgets from here to a sidebar on the right to activate them. Drag widgets back here to deactivate them and delete their settings.'); ?></p>
    339                 <div id="widget-list">
    340                 <?php wp_list_widgets(); ?>
     339                        <div class="sidebar-description">
     340                                <p class="description"><?php _e('Drag widgets from here to a sidebar on the right to activate them. Drag widgets back here to deactivate them and delete their settings.'); ?></p>
     341                        </div>
     342                        <div id="widget-list">
     343                                <?php wp_list_widgets(); ?>
     344                        </div>
     345                        <br class='clear' />
    341346                </div>
    342                 <br class='clear' />
    343                 </div>
    344347                <br class="clear" />
    345348        </div>
    346349
    … …  
    355358
    356359                ?>
    357360                <div class="<?php echo esc_attr( $wrap_class ); ?>">
    358                         <div class="sidebar-name">
    359                                 <div class="sidebar-name-arrow"><br /></div>
    360                                 <h3><?php echo esc_html( $registered_sidebar['name'] ); ?> <span class="spinner"></span></h3>
    361                         </div>
    362361                        <div class="widget-holder inactive">
    363                                 <?php wp_list_widget_controls( $registered_sidebar['id'] ); ?>
     362                                <?php wp_list_widget_controls( $registered_sidebar['id'], $registered_sidebar['name'] ); ?>
    364363                                <div class="clear"></div>
    365364                        </div>
    366365                </div>
    367366                <?php
     367
    368368        } else {
    369369                $theme_sidebars[$sidebar] = $registered_sidebar;
    370370        }
    … …  
    407407
    408408        ?>
    409409        <div class="<?php echo esc_attr( $wrap_class ); ?>">
    410                 <div class="sidebar-name">
    411                         <div class="sidebar-name-arrow"><br /></div>
    412                         <h3><?php echo esc_html( $registered_sidebar['name'] ); ?>      <span class="spinner"></span></h3>
    413                 </div>
    414                 <?php wp_list_widget_controls( $sidebar ); // Show the control forms for each of the widgets in this sidebar ?>
     410                <?php wp_list_widget_controls( $sidebar, $registered_sidebar['name'] ); // Show the control forms for each of the widgets in this sidebar ?>
    415411        </div>
    416412        <?php
    417413