<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[27995] trunk/src/wp-admin/js/customize-widgets.js: Widget Customizer: Cleanup `wp.customize.Widgets.SidebarControl`.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://core.trac.wordpress.org/changeset/27995">27995</a></dd>
<dt>Author</dt> <dd>ocean90</dd>
<dt>Date</dt> <dd>2014-04-07 19:59:49 +0000 (Mon, 07 Apr 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>Widget Customizer: Cleanup `wp.customize.Widgets.SidebarControl`.
see <a href="http://core.trac.wordpress.org/ticket/27690">#27690</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpadminjscustomizewidgetsjs">trunk/src/wp-admin/js/customize-widgets.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcwpadminjscustomizewidgetsjs"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-admin/js/customize-widgets.js (27994 => 27995)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-admin/js/customize-widgets.js 2014-04-07 19:39:55 UTC (rev 27994)
+++ trunk/src/wp-admin/js/customize-widgets.js 2014-04-07 19:59:49 UTC (rev 27995)
</span><span class="lines">@@ -529,7 +529,7 @@
</span><span class="cx"> this.container.find( '.widget-top' ).on( 'click', function( e ) {
</span><span class="cx"> e.preventDefault();
</span><span class="cx"> var sidebarWidgetsControl = self.getSidebarWidgetsControl();
</span><del>- if ( sidebarWidgetsControl.is_reordering ) {
</del><ins>+ if ( sidebarWidgetsControl.isReordering ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx"> self.toggleForm();
</span><span class="lines">@@ -606,14 +606,14 @@
</span><span class="cx"> $sidebarItems.each( function() {
</span><span class="cx"> var li = $( this ),
</span><span class="cx"> sidebarId,
</span><del>- sidebar_model;
</del><ins>+ sidebar;
</ins><span class="cx">
</span><span class="cx"> sidebarId = li.data( 'id' );
</span><del>- sidebar_model = api.Widgets.registeredSidebars.get( sidebarId );
</del><ins>+ sidebar = api.Widgets.registeredSidebars.get( sidebarId );
</ins><span class="cx">
</span><del>- li.toggle( sidebar_model.get( 'is_rendered' ) );
</del><ins>+ li.toggle( sidebar.get( 'is_rendered' ) );
</ins><span class="cx">
</span><del>- if ( li.hasClass( 'selected' ) && ! sidebar_model.get( 'is_rendered' ) ) {
</del><ins>+ if ( li.hasClass( 'selected' ) && ! sidebar.get( 'is_rendered' ) ) {
</ins><span class="cx"> selectSidebarItem( selfSidebarItem );
</span><span class="cx"> }
</span><span class="cx"> } );
</span><span class="lines">@@ -725,7 +725,7 @@
</span><span class="cx"> $saveBtn.removeClass( 'button-primary' ).addClass( 'button-secondary' );
</span><span class="cx"> $saveBtn.on( 'click', function( e ) {
</span><span class="cx"> e.preventDefault();
</span><del>- self.updateWidget( { disable_form: true } );
</del><ins>+ self.updateWidget( { disable_form: true } ); // @todo disable_form is unused?
</ins><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> updateWidgetDebounced = _.debounce( function() {
</span><span class="lines">@@ -736,7 +736,7 @@
</span><span class="cx"> this.container.find( '.widget-content' ).on( 'keydown', 'input', function( e ) {
</span><span class="cx"> if ( 13 === e.which ) { // Enter
</span><span class="cx"> e.preventDefault();
</span><del>- self.updateWidget( { ignore_active_element: true } );
</del><ins>+ self.updateWidget( { ignoreActiveElement: true } );
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="lines">@@ -763,9 +763,10 @@
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Update widget control to indicate whether it is currently rendered
</span><del>- api.Widgets.Previewer.bind( 'rendered-widgets', function( rendered_widgets ) {
- var is_rendered = !! rendered_widgets[self.params.widget_id];
- self.container.toggleClass( 'widget-rendered', is_rendered );
</del><ins>+ api.Widgets.Previewer.bind( 'rendered-widgets', function( renderedWidgets ) {
+ var isRendered = !! renderedWidgets[self.params.widget_id];
+
+ self.container.toggleClass( 'widget-rendered', isRendered );
</ins><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> formSyncHandler = api.Widgets.formSyncHandlers[ this.params.widget_id_base ];
</span><span class="lines">@@ -800,20 +801,22 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> self.container.slideUp( function() {
</span><del>- var sidebars_widgets_control = api.Widgets.getSidebarWidgetControlContainingWidget( self.params.widget_id ),
- sidebar_widget_ids,
- i;
</del><ins>+ var sidebarsWidgetsControl = api.Widgets.getSidebarWidgetControlContainingWidget( self.params.widget_id ),
+ sidebarWidgetIds, i;
</ins><span class="cx">
</span><del>- if ( ! sidebars_widgets_control ) {
</del><ins>+ if ( ! sidebarsWidgetsControl ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><del>- sidebar_widget_ids = sidebars_widgets_control.setting().slice();
- i = _.indexOf( sidebar_widget_ids, self.params.widget_id );
</del><ins>+
+ sidebarWidgetIds = sidebarsWidgetsControl.setting().slice();
+ i = _.indexOf( sidebarWidgetIds, self.params.widget_id );
</ins><span class="cx"> if ( -1 === i ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><del>- sidebar_widget_ids.splice( i, 1 );
- sidebars_widgets_control.setting( sidebar_widget_ids );
</del><ins>+
+ sidebarWidgetIds.splice( i, 1 );
+ sidebarsWidgetsControl.setting( sidebarWidgetIds );
+
</ins><span class="cx"> $adjacentFocusTarget.focus(); // keyboard accessibility
</span><span class="cx"> } );
</span><span class="cx"> } );
</span><span class="lines">@@ -913,7 +916,7 @@
</span><span class="cx"> * @param {object} [args]
</span><span class="cx"> * @param {Object|null} [args.instance=null] When the model changes, the instance is sent here; otherwise, the inputs from the form are used
</span><span class="cx"> * @param {Function|null} [args.complete=null] Function which is called when the request finishes. Context is bound to the control. First argument is any error. Following arguments are for success.
</span><del>- * @param {Boolean} [args.ignore_active_element=false] Whether or not updating a field will be deferred if focus is still on the element.
</del><ins>+ * @param {Boolean} [args.ignoreActiveElement=false] Whether or not updating a field will be deferred if focus is still on the element.
</ins><span class="cx"> */
</span><span class="cx"> updateWidget: function( args ) {
</span><span class="cx"> var self = this, instanceOverride, completeCallback, $widgetRoot, $widgetContent,
</span><span class="lines">@@ -922,7 +925,7 @@
</span><span class="cx"> args = $.extend( {
</span><span class="cx"> instance: null,
</span><span class="cx"> complete: null,
</span><del>- ignore_active_element: false
</del><ins>+ ignoreActiveElement: false
</ins><span class="cx"> }, args );
</span><span class="cx">
</span><span class="cx"> instanceOverride = args.instance;
</span><span class="lines">@@ -1016,7 +1019,7 @@
</span><span class="cx"> sanitizedState = $sanitizedInput.prop( property );
</span><span class="cx"> $input.data( 'sanitized', sanitizedState );
</span><span class="cx">
</span><del>- canUpdateState = ( submittedState !== sanitizedState && ( args.ignore_active_element || ! $input.is( document.activeElement ) ) );
</del><ins>+ canUpdateState = ( submittedState !== sanitizedState && ( args.ignoreActiveElement || ! $input.is( document.activeElement ) ) );
</ins><span class="cx"> if ( canUpdateState ) {
</span><span class="cx"> $input.prop( property, sanitizedState );
</span><span class="cx"> }
</span><span class="lines">@@ -1055,7 +1058,7 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> if ( completeCallback ) {
</span><del>- completeCallback.call( self, null, { no_change: ! isChanged, ajax_finished: true } );
</del><ins>+ completeCallback.call( self, null, { noChange: ! isChanged, ajaxFinished: true } );
</ins><span class="cx"> }
</span><span class="cx"> } else {
</span><span class="cx"> // General error message
</span><span class="lines">@@ -1301,124 +1304,121 @@
</span><span class="cx"> * Set up the control
</span><span class="cx"> */
</span><span class="cx"> ready: function() {
</span><del>- var control = this;
- control.control_section = control.container.closest( '.control-section' );
- control.section_content = control.container.closest( '.accordion-section-content' );
- control._setupModel();
- control._setupSortable();
- control._setupAddition();
- control._applyCardinalOrderClassNames();
</del><ins>+ this.$controlSection = this.container.closest( '.control-section' );
+ this.$sectionContent = this.container.closest( '.accordion-section-content' );
+
+ this._setupModel();
+ this._setupSortable();
+ this._setupAddition();
+ this._applyCardinalOrderClassNames();
</ins><span class="cx"> },
</span><span class="cx">
</span><span class="cx"> /**
</span><span class="cx"> * Update ordering of widget control forms when the setting is updated
</span><span class="cx"> */
</span><span class="cx"> _setupModel: function() {
</span><del>- var control = this,
- registered_sidebar = api.Widgets.registeredSidebars.get( control.params.sidebar_id );
</del><ins>+ var self = this,
+ registeredSidebar = api.Widgets.registeredSidebars.get( this.params.sidebar_id );
</ins><span class="cx">
</span><del>- control.setting.bind( function( new_widget_ids, old_widget_ids ) {
- var widget_form_controls,
- sidebar_widgets_add_control,
- final_control_containers,
- removed_widget_ids = _( old_widget_ids ).difference( new_widget_ids );
</del><ins>+ this.setting.bind( function( newWidgetIds, oldWidgetIds ) {
+ var widgetFormControls, $sidebarWidgetsAddControl, finalControlContainers, removedWidgetIds;
</ins><span class="cx">
</span><del>- // Filter out any persistent widget_ids for widgets which have been deactivated
- new_widget_ids = _( new_widget_ids ).filter( function( new_widget_id ) {
- var parsed_widget_id = parse_widget_id( new_widget_id );
- return !! api.Widgets.availableWidgets.findWhere( { id_base: parsed_widget_id.id_base } );
</del><ins>+ removedWidgetIds = _( oldWidgetIds ).difference( newWidgetIds );
+
+ // Filter out any persistent widget IDs for widgets which have been deactivated
+ newWidgetIds = _( newWidgetIds ).filter( function( newWidgetId ) {
+ var parsedWidgetId = parseWidgetId( newWidgetId );
+
+ return !! api.Widgets.availableWidgets.findWhere( { id_base: parsedWidgetId.id_base } );
</ins><span class="cx"> } );
</span><span class="cx">
</span><del>- widget_form_controls = _( new_widget_ids ).map( function( widget_id ) {
- var widget_form_control = api.Widgets.getWidgetFormControlForWidget( widget_id );
- if ( ! widget_form_control ) {
- widget_form_control = control.addWidget( widget_id );
</del><ins>+ widgetFormControls = _( newWidgetIds ).map( function( widgetId ) {
+ var widgetFormControl = api.Widgets.getWidgetFormControlForWidget( widgetId );
+
+ if ( ! widgetFormControl ) {
+ widgetFormControl = self.addWidget( widgetId );
</ins><span class="cx"> }
</span><del>- return widget_form_control;
</del><ins>+
+ return widgetFormControl;
</ins><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Sort widget controls to their new positions
</span><del>- widget_form_controls.sort( function( a, b ) {
- var a_index = _.indexOf( new_widget_ids, a.params.widget_id ),
- b_index = _.indexOf( new_widget_ids, b.params.widget_id );
- if ( a_index === b_index ) {
</del><ins>+ widgetFormControls.sort( function( a, b ) {
+ var aIndex = _.indexOf( newWidgetIds, a.params.widget_id ),
+ bIndex = _.indexOf( newWidgetIds, b.params.widget_id );
+
+ if ( aIndex === bIndex ) {
</ins><span class="cx"> return 0;
</span><span class="cx"> }
</span><del>- return a_index < b_index ? -1 : 1;
</del><ins>+
+ return aIndex < bIndex ? -1 : 1;
</ins><span class="cx"> } );
</span><span class="cx">
</span><del>- sidebar_widgets_add_control = control.section_content.find( '.customize-control-sidebar_widgets' );
-
</del><span class="cx"> // Append the controls to put them in the right order
</span><del>- final_control_containers = _( widget_form_controls ).map( function( widget_form_controls ) {
- return widget_form_controls.container[0];
</del><ins>+ finalControlContainers = _( widgetFormControls ).map( function( widgetFormControls ) {
+ return widgetFormControls.container[0];
</ins><span class="cx"> } );
</span><span class="cx">
</span><ins>+ $sidebarWidgetsAddControl = self.$sectionContent.find( '.customize-control-sidebar_widgets' );
+ $sidebarWidgetsAddControl.before( finalControlContainers );
+
</ins><span class="cx"> // Re-sort widget form controls (including widgets form other sidebars newly moved here)
</span><del>- sidebar_widgets_add_control.before( final_control_containers );
- control._applyCardinalOrderClassNames();
</del><ins>+ self._applyCardinalOrderClassNames();
</ins><span class="cx">
</span><span class="cx"> // If the widget was dragged into the sidebar, make sure the sidebar_id param is updated
</span><del>- _( widget_form_controls ).each( function( widget_form_control ) {
- widget_form_control.params.sidebar_id = control.params.sidebar_id;
</del><ins>+ _( widgetFormControls ).each( function( widgetFormControl ) {
+ widgetFormControl.params.sidebar_id = self.params.sidebar_id;
</ins><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Cleanup after widget removal
</span><del>- _( removed_widget_ids ).each( function( removed_widget_id ) {
</del><ins>+ _( removedWidgetIds ).each( function( removedWidgetId ) {
</ins><span class="cx">
</span><span class="cx"> // Using setTimeout so that when moving a widget to another sidebar, the other sidebars_widgets settings get a chance to update
</span><span class="cx"> setTimeout( function() {
</span><del>- var is_present_in_another_sidebar = false,
- removed_control,
- was_dragged_to_another_sidebar,
- inactive_widgets,
- removed_id_base,
- widget;
</del><ins>+ var removedControl, wasDraggedToAnotherSidebar, inactiveWidgets, removedIdBase,
+ widget, isPresentInAnotherSidebar = false;
</ins><span class="cx">
</span><span class="cx"> // Check if the widget is in another sidebar
</span><del>- api.each( function( other_setting ) {
- if ( other_setting.id === control.setting.id || 0 !== other_setting.id.indexOf( 'sidebars_widgets[' ) || other_setting.id === 'sidebars_widgets[wp_inactive_widgets]' ) {
</del><ins>+ api.each( function( otherSetting ) {
+ if ( otherSetting.id === self.setting.id || 0 !== otherSetting.id.indexOf( 'sidebars_widgets[' ) || otherSetting.id === 'sidebars_widgets[wp_inactiveWidgets]' ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var other_sidebar_widgets = other_setting(), i;
</del><span class="cx">
</span><del>- i = _.indexOf( other_sidebar_widgets, removed_widget_id );
</del><ins>+ var otherSidebarWidgets = otherSetting(), i;
+
+ i = _.indexOf( otherSidebarWidgets, removedWidgetId );
</ins><span class="cx"> if ( -1 !== i ) {
</span><del>- is_present_in_another_sidebar = true;
</del><ins>+ isPresentInAnotherSidebar = true;
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // If the widget is present in another sidebar, abort!
</span><del>- if ( is_present_in_another_sidebar ) {
</del><ins>+ if ( isPresentInAnotherSidebar ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- removed_control = api.Widgets.getWidgetFormControlForWidget( removed_widget_id );
</del><ins>+ removedControl = api.Widgets.getWidgetFormControlForWidget( removedWidgetId );
</ins><span class="cx">
</span><span class="cx"> // Detect if widget control was dragged to another sidebar
</span><del>- was_dragged_to_another_sidebar = (
- removed_control &&
- $.contains( document, removed_control.container[0] ) &&
- ! $.contains( control.section_content[0], removed_control.container[0] )
- );
</del><ins>+ wasDraggedToAnotherSidebar = removedControl && $.contains( document, removedControl.container[0] ) && ! $.contains( self.$sectionContent[0], removedControl.container[0] );
</ins><span class="cx">
</span><span class="cx"> // Delete any widget form controls for removed widgets
</span><del>- if ( removed_control && ! was_dragged_to_another_sidebar ) {
- api.control.remove( removed_control.id );
- removed_control.container.remove();
</del><ins>+ if ( removedControl && ! wasDraggedToAnotherSidebar ) {
+ api.control.remove( removedControl.id );
+ removedControl.container.remove();
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Move widget to inactive widgets sidebar (move it to trash) if has been previously saved
</span><span class="cx"> // This prevents the inactive widgets sidebar from overflowing with throwaway widgets
</span><del>- if ( api.Widgets.savedWidgetIds[removed_widget_id] ) {
- inactive_widgets = api.value( 'sidebars_widgets[wp_inactive_widgets]' )().slice();
- inactive_widgets.push( removed_widget_id );
- api.value( 'sidebars_widgets[wp_inactive_widgets]' )( _( inactive_widgets ).unique() );
</del><ins>+ if ( api.Widgets.savedWidgetIds[removedWidgetId] ) {
+ inactiveWidgets = api.value( 'sidebars_widgets[wp_inactiveWidgets]' )().slice();
+ inactiveWidgets.push( removedWidgetId );
+ api.value( 'sidebars_widgets[wp_inactiveWidgets]' )( _( inactiveWidgets ).unique() );
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Make old single widget available for adding again
</span><del>- removed_id_base = parse_widget_id( removed_widget_id ).id_base;
- widget = api.Widgets.availableWidgets.findWhere( { id_base: removed_id_base } );
</del><ins>+ removedIdBase = parseWidgetId( removedWidgetId ).id_base;
+ widget = api.Widgets.availableWidgets.findWhere( { id_base: removedIdBase } );
</ins><span class="cx"> if ( widget && ! widget.get( 'is_multi' ) ) {
</span><span class="cx"> widget.set( 'is_disabled', false );
</span><span class="cx"> }
</span><span class="lines">@@ -1428,26 +1428,30 @@
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Update the model with whether or not the sidebar is rendered
</span><del>- api.Widgets.Previewer.bind( 'rendered-sidebars', function( rendered_sidebars ) {
- var is_rendered = !! rendered_sidebars[control.params.sidebar_id];
- registered_sidebar.set( 'is_rendered', is_rendered );
</del><ins>+ api.Widgets.Previewer.bind( 'rendered-sidebars', function( renderedSidebars ) {
+ var isRendered = !! renderedSidebars[self.params.sidebar_id];
+
+ registeredSidebar.set( 'is_rendered', isRendered );
</ins><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Show the sidebar section when it becomes visible
</span><del>- registered_sidebar.on( 'change:is_rendered', function( ) {
- var section_selector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ), section;
- section = $( section_selector );
</del><ins>+ registeredSidebar.on( 'change:is_rendered', function( ) {
+ var sectionSelector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ), $section;
+
+ $section = $( sectionSelector );
</ins><span class="cx"> if ( this.get( 'is_rendered' ) ) {
</span><del>- section.stop().slideDown( function() {
</del><ins>+ $section.stop().slideDown( function() {
</ins><span class="cx"> $( this ).css( 'height', 'auto' ); // so that the .accordion-section-content won't overflow
</span><span class="cx"> } );
</span><ins>+
</ins><span class="cx"> } else {
</span><span class="cx"> // Make sure that hidden sections get closed first
</span><del>- if ( section.hasClass( 'open' ) ) {
</del><ins>+ if ( $section.hasClass( 'open' ) ) {
</ins><span class="cx"> // it would be nice if accordionSwitch() in accordion.js was public
</span><del>- section.find( '.accordion-section-title' ).trigger( 'click' );
</del><ins>+ $section.find( '.accordion-section-title' ).trigger( 'click' );
</ins><span class="cx"> }
</span><del>- section.stop().slideUp();
</del><ins>+
+ $section.stop().slideUp();
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx"> },
</span><span class="lines">@@ -1456,23 +1460,26 @@
</span><span class="cx"> * Allow widgets in sidebar to be re-ordered, and for the order to be previewed
</span><span class="cx"> */
</span><span class="cx"> _setupSortable: function() {
</span><del>- var control = this;
- control.is_reordering = false;
</del><ins>+ var self = this;
</ins><span class="cx">
</span><ins>+ this.isReordering = false;
+
</ins><span class="cx"> /**
</span><span class="cx"> * Update widget order setting when controls are re-ordered
</span><span class="cx"> */
</span><del>- control.section_content.sortable( {
</del><ins>+ this.$sectionContent.sortable( {
</ins><span class="cx"> items: '> .customize-control-widget_form',
</span><span class="cx"> handle: '.widget-top',
</span><span class="cx"> axis: 'y',
</span><span class="cx"> connectWith: '.accordion-section-content:has(.customize-control-sidebar_widgets)',
</span><span class="cx"> update: function() {
</span><del>- var widget_container_ids = control.section_content.sortable( 'toArray' ), widget_ids;
- widget_ids = $.map( widget_container_ids, function( widget_container_id ) {
- return $( '#' + widget_container_id ).find( ':input[name=widget-id]' ).val();
</del><ins>+ var widgetContainerIds = self.$sectionContent.sortable( 'toArray' ), widgetIds;
+
+ widgetIds = $.map( widgetContainerIds, function( widgetContainerId ) {
+ return $( '#' + widgetContainerId ).find( ':input[name=widget-id]' ).val();
</ins><span class="cx"> } );
</span><del>- control.setting( widget_ids );
</del><ins>+
+ self.setting( widgetIds );
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="lines">@@ -1480,27 +1487,27 @@
</span><span class="cx"> * Expand other customizer sidebar section when dragging a control widget over it,
</span><span class="cx"> * allowing the control to be dropped into another section
</span><span class="cx"> */
</span><del>- control.control_section.find( '.accordion-section-title' ).droppable( {
</del><ins>+ this.$controlSection.find( '.accordion-section-title' ).droppable({
</ins><span class="cx"> accept: '.customize-control-widget_form',
</span><span class="cx"> over: function() {
</span><del>- if ( ! control.control_section.hasClass( 'open' ) ) {
- control.control_section.addClass( 'open' );
- control.section_content.toggle( false ).slideToggle( 150, function() {
- control.section_content.sortable( 'refreshPositions' );
</del><ins>+ if ( ! self.$controlSection.hasClass( 'open' ) ) {
+ self.$controlSection.addClass( 'open' );
+ self.$sectionContent.toggle( false ).slideToggle( 150, function() {
+ self.$sectionContent.sortable( 'refreshPositions' );
</ins><span class="cx"> } );
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- } );
</del><ins>+ });
</ins><span class="cx">
</span><span class="cx"> /**
</span><span class="cx"> * Keyboard-accessible reordering
</span><span class="cx"> */
</span><del>- control.container.find( '.reorder-toggle' ).on( 'click keydown', function( event ) {
</del><ins>+ this.container.find( '.reorder-toggle' ).on( 'click keydown', function( event ) {
</ins><span class="cx"> if ( event.type === 'keydown' && ! ( event.which === 13 || event.which === 32 ) ) { // Enter or Spacebar
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- control.toggleReordering( ! control.is_reordering );
</del><ins>+ self.toggleReordering( ! self.isReordering );
</ins><span class="cx"> } );
</span><span class="cx"> },
</span><span class="cx">
</span><span class="lines">@@ -1508,20 +1515,19 @@
</span><span class="cx"> * Set up UI for adding a new widget
</span><span class="cx"> */
</span><span class="cx"> _setupAddition: function() {
</span><del>- var control = this;
</del><ins>+ var self = this;
</ins><span class="cx">
</span><del>- control.container.find( '.add-new-widget' ).on( 'click keydown', function( event ) {
</del><ins>+ this.container.find( '.add-new-widget' ).on( 'click keydown', function( event ) {
</ins><span class="cx"> if ( event.type === 'keydown' && ! ( event.which === 13 || event.which === 32 ) ) { // Enter or Spacebar
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- if ( control.section_content.hasClass( 'reordering' ) ) {
</del><ins>+ if ( self.$sectionContent.hasClass( 'reordering' ) ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- // @todo Use an control.is_adding state
</del><span class="cx"> if ( ! $( 'body' ).hasClass( 'adding-widget' ) ) {
</span><del>- api.Widgets.availableWidgetsPanel.open( control );
</del><ins>+ api.Widgets.availableWidgetsPanel.open( self );
</ins><span class="cx"> } else {
</span><span class="cx"> api.Widgets.availableWidgetsPanel.close();
</span><span class="cx"> }
</span><span class="lines">@@ -1532,16 +1538,16 @@
</span><span class="cx"> * Add classes to the widget_form controls to assist with styling
</span><span class="cx"> */
</span><span class="cx"> _applyCardinalOrderClassNames: function() {
</span><del>- var control = this;
- control.section_content.find( '.customize-control-widget_form' )
</del><ins>+ this.$sectionContent.find( '.customize-control-widget_form' )
</ins><span class="cx"> .removeClass( 'first-widget' )
</span><span class="cx"> .removeClass( 'last-widget' )
</span><span class="cx"> .find( '.move-widget-down, .move-widget-up' ).prop( 'tabIndex', 0 );
</span><span class="cx">
</span><del>- control.section_content.find( '.customize-control-widget_form:first' )
</del><ins>+ this.$sectionContent.find( '.customize-control-widget_form:first' )
</ins><span class="cx"> .addClass( 'first-widget' )
</span><span class="cx"> .find( '.move-widget-up' ).prop( 'tabIndex', -1 );
</span><del>- control.section_content.find( '.customize-control-widget_form:last' )
</del><ins>+
+ this.$sectionContent.find( '.customize-control-widget_form:last' )
</ins><span class="cx"> .addClass( 'last-widget' )
</span><span class="cx"> .find( '.move-widget-down' ).prop( 'tabIndex', -1 );
</span><span class="cx"> },
</span><span class="lines">@@ -1554,21 +1560,21 @@
</span><span class="cx"> /**
</span><span class="cx"> * Enable/disable the reordering UI
</span><span class="cx"> *
</span><del>- * @param {Boolean} toggle to enable/disable reordering
</del><ins>+ * @param {Boolean} showOrHide to enable/disable reordering
</ins><span class="cx"> */
</span><del>- toggleReordering: function( toggle ) {
- var control = this;
- toggle = Boolean( toggle );
- if ( toggle === control.section_content.hasClass( 'reordering' ) ) {
</del><ins>+ toggleReordering: function( showOrHide ) {
+ showOrHide = Boolean( showOrHide );
+
+ if ( showOrHide === this.$sectionContent.hasClass( 'reordering' ) ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- control.is_reordering = toggle;
- control.section_content.toggleClass( 'reordering', toggle );
</del><ins>+ this.isReordering = showOrHide;
+ this.$sectionContent.toggleClass( 'reordering', showOrHide );
</ins><span class="cx">
</span><del>- if ( toggle ) {
- _( control.getWidgetFormControls() ).each( function( form_control ) {
- form_control.collapseForm();
</del><ins>+ if ( showOrHide ) {
+ _( this.getWidgetFormControls() ).each( function( formControl ) {
+ formControl.collapseForm();
</ins><span class="cx"> } );
</span><span class="cx"> }
</span><span class="cx"> },
</span><span class="lines">@@ -1577,165 +1583,186 @@
</span><span class="cx"> * @return {wp.customize.controlConstructor.widget_form[]}
</span><span class="cx"> */
</span><span class="cx"> getWidgetFormControls: function() {
</span><del>- var control = this, form_controls;
</del><ins>+ var formControls;
</ins><span class="cx">
</span><del>- form_controls = _( control.setting() ).map( function( widget_id ) {
- var setting_id = widgetIdToSettingId( widget_id ),
- form_control = api.control( setting_id );
</del><ins>+ formControls = _( this.setting() ).map( function( widgetId ) {
+ var settingId = widgetIdToSettingId( widgetId ),
+ formControl = api.control( settingId );
</ins><span class="cx">
</span><del>- if ( ! form_control ) {
- throw new Error( 'Unable to find widget_form control for ' + widget_id );
</del><ins>+ if ( ! formControl ) {
+ return;
</ins><span class="cx"> }
</span><del>- return form_control;
</del><ins>+
+ return formControl;
</ins><span class="cx"> } );
</span><del>- return form_controls;
</del><ins>+
+ return formControls;
</ins><span class="cx"> },
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * @param {string} widget_id or an id_base for adding a previously non-existing widget
</del><ins>+ * @param {string} widgetId or an id_base for adding a previously non-existing widget
</ins><span class="cx"> * @returns {object} widget_form control instance
</span><span class="cx"> */
</span><del>- addWidget: function( widget_id ) {
- var control = this,
- control_html,
- widget_el,
- customize_control_type = 'widget_form',
- customize_control,
- parsed_widget_id = parse_widget_id( widget_id ),
- widget_number = parsed_widget_id.number,
- widget_id_base = parsed_widget_id.id_base,
- widget = api.Widgets.availableWidgets.findWhere( {id_base: widget_id_base} ),
- setting_id,
- is_existing_widget,
- Constructor,
- widget_form_control,
- sidebar_widgets,
- setting_args;
</del><ins>+ addWidget: function( widgetId ) {
+ var self = this, controlHtml, $widget, controlType = 'widget_form', $control, controlConstructor,
+ parsedWidgetId = parseWidgetId( widgetId ),
+ widgetNumber = parsedWidgetId.number,
+ widgetIdBase = parsedWidgetId.id_base,
+ widget = api.Widgets.availableWidgets.findWhere( {id_base: widgetIdBase} ),
+ settingId, isExistingWidget, widgetFormControl, sidebarWidgets, settingArgs;
</ins><span class="cx">
</span><span class="cx"> if ( ! widget ) {
</span><del>- throw new Error( 'Widget unexpectedly not found.' );
</del><ins>+ return;
</ins><span class="cx"> }
</span><del>- if ( widget_number && ! widget.get( 'is_multi' ) ) {
- throw new Error( 'Did not expect a widget number to be supplied for a non-multi widget' );
</del><ins>+
+ if ( widgetNumber && ! widget.get( 'is_multi' ) ) {
+ return;
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Set up new multi widget
</span><del>- if ( widget.get( 'is_multi' ) && ! widget_number ) {
</del><ins>+ if ( widget.get( 'is_multi' ) && ! widgetNumber ) {
</ins><span class="cx"> widget.set( 'multi_number', widget.get( 'multi_number' ) + 1 );
</span><del>- widget_number = widget.get( 'multi_number' );
</del><ins>+ widgetNumber = widget.get( 'multi_number' );
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- control_html = $( '#widget-tpl-' + widget.get( 'id' ) ).html();
</del><ins>+ controlHtml = $( '#widget-tpl-' + widget.get( 'id' ) ).html();
</ins><span class="cx"> if ( widget.get( 'is_multi' ) ) {
</span><del>- control_html = control_html.replace( /<[^<>]+>/g, function( m ) {
- return m.replace( /__i__|%i%/g, widget_number );
</del><ins>+ controlHtml = controlHtml.replace( /<[^<>]+>/g, function( m ) {
+ return m.replace( /__i__|%i%/g, widgetNumber );
</ins><span class="cx"> } );
</span><span class="cx"> } else {
</span><span class="cx"> widget.set( 'is_disabled', true ); // Prevent single widget from being added again now
</span><span class="cx"> }
</span><del>- widget_el = $( control_html );
</del><span class="cx">
</span><del>- customize_control = $( '<li></li>' );
- customize_control.addClass( 'customize-control' );
- customize_control.addClass( 'customize-control-' + customize_control_type );
- customize_control.append( widget_el );
- customize_control.find( '> .widget-icon' ).remove();
</del><ins>+ $widget = $( controlHtml );
+
+ $control = $( '<li/>' )
+ .addClass( 'customize-control' )
+ .addClass( 'customize-control-' + controlType )
+ .append( $widget );
+
+ // Remove icon which is visible inside the panel
+ $control.find( '> .widget-icon' ).remove();
+
</ins><span class="cx"> if ( widget.get( 'is_multi' ) ) {
</span><del>- customize_control.find( 'input[name="widget_number"]' ).val( widget_number );
- customize_control.find( 'input[name="multi_number"]' ).val( widget_number );
</del><ins>+ $control.find( 'input[name="widget_number"]' ).val( widgetNumber );
+ $control.find( 'input[name="multi_number"]' ).val( widgetNumber );
</ins><span class="cx"> }
</span><del>- widget_id = customize_control.find( '[name="widget-id"]' ).val();
- customize_control.hide(); // to be slid-down below
</del><span class="cx">
</span><del>- setting_id = 'widget_' + widget.get( 'id_base' );
</del><ins>+ widgetId = $control.find( '[name="widget-id"]' ).val();
+
+ $control.hide(); // to be slid-down below
+
+ settingId = 'widget_' + widget.get( 'id_base' );
</ins><span class="cx"> if ( widget.get( 'is_multi' ) ) {
</span><del>- setting_id += '[' + widget_number + ']';
</del><ins>+ settingId += '[' + widgetNumber + ']';
</ins><span class="cx"> }
</span><del>- customize_control.attr( 'id', 'customize-control-' + setting_id.replace( /\]/g, '' ).replace( /\[/g, '-' ) );
</del><ins>+ $control.attr( 'id', 'customize-control-' + settingId.replace( /\]/g, '' ).replace( /\[/g, '-' ) );
</ins><span class="cx">
</span><del>- control.container.after( customize_control );
</del><ins>+ this.container.after( $control );
</ins><span class="cx">
</span><span class="cx"> // Only create setting if it doesn't already exist (if we're adding a pre-existing inactive widget)
</span><del>- is_existing_widget = api.has( setting_id );
- if ( ! is_existing_widget ) {
- setting_args = {
</del><ins>+ isExistingWidget = api.has( settingId );
+ if ( ! isExistingWidget ) {
+ settingArgs = {
</ins><span class="cx"> transport: 'refresh',
</span><del>- previewer: control.setting.previewer
</del><ins>+ previewer: this.setting.previewer
</ins><span class="cx"> };
</span><del>- api.create( setting_id, setting_id, {}, setting_args );
</del><ins>+ api.create( settingId, settingId, {}, settingArgs );
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- Constructor = api.controlConstructor[customize_control_type];
- widget_form_control = new Constructor( setting_id, {
</del><ins>+ controlConstructor = api.controlConstructor[controlType];
+ widgetFormControl = new controlConstructor( settingId, {
</ins><span class="cx"> params: {
</span><span class="cx"> settings: {
</span><del>- 'default': setting_id
</del><ins>+ 'default': settingId
</ins><span class="cx"> },
</span><del>- sidebar_id: control.params.sidebar_id,
- widget_id: widget_id,
</del><ins>+ sidebar_id: self.params.sidebar_id,
+ widget_id: widgetId,
</ins><span class="cx"> widget_id_base: widget.get( 'id_base' ),
</span><del>- type: customize_control_type,
- is_new: ! is_existing_widget,
</del><ins>+ type: controlType,
+ is_new: ! isExistingWidget,
</ins><span class="cx"> width: widget.get( 'width' ),
</span><span class="cx"> height: widget.get( 'height' ),
</span><span class="cx"> is_wide: widget.get( 'is_wide' )
</span><span class="cx"> },
</span><del>- previewer: control.setting.previewer
</del><ins>+ previewer: self.setting.previewer
</ins><span class="cx"> } );
</span><del>- api.control.add( setting_id, widget_form_control );
</del><ins>+ api.control.add( settingId, widgetFormControl );
</ins><span class="cx">
</span><span class="cx"> // Make sure widget is removed from the other sidebars
</span><del>- api.each( function( other_setting ) {
- if ( other_setting.id === control.setting.id ) {
</del><ins>+ api.each( function( otherSetting ) {
+ if ( otherSetting.id === self.setting.id ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><del>- if ( 0 !== other_setting.id.indexOf( 'sidebars_widgets[' ) ) {
</del><ins>+
+ if ( 0 !== otherSetting.id.indexOf( 'sidebars_widgets[' ) ) {
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var other_sidebar_widgets = other_setting().slice(), i;
- i = _.indexOf( other_sidebar_widgets, widget_id );
</del><ins>+
+ var otherSidebarWidgets = otherSetting().slice(),
+ i = _.indexOf( otherSidebarWidgets, widgetId );
+
</ins><span class="cx"> if ( -1 !== i ) {
</span><del>- other_sidebar_widgets.splice( i );
- other_setting( other_sidebar_widgets );
</del><ins>+ otherSidebarWidgets.splice( i );
+ otherSetting( otherSidebarWidgets );
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Add widget to this sidebar
</span><del>- sidebar_widgets = control.setting().slice();
- if ( -1 === _.indexOf( sidebar_widgets, widget_id ) ) {
- sidebar_widgets.push( widget_id );
- control.setting( sidebar_widgets );
</del><ins>+ sidebarWidgets = this.setting().slice();
+ if ( -1 === _.indexOf( sidebarWidgets, widgetId ) ) {
+ sidebarWidgets.push( widgetId );
+ this.setting( sidebarWidgets );
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- customize_control.slideDown( function() {
- if ( is_existing_widget ) {
- widget_form_control.expandForm();
- widget_form_control.updateWidget( {
- instance: widget_form_control.setting(),
</del><ins>+ $control.slideDown( function() {
+ if ( isExistingWidget ) {
+ widgetFormControl.expandForm();
+ widgetFormControl.updateWidget( {
+ instance: widgetFormControl.setting(),
</ins><span class="cx"> complete: function( error ) {
</span><span class="cx"> if ( error ) {
</span><span class="cx"> throw error;
</span><span class="cx"> }
</span><del>- widget_form_control.focus();
</del><ins>+ widgetFormControl.focus();
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx"> } else {
</span><del>- widget_form_control.focus();
</del><ins>+ widgetFormControl.focus();
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- $( document ).trigger( 'widget-added', [ widget_el ] );
</del><ins>+ $( document ).trigger( 'widget-added', [ $widget ] );
</ins><span class="cx">
</span><del>- return widget_form_control;
</del><ins>+ return widgetFormControl;
</ins><span class="cx"> }
</span><del>-
</del><span class="cx"> } );
</span><span class="cx">
</span><ins>+ /**
+ * Extends wp.customizer.controlConstructor with control constructor for
+ * widget_form and sidebar_widgets.
+ */
</ins><span class="cx"> $.extend( api.controlConstructor, {
</span><span class="cx"> widget_form: api.Widgets.WidgetControl,
</span><span class="cx"> sidebar_widgets: api.Widgets.SidebarControl
</span><span class="cx"> });
</span><span class="cx">
</span><ins>+ /**
+ * Capture the instance of the Previewer since it is private
+ */
+ OldPreviewer = api.Previewer;
+ api.Previewer = OldPreviewer.extend({
+ initialize: function( params, options ) {
+ api.Widgets.Previewer = this;
+ OldPreviewer.prototype.initialize.call( this, params, options );
+ this.bind( 'refresh', this.refresh );
+ }
+ } );
+
+ /**
+ * Init Customizer for widgets.
+ */
</ins><span class="cx"> api.bind( 'ready', function() {
</span><span class="cx"> // Set up the widgets panel
</span><span class="cx"> api.Widgets.availableWidgetsPanel = new api.Widgets.AvailableWidgetsPanelView({
</span><span class="lines">@@ -1750,18 +1777,6 @@
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * Capture the instance of the Previewer since it is private
- */
- OldPreviewer = api.Previewer;
- api.Previewer = OldPreviewer.extend({
- initialize: function( params, options ) {
- api.Widgets.Previewer = this;
- OldPreviewer.prototype.initialize.call( this, params, options );
- this.bind( 'refresh', this.refresh );
- }
- } );
-
- /**
</del><span class="cx"> * Highlight a widget control.
</span><span class="cx"> *
</span><span class="cx"> * @param {string} widgetId
</span><span class="lines">@@ -1789,69 +1804,75 @@
</span><span class="cx">
</span><span class="cx"> /**
</span><span class="cx"> * Given a widget control, find the sidebar widgets control that contains it.
</span><del>- * @param {string} widget_id
</del><ins>+ * @param {string} widgetId
</ins><span class="cx"> * @return {object|null}
</span><span class="cx"> */
</span><del>- api.Widgets.getSidebarWidgetControlContainingWidget = function( widget_id ) {
- var found_control = null;
</del><ins>+ api.Widgets.getSidebarWidgetControlContainingWidget = function( widgetId ) {
+ var foundControl = null;
+
</ins><span class="cx"> // @todo this can use widgetIdToSettingId(), then pass into wp.customize.control( x ).getSidebarWidgetsControl()
</span><span class="cx"> api.control.each( function( control ) {
</span><del>- if ( control.params.type === 'sidebar_widgets' && -1 !== _.indexOf( control.setting(), widget_id ) ) {
- found_control = control;
</del><ins>+ if ( control.params.type === 'sidebar_widgets' && -1 !== _.indexOf( control.setting(), widgetId ) ) {
+ foundControl = control;
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- return found_control;
</del><ins>+ return foundControl;
</ins><span class="cx"> };
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * Given a widget_id for a widget appearing in the preview, get the widget form control associated with it
- * @param {string} widget_id
</del><ins>+ * Given a widget ID for a widget appearing in the preview, get the widget form control associated with it.
+ *
+ * @param {string} widgetId
</ins><span class="cx"> * @return {object|null}
</span><span class="cx"> */
</span><del>- api.Widgets.getWidgetFormControlForWidget = function( widget_id ) {
- var found_control = null;
</del><ins>+ api.Widgets.getWidgetFormControlForWidget = function( widgetId ) {
+ var foundControl = null;
+
</ins><span class="cx"> // @todo We can just use widgetIdToSettingId() here
</span><span class="cx"> api.control.each( function( control ) {
</span><del>- if ( control.params.type === 'widget_form' && control.params.widget_id === widget_id ) {
- found_control = control;
</del><ins>+ if ( control.params.type === 'widget_form' && control.params.widget_id === widgetId ) {
+ foundControl = control;
</ins><span class="cx"> }
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- return found_control;
</del><ins>+ return foundControl;
</ins><span class="cx"> };
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * @param {String} widget_id
</del><ins>+ * @param {String} widgetId
</ins><span class="cx"> * @returns {Object}
</span><span class="cx"> */
</span><del>- function parse_widget_id( widget_id ) {
</del><ins>+ function parseWidgetId( widgetId ) {
</ins><span class="cx"> var matches, parsed = {
</span><span class="cx"> number: null,
</span><span class="cx"> id_base: null
</span><span class="cx"> };
</span><del>- matches = widget_id.match( /^(.+)-(\d+)$/ );
</del><ins>+
+ matches = widgetId.match( /^(.+)-(\d+)$/ );
</ins><span class="cx"> if ( matches ) {
</span><span class="cx"> parsed.id_base = matches[1];
</span><span class="cx"> parsed.number = parseInt( matches[2], 10 );
</span><span class="cx"> } else {
</span><span class="cx"> // likely an old single widget
</span><del>- parsed.id_base = widget_id;
</del><ins>+ parsed.id_base = widgetId;
</ins><span class="cx"> }
</span><ins>+
</ins><span class="cx"> return parsed;
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * @param {String} widget_id
</del><ins>+ * @param {String} widgetId
</ins><span class="cx"> * @returns {String} settingId
</span><span class="cx"> */
</span><del>- function widgetIdToSettingId( widget_id ) {
- var parsed = parse_widget_id( widget_id ), settingId;
</del><ins>+ function widgetIdToSettingId( widgetId ) {
+ var parsed = parseWidgetId( widgetId ), settingId;
</ins><span class="cx">
</span><span class="cx"> settingId = 'widget_' + parsed.id_base;
</span><span class="cx"> if ( parsed.number ) {
</span><span class="cx"> settingId += '[' + parsed.number + ']';
</span><span class="cx"> }
</span><ins>+
</ins><span class="cx"> return settingId;
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre>
</div>
</div>
</body>
</html>