<!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>[27436] trunk/src: Make widget customizer code pass JSHint.</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/27436">27436</a></dd>
<dt>Author</dt> <dd>wonderboymusic</dd>
<dt>Date</dt> <dd>2014-03-06 16:44:56 +0000 (Thu, 06 Mar 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>Make widget customizer code pass JSHint.
Fixes <a href="http://core.trac.wordpress.org/ticket/27298">#27298</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpadminjscustomizewidgetsjs">trunk/src/wp-admin/js/customize-widgets.js</a></li>
<li><a href="#trunksrcwpincludesjscustomizepreviewwidgetsjs">trunk/src/wp-includes/js/customize-preview-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 (27435 => 27436)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-admin/js/customize-widgets.js 2014-03-06 16:05:48 UTC (rev 27435)
+++ trunk/src/wp-admin/js/customize-widgets.js 2014-03-06 16:44:56 UTC (rev 27436)
</span><span class="lines">@@ -3,8 +3,12 @@
</span><span class="cx"> var WidgetCustomizer = ( function ($) {
</span><span class="cx"> 'use strict';
</span><span class="cx">
</span><del>- var customize = wp.customize;
- var self = {
</del><ins>+ var Widget,
+ WidgetCollection,
+ Sidebar,
+ SidebarCollection,
+ OldPreviewer,
+ customize = wp.customize, self = {
</ins><span class="cx"> update_widget_ajax_action: null,
</span><span class="cx"> update_widget_nonce_value: null,
</span><span class="cx"> update_widget_nonce_post_key: null,
</span><span class="lines">@@ -39,7 +43,7 @@
</span><span class="cx"> /**
</span><span class="cx"> * Set up model
</span><span class="cx"> */
</span><del>- var Widget = self.Widget = Backbone.Model.extend( {
</del><ins>+ Widget = self.Widget = Backbone.Model.extend( {
</ins><span class="cx"> id: null,
</span><span class="cx"> temp_id: null,
</span><span class="cx"> classname: null,
</span><span class="lines">@@ -55,12 +59,13 @@
</span><span class="cx"> width: null,
</span><span class="cx"> height: null
</span><span class="cx"> } );
</span><del>- var WidgetCollection = self.WidgetCollection = Backbone.Collection.extend( {
</del><ins>+
+ WidgetCollection = self.WidgetCollection = Backbone.Collection.extend( {
</ins><span class="cx"> model: Widget
</span><span class="cx"> } );
</span><span class="cx"> self.available_widgets = new WidgetCollection( self.available_widgets );
</span><span class="cx">
</span><del>- var Sidebar = self.Sidebar = Backbone.Model.extend( {
</del><ins>+ Sidebar = self.Sidebar = Backbone.Model.extend( {
</ins><span class="cx"> after_title: null,
</span><span class="cx"> after_widget: null,
</span><span class="cx"> before_title: null,
</span><span class="lines">@@ -71,7 +76,8 @@
</span><span class="cx"> name: null,
</span><span class="cx"> is_rendered: false
</span><span class="cx"> } );
</span><del>- var SidebarCollection = self.SidebarCollection = Backbone.Collection.extend( {
</del><ins>+
+ SidebarCollection = self.SidebarCollection = Backbone.Collection.extend( {
</ins><span class="cx"> model: Sidebar
</span><span class="cx"> } );
</span><span class="cx"> self.registered_sidebars = new SidebarCollection( self.registered_sidebars );
</span><span class="lines">@@ -99,13 +105,13 @@
</span><span class="cx">
</span><span class="cx"> var show_first_visible_sidebar = function () {
</span><span class="cx"> self.registered_sidebars.off( 'change:is_rendered', show_first_visible_sidebar );
</span><del>- var first_rendered_sidebar = self.registered_sidebars.find( function ( sidebar ) {
</del><ins>+ var section, first_rendered_sidebar = self.registered_sidebars.find( function ( sidebar ) {
</ins><span class="cx"> return sidebar.get( 'is_rendered' );
</span><span class="cx"> } );
</span><span class="cx"> if ( ! first_rendered_sidebar ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var section = $( '#accordion-section-sidebar-widgets-' + first_rendered_sidebar.get( 'id' ) );
</del><ins>+ section = $( '#accordion-section-sidebar-widgets-' + first_rendered_sidebar.get( 'id' ) );
</ins><span class="cx"> if ( ! section.hasClass( 'open' ) ) {
</span><span class="cx"> section.find( '.accordion-section-title' ).trigger( 'click' );
</span><span class="cx"> }
</span><span class="lines">@@ -138,11 +144,14 @@
</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;
- var registered_sidebar = self.registered_sidebars.get( control.params.sidebar_id );
</del><ins>+ var control = this,
+ registered_sidebar = self.registered_sidebars.get( control.params.sidebar_id );
</ins><span class="cx">
</span><span class="cx"> control.setting.bind( function( new_widget_ids, old_widget_ids ) {
</span><del>- var removed_widget_ids = _( old_widget_ids ).difference( new_widget_ids );
</del><ins>+ var widget_form_controls,
+ sidebar_widgets_add_control,
+ final_control_containers,
+ removed_widget_ids = _( old_widget_ids ).difference( new_widget_ids );
</ins><span class="cx">
</span><span class="cx"> // Filter out any persistent widget_ids for widgets which have been deactivated
</span><span class="cx"> new_widget_ids = _( new_widget_ids ).filter( function ( new_widget_id ) {
</span><span class="lines">@@ -150,7 +159,7 @@
</span><span class="cx"> return !! self.available_widgets.findWhere( { id_base: parsed_widget_id.id_base } );
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- var widget_form_controls = _( new_widget_ids ).map( function ( widget_id ) {
</del><ins>+ widget_form_controls = _( new_widget_ids ).map( function ( widget_id ) {
</ins><span class="cx"> var widget_form_control = self.getWidgetFormControlForWidget( widget_id );
</span><span class="cx"> if ( ! widget_form_control ) {
</span><span class="cx"> widget_form_control = control.addWidget( widget_id );
</span><span class="lines">@@ -160,18 +169,18 @@
</span><span class="cx">
</span><span class="cx"> // Sort widget controls to their new positions
</span><span class="cx"> widget_form_controls.sort( function ( a, b ) {
</span><del>- var a_index = new_widget_ids.indexOf( a.params.widget_id );
- var b_index = new_widget_ids.indexOf( b.params.widget_id );
</del><ins>+ var a_index = new_widget_ids.indexOf( a.params.widget_id ),
+ b_index = new_widget_ids.indexOf( b.params.widget_id );
</ins><span class="cx"> if ( a_index === b_index ) {
</span><span class="cx"> return 0;
</span><span class="cx"> }
</span><span class="cx"> return a_index < b_index ? -1 : 1;
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- var sidebar_widgets_add_control = control.section_content.find( '.customize-control-sidebar_widgets' );
</del><ins>+ sidebar_widgets_add_control = control.section_content.find( '.customize-control-sidebar_widgets' );
</ins><span class="cx">
</span><span class="cx"> // Append the controls to put them in the right order
</span><del>- var final_control_containers = _( widget_form_controls ).map( function( widget_form_controls ) {
</del><ins>+ final_control_containers = _( widget_form_controls ).map( function( widget_form_controls ) {
</ins><span class="cx"> return widget_form_controls.container[0];
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="lines">@@ -189,15 +198,21 @@
</span><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;
</del><ins>+ var is_present_in_another_sidebar = false,
+ removed_control,
+ was_dragged_to_another_sidebar,
+ inactive_widgets,
+ removed_id_base,
+ widget;
</ins><span class="cx">
</span><span class="cx"> // Check if the widget is in another sidebar
</span><span class="cx"> wp.customize.each( function ( other_setting ) {
</span><span class="cx"> if ( other_setting.id === control.setting.id || 0 !== other_setting.id.indexOf( 'sidebars_widgets[' ) || other_setting.id === 'sidebars_widgets[wp_inactive_widgets]' ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var other_sidebar_widgets = other_setting();
- var i = other_sidebar_widgets.indexOf( removed_widget_id );
</del><ins>+ var other_sidebar_widgets = other_setting(), i;
+
+ i = other_sidebar_widgets.indexOf( removed_widget_id );
</ins><span class="cx"> if ( -1 !== i ) {
</span><span class="cx"> is_present_in_another_sidebar = true;
</span><span class="cx"> }
</span><span class="lines">@@ -208,10 +223,10 @@
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var removed_control = self.getWidgetFormControlForWidget( removed_widget_id );
</del><ins>+ removed_control = self.getWidgetFormControlForWidget( removed_widget_id );
</ins><span class="cx">
</span><span class="cx"> // Detect if widget control was dragged to another sidebar
</span><del>- var was_dragged_to_another_sidebar = (
</del><ins>+ was_dragged_to_another_sidebar = (
</ins><span class="cx"> removed_control &&
</span><span class="cx"> $.contains( document, removed_control.container[0] ) &&
</span><span class="cx"> ! $.contains( control.section_content[0], removed_control.container[0] )
</span><span class="lines">@@ -226,14 +241,14 @@
</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><span class="cx"> if ( self.saved_widget_ids[removed_widget_id] ) {
</span><del>- var inactive_widgets = wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )().slice();
</del><ins>+ inactive_widgets = wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )().slice();
</ins><span class="cx"> inactive_widgets.push( removed_widget_id );
</span><span class="cx"> wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )( _( inactive_widgets ).unique() );
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> // Make old single widget available for adding again
</span><del>- var removed_id_base = parse_widget_id( removed_widget_id ).id_base;
- var widget = self.available_widgets.findWhere( { id_base: removed_id_base } );
</del><ins>+ removed_id_base = parse_widget_id( removed_widget_id ).id_base;
+ widget = self.available_widgets.findWhere( { id_base: removed_id_base } );
</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">@@ -250,8 +265,8 @@
</span><span class="cx">
</span><span class="cx"> // Show the sidebar section when it becomes visible
</span><span class="cx"> registered_sidebar.on( 'change:is_rendered', function ( ) {
</span><del>- var section_selector = '#accordion-section-sidebar-widgets-' + this.get( 'id' );
- var section = $( section_selector );
</del><ins>+ var section_selector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ), section;
+ section = $( section_selector );
</ins><span class="cx"> if ( this.get( 'is_rendered' ) ) {
</span><span class="cx"> section.stop().slideDown( function () {
</span><span class="cx"> $( this ).css( 'height', 'auto' ); // so that the .accordion-section-content won't overflow
</span><span class="lines">@@ -283,8 +298,8 @@
</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' );
- var widget_ids = $.map( widget_container_ids, function ( widget_container_id ) {
</del><ins>+ var widget_container_ids = control.section_content.sortable( 'toArray' ), widget_ids;
+ widget_ids = $.map( widget_container_ids, function ( widget_container_id ) {
</ins><span class="cx"> return $( '#' + widget_container_id ).find( ':input[name=widget-id]' ).val();
</span><span class="cx"> } );
</span><span class="cx"> control.setting( widget_ids );
</span><span class="lines">@@ -392,10 +407,12 @@
</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;
- var form_controls = _( control.setting() ).map( function ( widget_id ) {
- var setting_id = widget_id_to_setting_id( widget_id );
- var form_control = customize.control( setting_id );
</del><ins>+ var control = this, form_controls;
+
+ form_controls = _( control.setting() ).map( function ( widget_id ) {
+ var setting_id = widget_id_to_setting_id( widget_id ),
+ form_control = customize.control( setting_id );
+
</ins><span class="cx"> if ( ! form_control ) {
</span><span class="cx"> throw new Error( 'Unable to find widget_form control for ' + widget_id );
</span><span class="cx"> }
</span><span class="lines">@@ -409,11 +426,21 @@
</span><span class="cx"> * @returns {object} widget_form control instance
</span><span class="cx"> */
</span><span class="cx"> addWidget: function ( widget_id ) {
</span><del>- var control = this;
- var parsed_widget_id = parse_widget_id( widget_id );
- var widget_number = parsed_widget_id.number;
- var widget_id_base = parsed_widget_id.id_base;
- var widget = self.available_widgets.findWhere( {id_base: widget_id_base} );
</del><ins>+ var control = this,
+ control_html,
+ 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 = self.available_widgets.findWhere( {id_base: widget_id_base} ),
+ setting_id,
+ is_existing_widget,
+ Constructor,
+ widget_form_control,
+ sidebar_widgets,
+ setting_args;
+
</ins><span class="cx"> if ( ! widget ) {
</span><span class="cx"> throw new Error( 'Widget unexpectedly not found.' );
</span><span class="cx"> }
</span><span class="lines">@@ -427,7 +454,7 @@
</span><span class="cx"> widget_number = widget.get( 'multi_number' );
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var control_html = $( '#widget-tpl-' + widget.get( 'id' ) ).html();
</del><ins>+ control_html = $( '#widget-tpl-' + widget.get( 'id' ) ).html();
</ins><span class="cx"> if ( widget.get( 'is_multi' ) ) {
</span><span class="cx"> control_html = control_html.replace( /<[^<>]+>/g, function ( m ) {
</span><span class="cx"> return m.replace( /__i__|%i%/g, widget_number );
</span><span class="lines">@@ -436,8 +463,7 @@
</span><span class="cx"> widget.set( 'is_disabled', true ); // Prevent single widget from being added again now
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var customize_control_type = 'widget_form';
- var customize_control = $( '<li></li>' );
</del><ins>+ customize_control = $( '<li></li>' );
</ins><span class="cx"> customize_control.addClass( 'customize-control' );
</span><span class="cx"> customize_control.addClass( 'customize-control-' + customize_control_type );
</span><span class="cx"> customize_control.append( $( control_html ) );
</span><span class="lines">@@ -449,7 +475,7 @@
</span><span class="cx"> widget_id = customize_control.find( '[name="widget-id"]' ).val();
</span><span class="cx"> customize_control.hide(); // to be slid-down below
</span><span class="cx">
</span><del>- var setting_id = 'widget_' + widget.get( 'id_base' );
</del><ins>+ setting_id = 'widget_' + widget.get( 'id_base' );
</ins><span class="cx"> if ( widget.get( 'is_multi' ) ) {
</span><span class="cx"> setting_id += '[' + widget_number + ']';
</span><span class="cx"> }
</span><span class="lines">@@ -458,17 +484,17 @@
</span><span class="cx"> control.container.after( customize_control );
</span><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>- var is_existing_widget = wp.customize.has( setting_id );
</del><ins>+ is_existing_widget = wp.customize.has( setting_id );
</ins><span class="cx"> if ( ! is_existing_widget ) {
</span><del>- var setting_args = {
</del><ins>+ setting_args = {
</ins><span class="cx"> transport: 'refresh',
</span><span class="cx"> previewer: control.setting.previewer
</span><span class="cx"> };
</span><span class="cx"> wp.customize.create( setting_id, setting_id, {}, setting_args );
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var Constructor = wp.customize.controlConstructor[customize_control_type];
- var widget_form_control = new Constructor( setting_id, {
</del><ins>+ Constructor = wp.customize.controlConstructor[customize_control_type];
+ widget_form_control = new Constructor( setting_id, {
</ins><span class="cx"> params: {
</span><span class="cx"> settings: {
</span><span class="cx"> 'default': setting_id
</span><span class="lines">@@ -494,8 +520,8 @@
</span><span class="cx"> if ( 0 !== other_setting.id.indexOf( 'sidebars_widgets[' ) ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var other_sidebar_widgets = other_setting().slice();
- var i = other_sidebar_widgets.indexOf( widget_id );
</del><ins>+ var other_sidebar_widgets = other_setting().slice(), i;
+ i = other_sidebar_widgets.indexOf( widget_id );
</ins><span class="cx"> if ( -1 !== i ) {
</span><span class="cx"> other_sidebar_widgets.splice( i );
</span><span class="cx"> other_setting( other_sidebar_widgets );
</span><span class="lines">@@ -503,7 +529,7 @@
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> // Add widget to this sidebar
</span><del>- var sidebar_widgets = control.setting().slice();
</del><ins>+ sidebar_widgets = control.setting().slice();
</ins><span class="cx"> if ( -1 === sidebar_widgets.indexOf( widget_id ) ) {
</span><span class="cx"> sidebar_widgets.push( widget_id );
</span><span class="cx"> control.setting( sidebar_widgets );
</span><span class="lines">@@ -560,9 +586,10 @@
</span><span class="cx"> _default: {},
</span><span class="cx"> rss: {
</span><span class="cx"> formUpdated: function ( serialized_form ) {
</span><del>- var control = this;
- var old_widget_error = control.container.find( '.widget-error:first' );
- var new_widget_error = serialized_form.find( '.widget-error:first' );
</del><ins>+ var control = this,
+ old_widget_error = control.container.find( '.widget-error:first' ),
+ new_widget_error = serialized_form.find( '.widget-error:first' );
+
</ins><span class="cx"> if ( old_widget_error.length && new_widget_error.length ) {
</span><span class="cx"> old_widget_error.replaceWith( new_widget_error );
</span><span class="cx"> } else if ( old_widget_error.length ) {
</span><span class="lines">@@ -580,8 +607,8 @@
</span><span class="cx"> * @param name
</span><span class="cx"> */
</span><span class="cx"> hook: function ( name ) {
</span><del>- var args = Array.prototype.slice.call( arguments, 1 );
- var handler;
</del><ins>+ var args = Array.prototype.slice.call( arguments, 1 ), handler;
+
</ins><span class="cx"> if ( this.hooks[this.params.widget_id_base] && this.hooks[this.params.widget_id_base][name] ) {
</span><span class="cx"> handler = this.hooks[this.params.widget_id_base][name];
</span><span class="cx"> } else if ( this.hooks._default[name] ) {
</span><span class="lines">@@ -596,10 +623,10 @@
</span><span class="cx"> * Handle changes to the setting
</span><span class="cx"> */
</span><span class="cx"> _setupModel: function () {
</span><del>- var control = this;
</del><ins>+ var control = this, remember_saved_widget_id;
</ins><span class="cx">
</span><span class="cx"> // Remember saved widgets so we know which to trash (move to inactive widgets sidebar)
</span><del>- var remember_saved_widget_id = function () {
</del><ins>+ remember_saved_widget_id = function () {
</ins><span class="cx"> self.saved_widget_ids[control.params.widget_id] = true;
</span><span class="cx"> };
</span><span class="cx"> wp.customize.bind( 'ready', remember_saved_widget_id );
</span><span class="lines">@@ -620,12 +647,18 @@
</span><span class="cx"> * Add special behaviors for wide widget controls
</span><span class="cx"> */
</span><span class="cx"> _setupWideWidget: function () {
</span><del>- var control = this;
</del><ins>+ var control = this,
+ widget_inside,
+ customize_sidebar,
+ position_widget,
+ theme_controls_container;
+
</ins><span class="cx"> if ( ! control.params.is_wide ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><del>- var widget_inside = control.container.find( '.widget-inside' );
- var customize_sidebar = $( '.wp-full-overlay-sidebar-content:first' );
</del><ins>+
+ widget_inside = control.container.find( '.widget-inside' );
+ customize_sidebar = $( '.wp-full-overlay-sidebar-content:first' );
</ins><span class="cx"> control.container.addClass( 'wide-widget-control' );
</span><span class="cx">
</span><span class="cx"> control.container.find( '.widget-content:first' ).css( {
</span><span class="lines">@@ -639,16 +672,20 @@
</span><span class="cx"> * widget-top is scrolled out of view, keep the widget-top in view;
</span><span class="cx"> * likewise, don't allow the widget to drop off the bottom of the window.
</span><span class="cx"> */
</span><del>- var position_widget = function () {
- var offset_top = control.container.offset().top;
- var height = widget_inside.outerHeight();
- var top = Math.max( offset_top, 0 );
- var max_top = $( window ).height() - height;
</del><ins>+ position_widget = function () {
+ var offset_top = control.container.offset().top,
+ height,
+ top,
+ max_top;
+
+ height = widget_inside.outerHeight();
+ top = Math.max( offset_top, 0 );
+ max_top = $( window ).height() - height;
</ins><span class="cx"> top = Math.min( top, max_top );
</span><span class="cx"> widget_inside.css( 'top', top );
</span><span class="cx"> };
</span><span class="cx">
</span><del>- var theme_controls_container = $( '#customize-theme-controls' );
</del><ins>+ theme_controls_container = $( '#customize-theme-controls' );
</ins><span class="cx"> control.container.on( 'expand', function () {
</span><span class="cx"> customize_sidebar.on( 'scroll', position_widget );
</span><span class="cx"> $( window ).on( 'resize', position_widget );
</span><span class="lines">@@ -678,7 +715,8 @@
</span><span class="cx"> * the close button
</span><span class="cx"> */
</span><span class="cx"> _setupControlToggle: function() {
</span><del>- var control = this;
</del><ins>+ var control = this, close_btn;
+
</ins><span class="cx"> control.container.find( '.widget-top' ).on( 'click', function ( e ) {
</span><span class="cx"> e.preventDefault();
</span><span class="cx"> var sidebar_widgets_control = control.getSidebarWidgetsControl();
</span><span class="lines">@@ -688,7 +726,7 @@
</span><span class="cx"> control.toggleForm();
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- var close_btn = control.container.find( '.widget-control-close' );
</del><ins>+ close_btn = control.container.find( '.widget-control-close' );
</ins><span class="cx"> // @todo Hitting Enter on this link does nothing; will be resolved in core with <http://core.trac.wordpress.org/ticket/26633>
</span><span class="cx"> close_btn.on( 'click', function ( e ) {
</span><span class="cx"> e.preventDefault();
</span><span class="lines">@@ -701,10 +739,12 @@
</span><span class="cx"> * Update the title of the form if a title field is entered
</span><span class="cx"> */
</span><span class="cx"> _setupWidgetTitle: function () {
</span><del>- var control = this;
- var update_title = function () {
- var title = control.setting().title;
- var in_widget_title = control.container.find( '.in-widget-title' );
</del><ins>+ var control = this, update_title;
+
+ update_title = function () {
+ var title = control.setting().title,
+ in_widget_title = control.container.find( '.in-widget-title' );
+
</ins><span class="cx"> if ( title ) {
</span><span class="cx"> in_widget_title.text( ': ' + title );
</span><span class="cx"> } else {
</span><span class="lines">@@ -719,14 +759,18 @@
</span><span class="cx"> * Set up the widget-reorder-nav
</span><span class="cx"> */
</span><span class="cx"> _setupReorderUI: function () {
</span><del>- var control = this;
</del><ins>+ var control = this,
+ select_sidebar_item,
+ move_widget_area,
+ reorder_nav,
+ update_available_sidebars;
</ins><span class="cx">
</span><span class="cx"> /**
</span><span class="cx"> * select the provided sidebar list item in the move widget area
</span><span class="cx"> *
</span><span class="cx"> * @param {jQuery} li
</span><span class="cx"> */
</span><del>- var select_sidebar_item = function ( li ) {
</del><ins>+ select_sidebar_item = function ( li ) {
</ins><span class="cx"> li.siblings( '.selected' ).removeClass( 'selected' );
</span><span class="cx"> li.addClass( 'selected' );
</span><span class="cx"> var is_self_sidebar = ( li.data( 'id' ) === control.params.sidebar_id );
</span><span class="lines">@@ -737,7 +781,7 @@
</span><span class="cx"> * Add the widget reordering elements to the widget control
</span><span class="cx"> */
</span><span class="cx"> control.container.find( '.widget-title-action' ).after( $( self.tpl.widget_reorder_nav ) );
</span><del>- var move_widget_area = $(
</del><ins>+ move_widget_area = $(
</ins><span class="cx"> _.template( self.tpl.move_widget_area, {
</span><span class="cx"> sidebars: _( self.registered_sidebars.toArray() ).pluck( 'attributes' )
</span><span class="cx"> } )
</span><span class="lines">@@ -747,15 +791,18 @@
</span><span class="cx"> /**
</span><span class="cx"> * Update available sidebars when their rendered state changes
</span><span class="cx"> */
</span><del>- var update_available_sidebars = function () {
- var sidebar_items = move_widget_area.find( 'li' );
- var self_sidebar_item = sidebar_items.filter( function(){
</del><ins>+ update_available_sidebars = function () {
+ var sidebar_items = move_widget_area.find( 'li' ), self_sidebar_item;
+ self_sidebar_item = sidebar_items.filter( function(){
</ins><span class="cx"> return $( this ).data( 'id' ) === control.params.sidebar_id;
</span><span class="cx"> } );
</span><span class="cx"> sidebar_items.each( function () {
</span><del>- var li = $( this );
- var sidebar_id = li.data( 'id' );
- var sidebar_model = self.registered_sidebars.get( sidebar_id );
</del><ins>+ var li = $( this ),
+ sidebar_id,
+ sidebar_model;
+
+ sidebar_id = li.data( 'id' );
+ sidebar_model = self.registered_sidebars.get( sidebar_id );
</ins><span class="cx"> li.toggle( sidebar_model.get( 'is_rendered' ) );
</span><span class="cx"> if ( li.hasClass( 'selected' ) && ! sidebar_model.get( 'is_rendered' ) ) {
</span><span class="cx"> select_sidebar_item( self_sidebar_item );
</span><span class="lines">@@ -768,7 +815,7 @@
</span><span class="cx"> /**
</span><span class="cx"> * Handle clicks for up/down/move on the reorder nav
</span><span class="cx"> */
</span><del>- var reorder_nav = control.container.find( '.widget-reorder-nav' );
</del><ins>+ reorder_nav = control.container.find( '.widget-reorder-nav' );
</ins><span class="cx"> reorder_nav.find( '.move-widget, .move-widget-down, .move-widget-up' ).on( 'click keypress', function ( event ) {
</span><span class="cx"> if ( event.type === 'keypress' && ( event.which !== 13 && event.which !== 32 ) ) {
</span><span class="cx"> return;
</span><span class="lines">@@ -778,9 +825,10 @@
</span><span class="cx"> if ( $( this ).is( '.move-widget' ) ) {
</span><span class="cx"> control.toggleWidgetMoveArea();
</span><span class="cx"> } else {
</span><del>- var is_move_down = $( this ).is( '.move-widget-down' );
- var is_move_up = $( this ).is( '.move-widget-up' );
- var i = control.getWidgetSidebarPosition();
</del><ins>+ var is_move_down = $( this ).is( '.move-widget-down' ),
+ is_move_up = $( this ).is( '.move-widget-up' ),
+ i = control.getWidgetSidebarPosition();
+
</ins><span class="cx"> if ( ( is_move_up && i === 0 ) || ( is_move_down && i === control.getSidebarWidgetsControl().setting().length - 1 ) ) {
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="lines">@@ -812,14 +860,20 @@
</span><span class="cx"> control.container.find( '.move-widget-btn' ).click( function () {
</span><span class="cx"> control.getSidebarWidgetsControl().toggleReordering( false );
</span><span class="cx">
</span><del>- var old_sidebar_id = control.params.sidebar_id;
- var new_sidebar_id = control.container.find( '.widget-area-select li.selected' ).data( 'id' );
- var old_sidebar_widgets_setting = customize( 'sidebars_widgets[' + old_sidebar_id + ']' );
- var new_sidebar_widgets_setting = customize( 'sidebars_widgets[' + new_sidebar_id + ']' );
- var old_sidebar_widget_ids = Array.prototype.slice.call( old_sidebar_widgets_setting() );
- var new_sidebar_widget_ids = Array.prototype.slice.call( new_sidebar_widgets_setting() );
</del><ins>+ var old_sidebar_id = control.params.sidebar_id,
+ new_sidebar_id = control.container.find( '.widget-area-select li.selected' ).data( 'id' ),
+ old_sidebar_widgets_setting,
+ new_sidebar_widgets_setting,
+ old_sidebar_widget_ids,
+ new_sidebar_widget_ids,
+ i;
</ins><span class="cx">
</span><del>- var i = control.getWidgetSidebarPosition();
</del><ins>+ old_sidebar_widgets_setting = customize( 'sidebars_widgets[' + old_sidebar_id + ']' );
+ new_sidebar_widgets_setting = customize( 'sidebars_widgets[' + new_sidebar_id + ']' );
+ old_sidebar_widget_ids = Array.prototype.slice.call( old_sidebar_widgets_setting() );
+ new_sidebar_widget_ids = Array.prototype.slice.call( new_sidebar_widgets_setting() );
+
+ i = control.getWidgetSidebarPosition();
</ins><span class="cx"> old_sidebar_widget_ids.splice( i, 1 );
</span><span class="cx"> new_sidebar_widget_ids.push( control.params.widget_id );
</span><span class="cx">
</span><span class="lines">@@ -857,12 +911,15 @@
</span><span class="cx"> * Set up event handlers for widget updating
</span><span class="cx"> */
</span><span class="cx"> _setupUpdateUI: function () {
</span><del>- var control = this;
</del><ins>+ var control = this,
+ widget_content,
+ save_btn,
+ trigger_save;
</ins><span class="cx">
</span><del>- var widget_content = control.container.find( '.widget-content' );
</del><ins>+ widget_content = control.container.find( '.widget-content' );
</ins><span class="cx">
</span><span class="cx"> // Configure update button
</span><del>- var save_btn = control.container.find( '.widget-control-save' );
</del><ins>+ save_btn = control.container.find( '.widget-control-save' );
</ins><span class="cx"> save_btn.val( self.i18n.save_btn_label );
</span><span class="cx"> save_btn.attr( 'title', self.i18n.save_btn_tooltip );
</span><span class="cx"> save_btn.removeClass( 'button-primary' ).addClass( 'button-secondary' );
</span><span class="lines">@@ -871,7 +928,7 @@
</span><span class="cx"> control.updateWidget();
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- var trigger_save = _.debounce( function () {
</del><ins>+ trigger_save = _.debounce( function () {
</ins><span class="cx"> // @todo For compatibility with other plugins, should we trigger a click event? What about form submit event?
</span><span class="cx"> control.updateWidget();
</span><span class="cx"> }, 250 );
</span><span class="lines">@@ -912,10 +969,12 @@
</span><span class="cx"> * Set up event handlers for widget removal
</span><span class="cx"> */
</span><span class="cx"> _setupRemoveUI: function () {
</span><del>- var control = this;
</del><ins>+ var control = this,
+ remove_btn,
+ replace_delete_with_remove;
</ins><span class="cx">
</span><span class="cx"> // Configure remove button
</span><del>- var remove_btn = control.container.find( 'a.widget-control-remove' );
</del><ins>+ remove_btn = control.container.find( 'a.widget-control-remove' );
</ins><span class="cx"> // @todo Hitting Enter on this link does nothing; will be resolved in core with <http://core.trac.wordpress.org/ticket/26633>
</span><span class="cx"> remove_btn.on( 'click', function ( e ) {
</span><span class="cx"> e.preventDefault();
</span><span class="lines">@@ -931,12 +990,15 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> control.container.slideUp( function() {
</span><del>- var sidebars_widgets_control = self.getSidebarWidgetControlContainingWidget( control.params.widget_id );
</del><ins>+ var sidebars_widgets_control = self.getSidebarWidgetControlContainingWidget( control.params.widget_id ),
+ sidebar_widget_ids,
+ i;
+
</ins><span class="cx"> if ( ! sidebars_widgets_control ) {
</span><span class="cx"> throw new Error( 'Unable to find sidebars_widgets_control' );
</span><span class="cx"> }
</span><del>- var sidebar_widget_ids = sidebars_widgets_control.setting().slice();
- var i = sidebar_widget_ids.indexOf( control.params.widget_id );
</del><ins>+ sidebar_widget_ids = sidebars_widgets_control.setting().slice();
+ i = sidebar_widget_ids.indexOf( control.params.widget_id );
</ins><span class="cx"> if ( -1 === i ) {
</span><span class="cx"> throw new Error( 'Widget is not in sidebar' );
</span><span class="cx"> }
</span><span class="lines">@@ -946,7 +1008,7 @@
</span><span class="cx"> } );
</span><span class="cx"> } );
</span><span class="cx">
</span><del>- var replace_delete_with_remove = function () {
</del><ins>+ replace_delete_with_remove = function () {
</ins><span class="cx"> remove_btn.text( self.i18n.remove_btn_label ); // wp_widget_control() outputs the link as "Delete"
</span><span class="cx"> remove_btn.attr( 'title', self.i18n.remove_btn_tooltip );
</span><span class="cx"> };
</span><span class="lines">@@ -1007,9 +1069,10 @@
</span><span class="cx"> * @return {wp.customize.controlConstructor.sidebar_widgets[]}
</span><span class="cx"> */
</span><span class="cx"> getSidebarWidgetsControl: function () {
</span><del>- var control = this;
- var setting_id = 'sidebars_widgets[' + control.params.sidebar_id + ']';
- var sidebar_widgets_control = customize.control( setting_id );
</del><ins>+ var control = this, setting_id, sidebar_widgets_control;
+
+ setting_id = 'sidebars_widgets[' + control.params.sidebar_id + ']';
+ sidebar_widgets_control = customize.control( setting_id );
</ins><span class="cx"> if ( ! sidebar_widgets_control ) {
</span><span class="cx"> throw new Error( 'Unable to locate sidebar_widgets control for ' + control.params.sidebar_id );
</span><span class="cx"> }
</span><span class="lines">@@ -1026,23 +1089,33 @@
</span><span class="cx"> * @param {Boolean} [args.ignore_active_element=false] Whether or not updating a field will be deferred if focus is still on the element.
</span><span class="cx"> */
</span><span class="cx"> updateWidget: function ( args ) {
</span><del>- var control = this;
</del><ins>+ var control = this,
+ instance_override,
+ complete_callback,
+ update_number,
+ widget_content,
+ element_id_to_refocus = null,
+ active_input_selection_start = null,
+ active_input_selection_end = null,
+ params = {},
+ data,
+ inputs,
+ jqxhr;
+
</ins><span class="cx"> args = $.extend( {
</span><span class="cx"> instance: null,
</span><span class="cx"> complete: null,
</span><span class="cx"> ignore_active_element: false
</span><span class="cx"> }, args );
</span><del>- var instance_override = args.instance;
- var complete_callback = args.complete;
</del><span class="cx">
</span><ins>+ instance_override = args.instance;
+ complete_callback = args.complete;
+
</ins><span class="cx"> control._update_count += 1;
</span><del>- var update_number = control._update_count;
</del><ins>+ update_number = control._update_count;
</ins><span class="cx">
</span><del>- var widget_content = control.container.find( '.widget-content' );
</del><ins>+ widget_content = control.container.find( '.widget-content' );
</ins><span class="cx">
</span><del>- var element_id_to_refocus = null;
- var active_input_selection_start = null;
- var active_input_selection_end = null;
</del><span class="cx"> // @todo Support more selectors than IDs?
</span><span class="cx"> if ( $.contains( control.container[0], document.activeElement ) && $( document.activeElement ).is( '[id]' ) ) {
</span><span class="cx"> element_id_to_refocus = $( document.activeElement ).prop( 'id' );
</span><span class="lines">@@ -1057,19 +1130,19 @@
</span><span class="cx"> control.container.addClass( 'widget-form-loading' );
</span><span class="cx"> control.container.addClass( 'previewer-loading' );
</span><span class="cx">
</span><del>- var params = {};
</del><ins>+ params = {};
</ins><span class="cx"> params.action = self.update_widget_ajax_action;
</span><span class="cx"> params[self.update_widget_nonce_post_key] = self.update_widget_nonce_value;
</span><span class="cx">
</span><del>- var data = $.param( params );
- var inputs = widget_content.find( ':input, option' );
</del><ins>+ data = $.param( params );
+ inputs = widget_content.find( ':input, option' );
</ins><span class="cx">
</span><span class="cx"> // Store the value we're submitting in data so that when the response comes back,
</span><span class="cx"> // we know if it got sanitized; if there is no difference in the sanitized value,
</span><span class="cx"> // then we do not need to touch the UI and mess up the user's ongoing editing.
</span><span class="cx"> inputs.each( function () {
</span><del>- var input = $( this );
- var property = control._getInputStatePropertyName( this );
</del><ins>+ var input = $( this ),
+ property = control._getInputStatePropertyName( this );
</ins><span class="cx"> input.data( 'state' + update_number, input.prop( property ) );
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="lines">@@ -1080,22 +1153,32 @@
</span><span class="cx"> }
</span><span class="cx"> data += '&' + widget_content.find( '~ :input' ).serialize();
</span><span class="cx">
</span><del>- console.log( wp.ajax.settings.url, data );
- var jqxhr = $.post( wp.ajax.settings.url, data, function ( r ) {
</del><ins>+ window.console && window.console.log( wp.ajax.settings.url, data );
+ jqxhr = $.post( wp.ajax.settings.url, data, function ( r ) {
+ var message,
+ sanitized_form,
+ sanitized_inputs,
+ has_same_inputs_in_response,
+ is_instance_identical;
+
</ins><span class="cx"> if ( r.success ) {
</span><del>- var sanitized_form = $( '<div>' + r.data.form + '</div>' );
</del><ins>+ sanitized_form = $( '<div>' + r.data.form + '</div>' );
+
</ins><span class="cx"> control.hook( 'formUpdate', sanitized_form );
</span><span class="cx">
</span><del>- var sanitized_inputs = sanitized_form.find( ':input, option' );
- var has_same_inputs_in_response = control._getInputsSignature( inputs ) === control._getInputsSignature( sanitized_inputs );
</del><ins>+ sanitized_inputs = sanitized_form.find( ':input, option' );
+ has_same_inputs_in_response = control._getInputsSignature( inputs ) === control._getInputsSignature( sanitized_inputs );
</ins><span class="cx">
</span><span class="cx"> if ( has_same_inputs_in_response ) {
</span><span class="cx"> inputs.each( function ( i ) {
</span><del>- var input = $( this );
- var sanitized_input = $( sanitized_inputs[i] );
- var property = control._getInputStatePropertyName( this );
- var state = input.data( 'state' + update_number );
- var sanitized_state = sanitized_input.prop( property );
</del><ins>+ var input = $( this ),
+ sanitized_input = $( sanitized_inputs[i] ),
+ property = control._getInputStatePropertyName( this ),
+ state,
+ sanitized_state;
+
+ state = input.data( 'state' + update_number );
+ sanitized_state = sanitized_input.prop( property );
</ins><span class="cx"> input.data( 'sanitized', sanitized_state );
</span><span class="cx">
</span><span class="cx"> if ( state !== sanitized_state ) {
</span><span class="lines">@@ -1132,7 +1215,7 @@
</span><span class="cx"> * needing to be rendered, and so we can preempt the event for the
</span><span class="cx"> * preview finishing loading.
</span><span class="cx"> */
</span><del>- var is_instance_identical = _( control.setting() ).isEqual( r.data.instance );
</del><ins>+ is_instance_identical = _( control.setting() ).isEqual( r.data.instance );
</ins><span class="cx"> if ( is_instance_identical ) {
</span><span class="cx"> control.container.removeClass( 'previewer-loading' );
</span><span class="cx"> } else {
</span><span class="lines">@@ -1145,8 +1228,8 @@
</span><span class="cx"> complete_callback.call( control, null, { no_change: is_instance_identical, ajax_finished: true } );
</span><span class="cx"> }
</span><span class="cx"> } else {
</span><del>- console.log( r );
- var message = 'FAIL';
</del><ins>+ window.console && window.console.log( r );
+ message = 'FAIL';
</ins><span class="cx"> if ( r.data && r.data.message ) {
</span><span class="cx"> message = r.data.message;
</span><span class="cx"> }
</span><span class="lines">@@ -1203,9 +1286,10 @@
</span><span class="cx"> * @param {boolean|undefined} [do_expand] If not supplied, will be inverse of current visibility
</span><span class="cx"> */
</span><span class="cx"> toggleForm: function ( do_expand ) {
</span><del>- var control = this;
- var widget = control.container.find( 'div.widget:first' );
- var inside = widget.find( '.widget-inside:first' );
</del><ins>+ var control = this, widget, inside, complete;
+
+ widget = control.container.find( 'div.widget:first' );
+ inside = widget.find( '.widget-inside:first' );
</ins><span class="cx"> if ( typeof do_expand === 'undefined' ) {
</span><span class="cx"> do_expand = ! inside.is( ':visible' );
</span><span class="cx"> }
</span><span class="lines">@@ -1215,7 +1299,7 @@
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var complete;
</del><ins>+ complete;
</ins><span class="cx"> if ( do_expand ) {
</span><span class="cx"> // Close all other widget controls before expanding this one
</span><span class="cx"> wp.customize.control.each( function ( other_control ) {
</span><span class="lines">@@ -1273,9 +1357,12 @@
</span><span class="cx"> * @returns {Number}
</span><span class="cx"> */
</span><span class="cx"> getWidgetSidebarPosition: function () {
</span><del>- var control = this;
- var sidebar_widget_ids = control.getSidebarWidgetsControl().setting();
- var position = sidebar_widget_ids.indexOf( control.params.widget_id );
</del><ins>+ var control = this,
+ sidebar_widget_ids,
+ position;
+
+ sidebar_widget_ids = control.getSidebarWidgetsControl().setting();
+ position = sidebar_widget_ids.indexOf( control.params.widget_id );
</ins><span class="cx"> if ( position === -1 ) {
</span><span class="cx"> throw new Error( 'Widget was unexpectedly not present in the sidebar.' );
</span><span class="cx"> }
</span><span class="lines">@@ -1302,12 +1389,17 @@
</span><span class="cx"> * @param {Number} offset 1|-1
</span><span class="cx"> */
</span><span class="cx"> _moveWidgetByOne: function ( offset ) {
</span><del>- var control = this;
- var i = control.getWidgetSidebarPosition();
</del><ins>+ var control = this,
+ i,
+ sidebar_widgets_setting,
+ sidebar_widget_ids,
+ adjacent_widget_id;
</ins><span class="cx">
</span><del>- var sidebar_widgets_setting = control.getSidebarWidgetsControl().setting;
- var sidebar_widget_ids = Array.prototype.slice.call( sidebar_widgets_setting() ); // clone
- var adjacent_widget_id = sidebar_widget_ids[i + offset];
</del><ins>+ i = control.getWidgetSidebarPosition();
+
+ sidebar_widgets_setting = control.getSidebarWidgetsControl().setting;
+ sidebar_widget_ids = Array.prototype.slice.call( sidebar_widgets_setting() ); // clone
+ adjacent_widget_id = sidebar_widget_ids[i + offset];
</ins><span class="cx"> sidebar_widget_ids[i + offset] = control.params.widget_id;
</span><span class="cx"> sidebar_widget_ids[i] = adjacent_widget_id;
</span><span class="cx">
</span><span class="lines">@@ -1320,8 +1412,8 @@
</span><span class="cx"> * @param {Boolean} [toggle]
</span><span class="cx"> */
</span><span class="cx"> toggleWidgetMoveArea: function ( toggle ) {
</span><del>- var control = this;
- var move_widget_area = control.container.find( '.move-widget-area' );
</del><ins>+ var control = this, move_widget_area;
+ move_widget_area = control.container.find( '.move-widget-area' );
</ins><span class="cx"> if ( typeof toggle === 'undefined' ) {
</span><span class="cx"> toggle = ! move_widget_area.hasClass( 'active' );
</span><span class="cx"> }
</span><span class="lines">@@ -1341,8 +1433,8 @@
</span><span class="cx"> * @return {jQuery}
</span><span class="cx"> */
</span><span class="cx"> getPreviewWidgetElement: function () {
</span><del>- var control = this;
- var widget_customizer_preview = self.getPreviewWindow().WidgetCustomizerPreview;
</del><ins>+ var control = this,
+ widget_customizer_preview = self.getPreviewWindow().WidgetCustomizerPreview;
</ins><span class="cx"> return widget_customizer_preview.getSidebarWidgetElement( control.params.sidebar_id, control.params.widget_id );
</span><span class="cx"> },
</span><span class="cx">
</span><span class="lines">@@ -1357,8 +1449,8 @@
</span><span class="cx"> * Highlight the widget control and section
</span><span class="cx"> */
</span><span class="cx"> highlightSectionAndControl: function() {
</span><del>- var control = this;
- var target_element;
</del><ins>+ var control = this, target_element;
+
</ins><span class="cx"> if ( control.container.is( ':hidden' ) ) {
</span><span class="cx"> target_element = control.container.closest( '.control-section' );
</span><span class="cx"> } else {
</span><span class="lines">@@ -1376,9 +1468,10 @@
</span><span class="cx"> * Add the widget-customizer-highlighted-widget class to the widget for 500ms
</span><span class="cx"> */
</span><span class="cx"> highlightPreviewWidget: function () {
</span><del>- var control = this;
- var widget_el = control.getPreviewWidgetElement();
- var root_el = widget_el.closest( 'html' );
</del><ins>+ var control = this, widget_el, root_el;
+
+ widget_el = control.getPreviewWidgetElement();
+ root_el = widget_el.closest( 'html' );
</ins><span class="cx"> root_el.find( '.widget-customizer-highlighted-widget' ).removeClass( 'widget-customizer-highlighted-widget' );
</span><span class="cx"> widget_el.addClass( 'widget-customizer-highlighted-widget' );
</span><span class="cx"> setTimeout( function () {
</span><span class="lines">@@ -1391,7 +1484,7 @@
</span><span class="cx"> /**
</span><span class="cx"> * Capture the instance of the Previewer since it is private
</span><span class="cx"> */
</span><del>- var OldPreviewer = wp.customize.Previewer;
</del><ins>+ OldPreviewer = wp.customize.Previewer;
</ins><span class="cx"> wp.customize.Previewer = OldPreviewer.extend( {
</span><span class="cx"> initialize: function( params, options ) {
</span><span class="cx"> self.previewer = this;
</span><span class="lines">@@ -1452,11 +1545,12 @@
</span><span class="cx"> * Set up event listeners
</span><span class="cx"> */
</span><span class="cx"> setup: function () {
</span><del>- var panel = this;
</del><ins>+ var panel = this, update_available_widgets_list;
+
</ins><span class="cx"> panel.container = $( '#available-widgets' );
</span><span class="cx"> panel.filter_input = $( '#available-widgets-filter' ).find( 'input' );
</span><span class="cx">
</span><del>- var update_available_widgets_list = function () {
</del><ins>+ update_available_widgets_list = function () {
</ins><span class="cx"> self.available_widgets.each( function ( widget ) {
</span><span class="cx"> var widget_tpl = $( '#widget-tpl-' + widget.id );
</span><span class="cx"> widget_tpl.toggle( ! widget.get( 'is_disabled' ) );
</span><span class="lines">@@ -1501,7 +1595,8 @@
</span><span class="cx"> {
</span><span class="cx"> filterChildSelector: '.widget-title h4',
</span><span class="cx"> after: function () {
</span><del>- var filter_val = panel.filter_input.val();
</del><ins>+ var filter_val = panel.filter_input.val(),
+ first_visible_widget;
</ins><span class="cx">
</span><span class="cx"> // Remove a widget from being selected if it is no longer visible
</span><span class="cx"> if ( panel.selected_widget_tpl && ! panel.selected_widget_tpl.is( ':visible' ) ) {
</span><span class="lines">@@ -1517,7 +1612,7 @@
</span><span class="cx">
</span><span class="cx"> // If a filter has been entered and a widget hasn't been selected, select the first one shown
</span><span class="cx"> if ( ! panel.selected_widget_tpl && filter_val ) {
</span><del>- var first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' );
</del><ins>+ first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' );
</ins><span class="cx"> if ( first_visible_widget.length ) {
</span><span class="cx"> panel.select( first_visible_widget );
</span><span class="cx"> }
</span><span class="lines">@@ -1533,14 +1628,14 @@
</span><span class="cx"> } );
</span><span class="cx">
</span><span class="cx"> panel.container.on( 'keydown', function ( event ) {
</span><del>- var is_enter = ( event.which === 13 );
- var is_esc = ( event.which === 27 );
- var is_down = ( event.which === 40 );
- var is_up = ( event.which === 38 );
- var selected_widget_tpl = null;
- var first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' );
- var last_visible_widget = panel.container.find( '> .widget-tpl:visible:last' );
- var is_input_focused = $( event.target ).is( panel.filter_input );
</del><ins>+ var is_enter = ( event.which === 13 ),
+ is_esc = ( event.which === 27 ),
+ is_down = ( event.which === 40 ),
+ is_up = ( event.which === 38 ),
+ selected_widget_tpl = null,
+ first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' ),
+ last_visible_widget = panel.container.find( '> .widget-tpl:visible:last' ),
+ is_input_focused = $( event.target ).is( panel.filter_input );
</ins><span class="cx">
</span><span class="cx"> if ( is_down || is_up ) {
</span><span class="cx"> if ( is_down ) {
</span><span class="lines">@@ -1589,7 +1684,7 @@
</span><span class="cx"> },
</span><span class="cx">
</span><span class="cx"> submit: function ( widget_tpl ) {
</span><del>- var panel = this;
</del><ins>+ var panel = this, widget_id, widget;
</ins><span class="cx"> if ( ! widget_tpl ) {
</span><span class="cx"> widget_tpl = panel.selected_widget_tpl;
</span><span class="cx"> }
</span><span class="lines">@@ -1598,8 +1693,8 @@
</span><span class="cx"> }
</span><span class="cx"> panel.select( widget_tpl );
</span><span class="cx">
</span><del>- var widget_id = $( panel.selected_widget_tpl ).data( 'widget-id' );
- var widget = self.available_widgets.findWhere( {id: widget_id} );
</del><ins>+ widget_id = $( panel.selected_widget_tpl ).data( 'widget-id' );
+ widget = self.available_widgets.findWhere( {id: widget_id} );
</ins><span class="cx"> if ( ! widget ) {
</span><span class="cx"> throw new Error( 'Widget unexpectedly not found.' );
</span><span class="cx"> }
</span><span class="lines">@@ -1647,11 +1742,11 @@
</span><span class="cx"> * @returns {Object}
</span><span class="cx"> */
</span><span class="cx"> function parse_widget_id( widget_id ) {
</span><del>- var parsed = {
</del><ins>+ var matches, parsed = {
</ins><span class="cx"> number: null,
</span><span class="cx"> id_base: null
</span><span class="cx"> };
</span><del>- var matches = widget_id.match( /^(.+)-(\d+)$/ );
</del><ins>+ matches = widget_id.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="lines">@@ -1667,8 +1762,9 @@
</span><span class="cx"> * @returns {String} setting_id
</span><span class="cx"> */
</span><span class="cx"> function widget_id_to_setting_id( widget_id ) {
</span><del>- var parsed = parse_widget_id( widget_id );
- var setting_id = 'widget_' + parsed.id_base;
</del><ins>+ var parsed = parse_widget_id( widget_id ), setting_id;
+
+ setting_id = 'widget_' + parsed.id_base;
</ins><span class="cx"> if ( parsed.number ) {
</span><span class="cx"> setting_id += '[' + parsed.number + ']';
</span><span class="cx"> }
</span><span class="lines">@@ -1690,7 +1786,7 @@
</span><span class="cx">
</span><span class="cx"> (function($){
</span><span class="cx"> $.fn.liveFilter = function(inputEl, filterEl, options){
</span><del>- var defaults = {
</del><ins>+ var el, filter, defaults = {
</ins><span class="cx"> filterChildSelector: null,
</span><span class="cx"> filter: function(el, val){
</span><span class="cx"> return $(el).text().toUpperCase().indexOf(val.toUpperCase()) >= 0;
</span><span class="lines">@@ -1700,18 +1796,19 @@
</span><span class="cx"> };
</span><span class="cx"> options = $.extend(defaults, options);
</span><span class="cx">
</span><del>- var el = $(this).find(filterEl);
</del><ins>+ el = $(this).find(filterEl);
</ins><span class="cx"> if (options.filterChildSelector) {
</span><span class="cx"> el = el.find(options.filterChildSelector);
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var filter = options.filter;
</del><ins>+ filter = options.filter;
</ins><span class="cx"> $(inputEl).keyup(function(){
</span><del>- var val = $(this).val();
- var contains = el.filter(function(){
</del><ins>+ var val = $(this).val(), contains, containsNot;
+
+ contains = el.filter(function(){
</ins><span class="cx"> return filter(this, val);
</span><span class="cx"> });
</span><del>- var containsNot = el.not(contains);
</del><ins>+ containsNot = el.not(contains);
</ins><span class="cx"> if (options.filterChildSelector){
</span><span class="cx"> contains = contains.parents(filterEl);
</span><span class="cx"> containsNot = containsNot.parents(filterEl).hide();
</span></span></pre></div>
<a id="trunksrcwpincludesjscustomizepreviewwidgetsjs"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-includes/js/customize-preview-widgets.js (27435 => 27436)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-includes/js/customize-preview-widgets.js 2014-03-06 16:05:48 UTC (rev 27435)
+++ trunk/src/wp-includes/js/customize-preview-widgets.js 2014-03-06 16:44:56 UTC (rev 27436)
</span><span class="lines">@@ -3,7 +3,7 @@
</span><span class="cx"> var WidgetCustomizerPreview = (function ($) {
</span><span class="cx"> 'use strict';
</span><span class="cx">
</span><del>- var self = {
</del><ins>+ var OldPreview, self = {
</ins><span class="cx"> rendered_sidebars: {}, // @todo Make rendered a property of the Backbone model
</span><span class="cx"> rendered_widgets: {}, // @todo Make rendered a property of the Backbone model
</span><span class="cx"> registered_sidebars: [], // @todo Make a Backbone collection
</span><span class="lines">@@ -31,14 +31,19 @@
</span><span class="cx"> buildWidgetSelectors: function () {
</span><span class="cx"> $.each( self.registered_sidebars, function ( i, sidebar ) {
</span><span class="cx"> var widget_tpl = [
</span><del>- sidebar.before_widget.replace('%1$s', '').replace('%2$s', ''),
- sidebar.before_title,
- sidebar.after_title,
- sidebar.after_widget
- ].join('');
- var empty_widget = $(widget_tpl);
- var widget_selector = empty_widget.prop('tagName');
- var widget_classes = empty_widget.prop('className').replace(/^\s+|\s+$/g, '');
</del><ins>+ sidebar.before_widget.replace('%1$s', '').replace('%2$s', ''),
+ sidebar.before_title,
+ sidebar.after_title,
+ sidebar.after_widget
+ ].join(''),
+ empty_widget,
+ widget_selector,
+ widget_classes;
+
+ empty_widget = $(widget_tpl);
+ widget_selector = empty_widget.prop('tagName');
+ widget_classes = empty_widget.prop('className').replace(/^\s+|\s+$/g, '');
+
</ins><span class="cx"> if ( widget_classes ) {
</span><span class="cx"> widget_selector += '.' + widget_classes.split(/\s+/).join('.');
</span><span class="cx"> }
</span><span class="lines">@@ -98,7 +103,7 @@
</span><span class="cx"> /**
</span><span class="cx"> * Capture the instance of the Preview since it is private
</span><span class="cx"> */
</span><del>- var OldPreview = wp.customize.Preview;
</del><ins>+ OldPreview = wp.customize.Preview;
</ins><span class="cx"> wp.customize.Preview = OldPreview.extend( {
</span><span class="cx"> initialize: function( params, options ) {
</span><span class="cx"> self.preview = this;
</span></span></pre>
</div>
</div>
</body>
</html>