WordPress.org

Make WordPress Core

Changeset 40312


Ignore:
Timestamp:
03/22/17 19:02:26 (5 months ago)
Author:
westonruter
Message:

Customize: Show notice in Widgets panel when there are additional widget areas not rendered in preview.

This extends the existing behavior which only showed a message only when there were no widget areas rendered in the preview. The number of non-rendered widget areas is indicated. Also removes needles deletion of wp.customize.Widgets.data.l10n property which hindered plugins.

See #33567, #33052.
Fixes #39087.

Location:
trunk
Files:
4 edited

Legend:

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

    r40059 r40312  
    163163#customize-controls .customize-info .customize-panel-description.open + .no-widget-areas-rendered-notice { 
    164164    border-top: none; 
     165} 
     166.no-widget-areas-rendered-notice { 
     167    font-style: italic; 
     168} 
     169.no-widget-areas-rendered-notice p:first-child { 
     170    margin-top: 0; 
     171} 
     172.no-widget-areas-rendered-notice p:last-child { 
     173    margin-bottom: 0; 
    165174} 
    166175 
  • trunk/src/wp-admin/js/customize-widgets.js

    r38810 r40312  
    1414    api.Widgets.data = _wpCustomizeWidgetsSettings || {}; 
    1515    l10n = api.Widgets.data.l10n; 
    16     delete api.Widgets.data.l10n; 
    1716 
    1817    /** 
     
    15781577 
    15791578            panel.deferred.embedded.done(function() { 
    1580                 var panelMetaContainer, noRenderedAreasNotice, shouldShowNotice; 
     1579                var panelMetaContainer, noticeContainer, updateNotice, getActiveSectionCount, shouldShowNotice; 
    15811580                panelMetaContainer = panel.container.find( '.panel-meta' ); 
    1582                 noRenderedAreasNotice = $( '<div></div>', { 
     1581 
     1582                // @todo This should use the Notifications API introduced to panels. See <https://core.trac.wordpress.org/ticket/38794>. 
     1583                noticeContainer = $( '<div></div>', { 
    15831584                    'class': 'no-widget-areas-rendered-notice' 
    15841585                }); 
    1585                 noRenderedAreasNotice.append( $( '<em></em>', { 
    1586                     text: l10n.noAreasRendered 
    1587                 } ) ); 
    1588                 panelMetaContainer.append( noRenderedAreasNotice ); 
    1589  
     1586                panelMetaContainer.append( noticeContainer ); 
     1587 
     1588                /** 
     1589                 * Get the number of active sections in the panel. 
     1590                 * 
     1591                 * @return {number} Number of active sidebar sections. 
     1592                 */ 
     1593                getActiveSectionCount = function() { 
     1594                    return _.filter( panel.sections(), function( section ) { 
     1595                        return section.active(); 
     1596                    } ).length; 
     1597                }; 
     1598 
     1599                /** 
     1600                 * Determine whether or not the notice should be displayed. 
     1601                 * 
     1602                 * @return {boolean} 
     1603                 */ 
    15901604                shouldShowNotice = function() { 
    1591                     return ( 0 === _.filter( panel.sections(), function( section ) { 
    1592                         return section.active(); 
    1593                     } ).length ); 
     1605                    var activeSectionCount = getActiveSectionCount(); 
     1606                    if ( 0 === activeSectionCount ) { 
     1607                        return true; 
     1608                    } else { 
     1609                        return activeSectionCount !== api.Widgets.data.registeredSidebars.length; 
     1610                    } 
    15941611                }; 
     1612 
     1613                /** 
     1614                 * Update the notice. 
     1615                 * 
     1616                 * @returns {void} 
     1617                 */ 
     1618                updateNotice = function() { 
     1619                    var activeSectionCount = getActiveSectionCount(), message, nonRenderedAreaCount, registeredAreaCount; 
     1620                    noticeContainer.empty(); 
     1621 
     1622                    registeredAreaCount = api.Widgets.data.registeredSidebars.length; 
     1623                    if ( activeSectionCount !== registeredAreaCount ) { 
     1624 
     1625                        if ( 0 !== activeSectionCount ) { 
     1626                            nonRenderedAreaCount = registeredAreaCount - activeSectionCount; 
     1627                            message = ( 1 === nonRenderedAreaCount ? l10n.someAreasShown.singular : l10n.someAreasShown.plural ).replace( '%d', nonRenderedAreaCount ); 
     1628                        } else { 
     1629                            message = ( 1 === registeredAreaCount ? l10n.noAreasShown.singular : l10n.noAreasShown.plural ).replace( '%d', registeredAreaCount ); 
     1630                        } 
     1631 
     1632                        noticeContainer.append( $( '<p></p>', { 
     1633                            text: message 
     1634                        } ) ); 
     1635                        noticeContainer.append( $( '<p></p>', { 
     1636                            text: l10n.navigatePreview 
     1637                        } ) ); 
     1638                    } 
     1639                }; 
     1640                updateNotice(); 
    15951641 
    15961642                /* 
     
    15981644                 * Update the visibility of the notice whenever a reflow happens. 
    15991645                 */ 
    1600                 noRenderedAreasNotice.toggle( shouldShowNotice() ); 
     1646                noticeContainer.toggle( shouldShowNotice() ); 
    16011647                api.previewer.deferred.active.done( function () { 
    1602                     noRenderedAreasNotice.toggle( shouldShowNotice() ); 
     1648                    noticeContainer.toggle( shouldShowNotice() ); 
    16031649                }); 
    16041650                api.bind( 'pane-contents-reflowed', function() { 
    16051651                    var duration = ( 'resolved' === api.previewer.deferred.active.state() ) ? 'fast' : 0; 
     1652                    updateNotice(); 
    16061653                    if ( shouldShowNotice() ) { 
    1607                         noRenderedAreasNotice.slideDown( duration ); 
     1654                        noticeContainer.slideDown( duration ); 
    16081655                    } else { 
    1609                         noRenderedAreasNotice.slideUp( duration ); 
     1656                        noticeContainer.slideUp( duration ); 
    16101657                    } 
    16111658                }); 
  • trunk/src/wp-includes/class-wp-customize-widgets.php

    r39951 r40312  
    733733                'widgetMovedUp'    => __( 'Widget moved up' ), 
    734734                'widgetMovedDown'  => __( 'Widget moved down' ), 
    735                 'noAreasRendered'  => __( 'There are no widget areas on the page shown, however other pages in this theme do have them.' ), 
     735                'navigatePreview'  => __( 'You can navigate to other pages on your site while using the Customizer to view and edit the widgets displayed on those pages.' ), 
     736                'someAreasShown'   => wp_array_slice_assoc( 
     737                    /* translators: placeholder is the number of other widget areas registered */ 
     738                    _n_noop( 
     739                        'Your theme has %d other widget area, but this particular page doesn\'t display it.', 
     740                        'Your theme has %d other widget areas, but this particular page doesn\'t display them.' 
     741                    ), 
     742                    array( 'singular', 'plural' ) 
     743                ), 
     744                'noAreasShown'    => wp_array_slice_assoc( 
     745                    /* translators: placeholder is the total number of widget areas registered */ 
     746                    _n_noop( 
     747                        'Your theme has %d widget area, but this particular page doesn\'t display it.', 
     748                        'Your theme has %d widget areas, but this particular page doesn\'t display them.' 
     749                    ), 
     750                    array( 'singular', 'plural' ) 
     751                ), 
    736752                'reorderModeOn'    => __( 'Reorder mode enabled' ), 
    737753                'reorderModeOff'   => __( 'Reorder mode closed' ), 
    738754                'reorderLabelOn'   => esc_attr__( 'Reorder widgets' ), 
     755                /* translators: placeholder is the count for the number of widgets found */ 
    739756                'widgetsFound'     => __( 'Number of widgets found: %d' ), 
    740757                'noWidgetsFound'   => __( 'No widgets found.' ), 
  • trunk/tests/qunit/fixtures/customize-widgets.js

    r38672 r40312  
    4747    ], 
    4848    'l10n': { 
     49        'error': 'An error has occurred. Please reload the page and try again.', 
     50        'navigatePreview': 'You can navigate to other pages on your site while using the Customizer to view and edit the widgets displayed on those pages.', 
     51        'noAreasShown': { 
     52            'plural': 'Your theme has %d widget areas, but this particular page doesn\'t display them.', 
     53            'singular': 'Your theme has %d widget area, but this particular page doesn\'t display it.' 
     54        }, 
     55        'noWidgetsFound': 'No widgets found.', 
     56        'removeBtnLabel': 'Remove', 
     57        'removeBtnTooltip': 'Trash widget by moving it to the inactive widgets sidebar.', 
     58        'reorderLabelOn': 'Reorder widgets', 
     59        'reorderModeOff': 'Reorder mode closed', 
     60        'reorderModeOn': 'Reorder mode enabled', 
    4961        'saveBtnLabel': 'Apply', 
    5062        'saveBtnTooltip': 'Save and preview changes before publishing them.', 
    51         'removeBtnLabel': 'Remove', 
    52         'removeBtnTooltip': 'Trash widget by moving it to the inactive widgets sidebar.', 
    53         'error': 'An error has occurred. Please reload the page and try again.', 
     63        'someAreasShown': { 
     64            'plural': 'Your theme has %d other widget areas, but this particular page doesn\'t display them.', 
     65            'singular': 'Your theme has %d other widget area, but this particular page doesn\'t display it.' 
     66        }, 
     67        'widgetMovedDown': 'Widget moved down', 
    5468        'widgetMovedUp': 'Widget moved up', 
    55         'widgetMovedDown': 'Widget moved down' 
     69        'widgetsFound': 'Number of widgets found: %d' 
    5670    }, 
    5771    'tpl': { 
Note: See TracChangeset for help on using the changeset viewer.