WordPress.org

Make WordPress Core

Changeset 26366


Ignore:
Timestamp:
11/24/2013 10:06:13 PM (6 years ago)
Author:
azaozz
Message:

Widgets:

  • Don't deactivate "draggable" on the widget when the chooser is open. Makes it possible to still drag the "widget-in-question".
  • Change the chooser's HTML id to a class to avoid collisions when cloning.
  • Refresh the "sortable" positions when an open widget is dragged. Fixes problems moving the widget up or down in the same sidebar.

See #25821

Location:
trunk/src/wp-admin
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/wp-admin.css

    r26338 r26366  
    890890input[type="radio"]:focus,
    891891select:focus,
    892 #widgets-chooser ul,
     892.widgets-chooser ul,
    893893#widgets-left .widget-in-question .widget-top,
    894894#available-widgets .widget-top:hover,
     
    1039310393}
    1039410394
    10395 #widgets-chooser ul.widgets-chooser-sidebars {
     10395.widgets-chooser ul.widgets-chooser-sidebars {
    1039610396    margin: 0;
    1039710397    list-style-type: none;
     
    1040010400}
    1040110401
    10402 #widgets-chooser {
     10402.widgets-chooser {
    1040310403    display: none;
    1040410404}
    1040510405
    10406 #widgets-chooser ul {
     10406.widgets-chooser ul {
    1040710407    border: 1px solid #ccc;
    1040810408}
    1040910409
    10410 #widgets-chooser li {
     10410.widgets-chooser li {
    1041110411    padding: 10px 15px 10px 35px;
    1041210412    border-bottom: 1px solid #ccc;
     
    1041910419}
    1042010420
    10421 #widgets-chooser li:hover,
    10422 #widgets-chooser li:focus {
     10421.widgets-chooser li:hover,
     10422.widgets-chooser li:focus {
    1042310423    background: rgba(255,255,255,0.7);
    1042410424}
    1042510425
    10426 #widgets-chooser li:focus:before {
     10426.widgets-chooser li:focus:before {
    1042710427    content: '\f147';
    1042810428    display: block;
     
    1043510435}
    1043610436
    10437 #widgets-chooser li:last-child {
     10437.widgets-chooser li:last-child {
    1043810438    border: none;
    1043910439}
    1044010440
    10441 #widgets-chooser li.widgets-chooser-selected {
     10441.widgets-chooser li.widgets-chooser-selected {
    1044210442    background: #2ea2cc;
    1044310443    color: #fff;
    1044410444}
    1044510445
    10446 #widgets-chooser li.widgets-chooser-selected:before,
    10447 #widgets-chooser li.widgets-chooser-selected:focus:before {
     10446.widgets-chooser li.widgets-chooser-selected:before,
     10447.widgets-chooser li.widgets-chooser-selected:focus:before {
    1044810448    content: '\f147';
    1044910449    display: block;
     
    1045610456}
    1045710457
    10458 #widgets-chooser .widgets-chooser-actions {
     10458.widgets-chooser .widgets-chooser-actions {
    1045910459    padding: 10px 0 12px 0;
    1046010460    text-align: center;
    1046110461}
    1046210462
    10463 #widgets-chooser button {
     10463.widgets-chooser button {
    1046410464    margin-right: 5px;
    1046510465}
  • trunk/src/wp-admin/js/widgets.js

    r26306 r26366  
    88        var rem, the_id,
    99            self = this,
    10             chooser = $('#widgets-chooser'),
     10            chooser = $('.widgets-chooser'),
    1111            selectSidebar = chooser.find('.widgets-chooser-sidebars'),
    1212            sidebars = $('div.widgets-sortables'),
     
    8383            zIndex: 100,
    8484            containment: 'document',
    85             start: function(e,ui) {
     85            start: function( event, ui ) {
     86                var chooser = $(this).find('.widgets-chooser');
     87
    8688                ui.helper.find('div.widget-description').hide();
    8789                the_id = this.id;
     90
     91                if ( chooser.length ) {
     92                    // Hide the chooser and move it out of the widget
     93                    $( '#wpbody-content' ).append( chooser.hide() );
     94                    // Delete the cloned chooser from the drag helper
     95                    ui.helper.find('.widgets-chooser').remove();
     96                    self.clearWidgetSelection();
     97                }
    8898            },
    8999            stop: function() {
     
    104114            containment: 'document',
    105115            start: function(e,ui) {
    106                 ui.item.children('.widget-inside').hide();
     116                var inside = ui.item.children('.widget-inside');
     117
     118                if ( inside.css('display') === 'block' ) {
     119                    inside.hide();
     120                    $(this).sortable('refreshPositions');
     121                }
    107122            },
    108123            stop: function(e,ui) {
     
    204219                self.clearWidgetSelection();
    205220                $( '#widgets-left' ).addClass( 'chooser' );
    206                 widget.addClass( 'widget-in-question' ).draggable('disable');
     221                widget.addClass( 'widget-in-question' );
    207222
    208223                widget.find( '.widget-description' ).after( chooser );
     
    387402        var self = this;
    388403
    389         $( '#widgets-chooser' ).slideUp( 200, function() {
     404        $( '.widgets-chooser' ).slideUp( 200, function() {
    390405            $( '#wpbody-content' ).append( this );
    391             $( '#widgets-left .widget-in-question' ).draggable('enable');
    392406            self.clearWidgetSelection();
    393407        });
  • trunk/src/wp-admin/widgets.php

    r26293 r26366  
    429429</div>
    430430
    431 <div id="widgets-chooser">
     431<div class="widgets-chooser">
    432432    <ul class="widgets-chooser-sidebars"></ul>
    433433    <div class="widgets-chooser-actions">
Note: See TracChangeset for help on using the changeset viewer.