WordPress.org

Make WordPress Core

Changeset 40312


Ignore:
Timestamp:
03/22/2017 07:02:26 PM (14 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.