~canonical-sysadmins/wordpress/5.1.1

« back to all changes in this revision

Viewing changes to wp-admin/js/customize-widgets.js

  • Committer: Barry Price
  • Date: 2019-02-22 03:51:26 UTC
  • mfrom: (1.2.12 upstream)
  • Revision ID: barry.price@canonical.com-20190222035126-o28k38qs8jfyjsxt
Merge WP5.1 from upstream

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/**
 
2
 * @output wp-admin/js/customize-widgets.js
 
3
 */
 
4
 
1
5
/* global _wpCustomizeWidgetsSettings */
2
6
(function( wp, $ ){
3
7
 
7
11
        var api = wp.customize,
8
12
                l10n;
9
13
 
 
14
        /**
 
15
         * @namespace wp.customize.Widgets
 
16
         */
10
17
        api.Widgets = api.Widgets || {};
11
18
        api.Widgets.savedWidgetIds = {};
12
19
 
19
26
         *
20
27
         * A single widget model.
21
28
         *
22
 
         * @constructor
 
29
         * @class    wp.customize.Widgets.WidgetModel
23
30
         * @augments Backbone.Model
24
31
         */
25
 
        api.Widgets.WidgetModel = Backbone.Model.extend({
 
32
        api.Widgets.WidgetModel = Backbone.Model.extend(/** @lends wp.customize.Widgets.WidgetModel.prototype */{
26
33
                id: null,
27
34
                temp_id: null,
28
35
                classname: null,
45
52
         *
46
53
         * Collection for widget models.
47
54
         *
48
 
         * @constructor
49
 
         * @augments Backbone.Model
 
55
         * @class    wp.customize.Widgets.WidgetCollection
 
56
         * @augments Backbone.Collection
50
57
         */
51
 
        api.Widgets.WidgetCollection = Backbone.Collection.extend({
 
58
        api.Widgets.WidgetCollection = Backbone.Collection.extend(/** @lends wp.customize.Widgets.WidgetCollection.prototype */{
52
59
                model: api.Widgets.WidgetModel,
53
60
 
54
61
                // Controls searching on the current widget collection
103
110
         *
104
111
         * A single sidebar model.
105
112
         *
106
 
         * @constructor
 
113
         * @class    wp.customize.Widgets.SidebarModel
107
114
         * @augments Backbone.Model
108
115
         */
109
 
        api.Widgets.SidebarModel = Backbone.Model.extend({
 
116
        api.Widgets.SidebarModel = Backbone.Model.extend(/** @lends wp.customize.Widgets.SidebarModel.prototype */{
110
117
                after_title: null,
111
118
                after_widget: null,
112
119
                before_title: null,
123
130
         *
124
131
         * Collection for sidebar models.
125
132
         *
126
 
         * @constructor
 
133
         * @class    wp.customize.Widgets.SidebarCollection
127
134
         * @augments Backbone.Collection
128
135
         */
129
 
        api.Widgets.SidebarCollection = Backbone.Collection.extend({
 
136
        api.Widgets.SidebarCollection = Backbone.Collection.extend(/** @lends wp.customize.Widgets.SidebarCollection.prototype */{
130
137
                model: api.Widgets.SidebarModel
131
138
        });
132
139
        api.Widgets.registeredSidebars = new api.Widgets.SidebarCollection( api.Widgets.data.registeredSidebars );
133
140
 
134
 
        /**
135
 
         * wp.customize.Widgets.AvailableWidgetsPanelView
136
 
         *
137
 
         * View class for the available widgets panel.
138
 
         *
139
 
         * @constructor
140
 
         * @augments wp.Backbone.View
141
 
         * @augments Backbone.View
142
 
         */
143
 
        api.Widgets.AvailableWidgetsPanelView = wp.Backbone.View.extend({
 
141
        api.Widgets.AvailableWidgetsPanelView = wp.Backbone.View.extend(/** @lends wp.customize.Widgets.AvailableWidgetsPanelView.prototype */{
144
142
 
145
143
                el: '#available-widgets',
146
144
 
147
145
                events: {
148
146
                        'input #widgets-search': 'search',
149
 
                        'keyup #widgets-search': 'search',
150
147
                        'focus .widget-tpl' : 'focus',
151
148
                        'click .widget-tpl' : '_submit',
152
149
                        'keypress .widget-tpl' : '_submit',
162
159
                $clearResults: null,
163
160
                searchMatchesCount: null,
164
161
 
 
162
                /**
 
163
                 * View class for the available widgets panel.
 
164
                 *
 
165
                 * @constructs wp.customize.Widgets.AvailableWidgetsPanelView
 
166
                 * @augments   wp.Backbone.View
 
167
                 */
165
168
                initialize: function() {
166
169
                        var self = this;
167
170
 
197
200
                        api.previewer.bind( 'url', this.close );
198
201
                },
199
202
 
200
 
                // Performs a search and handles selected widget
 
203
                /**
 
204
                 * Performs a search and handles selected widget.
 
205
                 */
201
206
                search: function( event ) {
202
207
                        var firstVisible;
203
208
 
242
247
                        }
243
248
                },
244
249
 
245
 
                // Update the count of the available widgets that have the `search_matched` attribute.
 
250
                /**
 
251
                 * Updates the count of the available widgets that have the `search_matched` attribute.
 
252
                 */
246
253
                updateSearchMatchesCount: function() {
247
254
                        this.searchMatchesCount = this.collection.where({ search_matched: true }).length;
248
255
                },
249
256
 
250
 
                // Send a message to the aria-live region to announce how many search results.
 
257
                /**
 
258
                 * Sends a message to the aria-live region to announce how many search results.
 
259
                 */
251
260
                announceSearchMatches: _.debounce( function() {
252
261
                        var message = l10n.widgetsFound.replace( '%d', this.searchMatchesCount ) ;
253
262
 
258
267
                        wp.a11y.speak( message );
259
268
                }, 500 ),
260
269
 
261
 
                // Changes visibility of available widgets
 
270
                /**
 
271
                 * Changes visibility of available widgets.
 
272
                 */
262
273
                updateList: function() {
263
274
                        this.collection.each( function( widget ) {
264
275
                                var widgetTpl = $( '#widget-tpl-' + widget.id );
269
280
                        } );
270
281
                },
271
282
 
272
 
                // Highlights a widget
 
283
                /**
 
284
                 * Highlights a widget.
 
285
                 */
273
286
                select: function( widgetTpl ) {
274
287
                        this.selected = $( widgetTpl );
275
288
                        this.selected.siblings( '.widget-tpl' ).removeClass( 'selected' );
276
289
                        this.selected.addClass( 'selected' );
277
290
                },
278
291
 
279
 
                // Highlights a widget on focus
 
292
                /**
 
293
                 * Highlights a widget on focus.
 
294
                 */
280
295
                focus: function( event ) {
281
296
                        this.select( $( event.currentTarget ) );
282
297
                },
283
298
 
284
 
                // Submit handler for keypress and click on widget
 
299
                /**
 
300
                 * Handles submit for keypress and click on widget.
 
301
                 */
285
302
                _submit: function( event ) {
286
303
                        // Only proceed with keypress if it is Enter or Spacebar
287
304
                        if ( event.type === 'keypress' && ( event.which !== 13 && event.which !== 32 ) ) {
291
308
                        this.submit( $( event.currentTarget ) );
292
309
                },
293
310
 
294
 
                // Adds a selected widget to the sidebar
 
311
                /**
 
312
                 * Adds a selected widget to the sidebar.
 
313
                 */
295
314
                submit: function( widgetTpl ) {
296
315
                        var widgetId, widget, widgetFormControl;
297
316
 
319
338
                        this.close();
320
339
                },
321
340
 
322
 
                // Opens the panel
 
341
                /**
 
342
                 * Opens the panel.
 
343
                 */
323
344
                open: function( sidebarControl ) {
324
345
                        this.currentSidebarControl = sidebarControl;
325
346
 
346
367
                        }
347
368
                },
348
369
 
349
 
                // Closes the panel
 
370
                /**
 
371
                 * Closes the panel.
 
372
                 */
350
373
                close: function( options ) {
351
374
                        options = options || {};
352
375
 
362
385
                        this.$search.val( '' );
363
386
                },
364
387
 
365
 
                // Add keyboard accessiblity to the panel
 
388
                /**
 
389
                 * Adds keyboard accessiblity to the panel.
 
390
                 */
366
391
                keyboardAccessible: function( event ) {
367
392
                        var isEnter = ( event.which === 13 ),
368
393
                                isEsc = ( event.which === 27 ),
424
449
         * Handlers for the widget-synced event, organized by widget ID base.
425
450
         * Other widgets may provide their own update handlers by adding
426
451
         * listeners for the widget-synced event.
 
452
         *
 
453
         * @alias    wp.customize.Widgets.formSyncHandlers
427
454
         */
428
455
        api.Widgets.formSyncHandlers = {
429
456
 
446
473
                }
447
474
        };
448
475
 
449
 
        /**
450
 
         * wp.customize.Widgets.WidgetControl
451
 
         *
452
 
         * Customizer control for widgets.
453
 
         * Note that 'widget_form' must match the WP_Widget_Form_Customize_Control::$type
454
 
         *
455
 
         * @constructor
456
 
         * @augments wp.customize.Control
457
 
         */
458
 
        api.Widgets.WidgetControl = api.Control.extend({
 
476
        api.Widgets.WidgetControl = api.Control.extend(/** @lends wp.customize.Widgets.WidgetControl.prototype */{
459
477
                defaultExpandedArguments: {
460
478
                        duration: 'fast',
461
479
                        completeCallback: $.noop
462
480
                },
463
481
 
464
482
                /**
 
483
                 * wp.customize.Widgets.WidgetControl
 
484
                 *
 
485
                 * Customizer control for widgets.
 
486
                 * Note that 'widget_form' must match the WP_Widget_Form_Customize_Control::$type
 
487
                 *
465
488
                 * @since 4.1.0
 
489
                 *
 
490
                 * @constructs wp.customize.Widgets.WidgetControl
 
491
                 * @augments   wp.customize.Control
466
492
                 */
467
493
                initialize: function( id, options ) {
468
494
                        var control = this;
943
969
                 *
944
970
                 * @param {Boolean}   active
945
971
                 * @param {Object}    args
946
 
                 * @param {Callback}  args.completeCallback
 
972
                 * @param {function}  args.completeCallback
947
973
                 */
948
974
                onChangeActive: function ( active, args ) {
949
975
                        // Note: there is a second 'args' parameter being passed, merged on top of this.defaultActiveArguments
1574
1600
         * Customizer panel containing the widget area sections.
1575
1601
         *
1576
1602
         * @since 4.4.0
 
1603
         *
 
1604
         * @class    wp.customize.Widgets.WidgetsPanel
 
1605
         * @augments wp.customize.Panel
1577
1606
         */
1578
 
        api.Widgets.WidgetsPanel = api.Panel.extend({
 
1607
        api.Widgets.WidgetsPanel = api.Panel.extend(/** @lends wp.customize.Widgets.WigetsPanel.prototype */{
1579
1608
 
1580
1609
                /**
1581
1610
                 * Add and manage the display of the no-rendered-areas notice.
1604
1633
                                 */
1605
1634
                                getActiveSectionCount = function() {
1606
1635
                                        return _.filter( panel.sections(), function( section ) {
1607
 
                                                return section.active();
 
1636
                                                return 'sidebar' === section.params.type && section.active();
1608
1637
                                        } ).length;
1609
1638
                                };
1610
1639
 
1695
1724
         * Customizer section representing a widget area widget
1696
1725
         *
1697
1726
         * @since 4.1.0
 
1727
         *
 
1728
         * @class    wp.customize.Widgets.SidebarSection
 
1729
         * @augments wp.customize.Section
1698
1730
         */
1699
 
        api.Widgets.SidebarSection = api.Section.extend({
 
1731
        api.Widgets.SidebarSection = api.Section.extend(/** @lends wp.customize.Widgets.SidebarSection.prototype */{
1700
1732
 
1701
1733
                /**
1702
1734
                 * Sync the section's active state back to the Backbone model's is_rendered attribute
1722
1754
         *
1723
1755
         * @since 3.9.0
1724
1756
         *
1725
 
         * @constructor
 
1757
         * @class    wp.customize.Widgets.SidebarControl
1726
1758
         * @augments wp.customize.Control
1727
1759
         */
1728
 
        api.Widgets.SidebarControl = api.Control.extend({
 
1760
        api.Widgets.SidebarControl = api.Control.extend(/** @lends wp.customize.Widgets.SidebarControl.prototype */{
1729
1761
 
1730
1762
                /**
1731
1763
                 * Set up the control