Changeset 27436
- Timestamp:
- 03/06/2014 04:44:56 PM (11 years ago)
- Location:
- trunk/src
- Files:
-
- 2 edited
-
wp-admin/js/customize-widgets.js (modified) (73 diffs)
-
wp-includes/js/customize-preview-widgets.js (modified) (3 diffs)
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/wp-admin/js/customize-widgets.js
r27419 r27436 4 4 'use strict'; 5 5 6 var customize = wp.customize; 7 var self = { 6 var Widget, 7 WidgetCollection, 8 Sidebar, 9 SidebarCollection, 10 OldPreviewer, 11 customize = wp.customize, self = { 8 12 update_widget_ajax_action: null, 9 13 update_widget_nonce_value: null, … … 40 44 * Set up model 41 45 */ 42 varWidget = self.Widget = Backbone.Model.extend( {46 Widget = self.Widget = Backbone.Model.extend( { 43 47 id: null, 44 48 temp_id: null, … … 56 60 height: null 57 61 } ); 58 var WidgetCollection = self.WidgetCollection = Backbone.Collection.extend( { 62 63 WidgetCollection = self.WidgetCollection = Backbone.Collection.extend( { 59 64 model: Widget 60 65 } ); 61 66 self.available_widgets = new WidgetCollection( self.available_widgets ); 62 67 63 varSidebar = self.Sidebar = Backbone.Model.extend( {68 Sidebar = self.Sidebar = Backbone.Model.extend( { 64 69 after_title: null, 65 70 after_widget: null, … … 72 77 is_rendered: false 73 78 } ); 74 var SidebarCollection = self.SidebarCollection = Backbone.Collection.extend( { 79 80 SidebarCollection = self.SidebarCollection = Backbone.Collection.extend( { 75 81 model: Sidebar 76 82 } ); … … 100 106 var show_first_visible_sidebar = function () { 101 107 self.registered_sidebars.off( 'change:is_rendered', show_first_visible_sidebar ); 102 var first_rendered_sidebar = self.registered_sidebars.find( function ( sidebar ) {108 var section, first_rendered_sidebar = self.registered_sidebars.find( function ( sidebar ) { 103 109 return sidebar.get( 'is_rendered' ); 104 110 } ); … … 106 112 return; 107 113 } 108 varsection = $( '#accordion-section-sidebar-widgets-' + first_rendered_sidebar.get( 'id' ) );114 section = $( '#accordion-section-sidebar-widgets-' + first_rendered_sidebar.get( 'id' ) ); 109 115 if ( ! section.hasClass( 'open' ) ) { 110 116 section.find( '.accordion-section-title' ).trigger( 'click' ); … … 139 145 */ 140 146 _setupModel: function() { 141 var control = this ;142 varregistered_sidebar = self.registered_sidebars.get( control.params.sidebar_id );147 var control = this, 148 registered_sidebar = self.registered_sidebars.get( control.params.sidebar_id ); 143 149 144 150 control.setting.bind( function( new_widget_ids, old_widget_ids ) { 145 var removed_widget_ids = _( old_widget_ids ).difference( new_widget_ids ); 151 var widget_form_controls, 152 sidebar_widgets_add_control, 153 final_control_containers, 154 removed_widget_ids = _( old_widget_ids ).difference( new_widget_ids ); 146 155 147 156 // Filter out any persistent widget_ids for widgets which have been deactivated … … 151 160 } ); 152 161 153 varwidget_form_controls = _( new_widget_ids ).map( function ( widget_id ) {162 widget_form_controls = _( new_widget_ids ).map( function ( widget_id ) { 154 163 var widget_form_control = self.getWidgetFormControlForWidget( widget_id ); 155 164 if ( ! widget_form_control ) { … … 161 170 // Sort widget controls to their new positions 162 171 widget_form_controls.sort( function ( a, b ) { 163 var a_index = new_widget_ids.indexOf( a.params.widget_id ) ;164 varb_index = new_widget_ids.indexOf( b.params.widget_id );172 var a_index = new_widget_ids.indexOf( a.params.widget_id ), 173 b_index = new_widget_ids.indexOf( b.params.widget_id ); 165 174 if ( a_index === b_index ) { 166 175 return 0; … … 169 178 } ); 170 179 171 varsidebar_widgets_add_control = control.section_content.find( '.customize-control-sidebar_widgets' );180 sidebar_widgets_add_control = control.section_content.find( '.customize-control-sidebar_widgets' ); 172 181 173 182 // Append the controls to put them in the right order 174 varfinal_control_containers = _( widget_form_controls ).map( function( widget_form_controls ) {183 final_control_containers = _( widget_form_controls ).map( function( widget_form_controls ) { 175 184 return widget_form_controls.container[0]; 176 185 } ); … … 190 199 // Using setTimeout so that when moving a widget to another sidebar, the other sidebars_widgets settings get a chance to update 191 200 setTimeout( function () { 192 var is_present_in_another_sidebar = false; 201 var is_present_in_another_sidebar = false, 202 removed_control, 203 was_dragged_to_another_sidebar, 204 inactive_widgets, 205 removed_id_base, 206 widget; 193 207 194 208 // Check if the widget is in another sidebar … … 197 211 return; 198 212 } 199 var other_sidebar_widgets = other_setting(); 200 var i = other_sidebar_widgets.indexOf( removed_widget_id ); 213 var other_sidebar_widgets = other_setting(), i; 214 215 i = other_sidebar_widgets.indexOf( removed_widget_id ); 201 216 if ( -1 !== i ) { 202 217 is_present_in_another_sidebar = true; … … 209 224 } 210 225 211 varremoved_control = self.getWidgetFormControlForWidget( removed_widget_id );226 removed_control = self.getWidgetFormControlForWidget( removed_widget_id ); 212 227 213 228 // Detect if widget control was dragged to another sidebar 214 varwas_dragged_to_another_sidebar = (229 was_dragged_to_another_sidebar = ( 215 230 removed_control && 216 231 $.contains( document, removed_control.container[0] ) && … … 227 242 // This prevents the inactive widgets sidebar from overflowing with throwaway widgets 228 243 if ( self.saved_widget_ids[removed_widget_id] ) { 229 varinactive_widgets = wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )().slice();244 inactive_widgets = wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )().slice(); 230 245 inactive_widgets.push( removed_widget_id ); 231 246 wp.customize.value( 'sidebars_widgets[wp_inactive_widgets]' )( _( inactive_widgets ).unique() ); … … 233 248 234 249 // Make old single widget available for adding again 235 varremoved_id_base = parse_widget_id( removed_widget_id ).id_base;236 varwidget = self.available_widgets.findWhere( { id_base: removed_id_base } );250 removed_id_base = parse_widget_id( removed_widget_id ).id_base; 251 widget = self.available_widgets.findWhere( { id_base: removed_id_base } ); 237 252 if ( widget && ! widget.get( 'is_multi' ) ) { 238 253 widget.set( 'is_disabled', false ); … … 251 266 // Show the sidebar section when it becomes visible 252 267 registered_sidebar.on( 'change:is_rendered', function ( ) { 253 var section_selector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ) ;254 varsection = $( section_selector );268 var section_selector = '#accordion-section-sidebar-widgets-' + this.get( 'id' ), section; 269 section = $( section_selector ); 255 270 if ( this.get( 'is_rendered' ) ) { 256 271 section.stop().slideDown( function () { … … 284 299 connectWith: '.accordion-section-content:has(.customize-control-sidebar_widgets)', 285 300 update: function () { 286 var widget_container_ids = control.section_content.sortable( 'toArray' ) ;287 varwidget_ids = $.map( widget_container_ids, function ( widget_container_id ) {301 var widget_container_ids = control.section_content.sortable( 'toArray' ), widget_ids; 302 widget_ids = $.map( widget_container_ids, function ( widget_container_id ) { 288 303 return $( '#' + widget_container_id ).find( ':input[name=widget-id]' ).val(); 289 304 } ); … … 393 408 */ 394 409 getWidgetFormControls: function () { 395 var control = this; 396 var form_controls = _( control.setting() ).map( function ( widget_id ) { 397 var setting_id = widget_id_to_setting_id( widget_id ); 398 var form_control = customize.control( setting_id ); 410 var control = this, form_controls; 411 412 form_controls = _( control.setting() ).map( function ( widget_id ) { 413 var setting_id = widget_id_to_setting_id( widget_id ), 414 form_control = customize.control( setting_id ); 415 399 416 if ( ! form_control ) { 400 417 throw new Error( 'Unable to find widget_form control for ' + widget_id ); … … 410 427 */ 411 428 addWidget: function ( widget_id ) { 412 var control = this; 413 var parsed_widget_id = parse_widget_id( widget_id ); 414 var widget_number = parsed_widget_id.number; 415 var widget_id_base = parsed_widget_id.id_base; 416 var widget = self.available_widgets.findWhere( {id_base: widget_id_base} ); 429 var control = this, 430 control_html, 431 customize_control_type = 'widget_form', 432 customize_control, 433 parsed_widget_id = parse_widget_id( widget_id ), 434 widget_number = parsed_widget_id.number, 435 widget_id_base = parsed_widget_id.id_base, 436 widget = self.available_widgets.findWhere( {id_base: widget_id_base} ), 437 setting_id, 438 is_existing_widget, 439 Constructor, 440 widget_form_control, 441 sidebar_widgets, 442 setting_args; 443 417 444 if ( ! widget ) { 418 445 throw new Error( 'Widget unexpectedly not found.' ); … … 428 455 } 429 456 430 varcontrol_html = $( '#widget-tpl-' + widget.get( 'id' ) ).html();457 control_html = $( '#widget-tpl-' + widget.get( 'id' ) ).html(); 431 458 if ( widget.get( 'is_multi' ) ) { 432 459 control_html = control_html.replace( /<[^<>]+>/g, function ( m ) { … … 437 464 } 438 465 439 var customize_control_type = 'widget_form'; 440 var customize_control = $( '<li></li>' ); 466 customize_control = $( '<li></li>' ); 441 467 customize_control.addClass( 'customize-control' ); 442 468 customize_control.addClass( 'customize-control-' + customize_control_type ); … … 450 476 customize_control.hide(); // to be slid-down below 451 477 452 varsetting_id = 'widget_' + widget.get( 'id_base' );478 setting_id = 'widget_' + widget.get( 'id_base' ); 453 479 if ( widget.get( 'is_multi' ) ) { 454 480 setting_id += '[' + widget_number + ']'; … … 459 485 460 486 // Only create setting if it doesn't already exist (if we're adding a pre-existing inactive widget) 461 varis_existing_widget = wp.customize.has( setting_id );487 is_existing_widget = wp.customize.has( setting_id ); 462 488 if ( ! is_existing_widget ) { 463 varsetting_args = {489 setting_args = { 464 490 transport: 'refresh', 465 491 previewer: control.setting.previewer … … 468 494 } 469 495 470 varConstructor = wp.customize.controlConstructor[customize_control_type];471 varwidget_form_control = new Constructor( setting_id, {496 Constructor = wp.customize.controlConstructor[customize_control_type]; 497 widget_form_control = new Constructor( setting_id, { 472 498 params: { 473 499 settings: { … … 495 521 return; 496 522 } 497 var other_sidebar_widgets = other_setting().slice() ;498 vari = other_sidebar_widgets.indexOf( widget_id );523 var other_sidebar_widgets = other_setting().slice(), i; 524 i = other_sidebar_widgets.indexOf( widget_id ); 499 525 if ( -1 !== i ) { 500 526 other_sidebar_widgets.splice( i ); … … 504 530 505 531 // Add widget to this sidebar 506 varsidebar_widgets = control.setting().slice();532 sidebar_widgets = control.setting().slice(); 507 533 if ( -1 === sidebar_widgets.indexOf( widget_id ) ) { 508 534 sidebar_widgets.push( widget_id ); … … 561 587 rss: { 562 588 formUpdated: function ( serialized_form ) { 563 var control = this; 564 var old_widget_error = control.container.find( '.widget-error:first' ); 565 var new_widget_error = serialized_form.find( '.widget-error:first' ); 589 var control = this, 590 old_widget_error = control.container.find( '.widget-error:first' ), 591 new_widget_error = serialized_form.find( '.widget-error:first' ); 592 566 593 if ( old_widget_error.length && new_widget_error.length ) { 567 594 old_widget_error.replaceWith( new_widget_error ); … … 581 608 */ 582 609 hook: function ( name ) { 583 var args = Array.prototype.slice.call( arguments, 1 ) ;584 var handler; 610 var args = Array.prototype.slice.call( arguments, 1 ), handler; 611 585 612 if ( this.hooks[this.params.widget_id_base] && this.hooks[this.params.widget_id_base][name] ) { 586 613 handler = this.hooks[this.params.widget_id_base][name]; … … 597 624 */ 598 625 _setupModel: function () { 599 var control = this ;626 var control = this, remember_saved_widget_id; 600 627 601 628 // Remember saved widgets so we know which to trash (move to inactive widgets sidebar) 602 varremember_saved_widget_id = function () {629 remember_saved_widget_id = function () { 603 630 self.saved_widget_ids[control.params.widget_id] = true; 604 631 }; … … 621 648 */ 622 649 _setupWideWidget: function () { 623 var control = this; 650 var control = this, 651 widget_inside, 652 customize_sidebar, 653 position_widget, 654 theme_controls_container; 655 624 656 if ( ! control.params.is_wide ) { 625 657 return; 626 658 } 627 var widget_inside = control.container.find( '.widget-inside' ); 628 var customize_sidebar = $( '.wp-full-overlay-sidebar-content:first' ); 659 660 widget_inside = control.container.find( '.widget-inside' ); 661 customize_sidebar = $( '.wp-full-overlay-sidebar-content:first' ); 629 662 control.container.addClass( 'wide-widget-control' ); 630 663 … … 640 673 * likewise, don't allow the widget to drop off the bottom of the window. 641 674 */ 642 var position_widget = function () { 643 var offset_top = control.container.offset().top; 644 var height = widget_inside.outerHeight(); 645 var top = Math.max( offset_top, 0 ); 646 var max_top = $( window ).height() - height; 675 position_widget = function () { 676 var offset_top = control.container.offset().top, 677 height, 678 top, 679 max_top; 680 681 height = widget_inside.outerHeight(); 682 top = Math.max( offset_top, 0 ); 683 max_top = $( window ).height() - height; 647 684 top = Math.min( top, max_top ); 648 685 widget_inside.css( 'top', top ); 649 686 }; 650 687 651 vartheme_controls_container = $( '#customize-theme-controls' );688 theme_controls_container = $( '#customize-theme-controls' ); 652 689 control.container.on( 'expand', function () { 653 690 customize_sidebar.on( 'scroll', position_widget ); … … 679 716 */ 680 717 _setupControlToggle: function() { 681 var control = this; 718 var control = this, close_btn; 719 682 720 control.container.find( '.widget-top' ).on( 'click', function ( e ) { 683 721 e.preventDefault(); … … 689 727 } ); 690 728 691 varclose_btn = control.container.find( '.widget-control-close' );729 close_btn = control.container.find( '.widget-control-close' ); 692 730 // @todo Hitting Enter on this link does nothing; will be resolved in core with <http://core.trac.wordpress.org/ticket/26633> 693 731 close_btn.on( 'click', function ( e ) { … … 702 740 */ 703 741 _setupWidgetTitle: function () { 704 var control = this; 705 var update_title = function () { 706 var title = control.setting().title; 707 var in_widget_title = control.container.find( '.in-widget-title' ); 742 var control = this, update_title; 743 744 update_title = function () { 745 var title = control.setting().title, 746 in_widget_title = control.container.find( '.in-widget-title' ); 747 708 748 if ( title ) { 709 749 in_widget_title.text( ': ' + title ); … … 720 760 */ 721 761 _setupReorderUI: function () { 722 var control = this; 762 var control = this, 763 select_sidebar_item, 764 move_widget_area, 765 reorder_nav, 766 update_available_sidebars; 723 767 724 768 /** … … 727 771 * @param {jQuery} li 728 772 */ 729 varselect_sidebar_item = function ( li ) {773 select_sidebar_item = function ( li ) { 730 774 li.siblings( '.selected' ).removeClass( 'selected' ); 731 775 li.addClass( 'selected' ); … … 738 782 */ 739 783 control.container.find( '.widget-title-action' ).after( $( self.tpl.widget_reorder_nav ) ); 740 varmove_widget_area = $(784 move_widget_area = $( 741 785 _.template( self.tpl.move_widget_area, { 742 786 sidebars: _( self.registered_sidebars.toArray() ).pluck( 'attributes' ) … … 748 792 * Update available sidebars when their rendered state changes 749 793 */ 750 varupdate_available_sidebars = function () {751 var sidebar_items = move_widget_area.find( 'li' ) ;752 varself_sidebar_item = sidebar_items.filter( function(){794 update_available_sidebars = function () { 795 var sidebar_items = move_widget_area.find( 'li' ), self_sidebar_item; 796 self_sidebar_item = sidebar_items.filter( function(){ 753 797 return $( this ).data( 'id' ) === control.params.sidebar_id; 754 798 } ); 755 799 sidebar_items.each( function () { 756 var li = $( this ); 757 var sidebar_id = li.data( 'id' ); 758 var sidebar_model = self.registered_sidebars.get( sidebar_id ); 800 var li = $( this ), 801 sidebar_id, 802 sidebar_model; 803 804 sidebar_id = li.data( 'id' ); 805 sidebar_model = self.registered_sidebars.get( sidebar_id ); 759 806 li.toggle( sidebar_model.get( 'is_rendered' ) ); 760 807 if ( li.hasClass( 'selected' ) && ! sidebar_model.get( 'is_rendered' ) ) { … … 769 816 * Handle clicks for up/down/move on the reorder nav 770 817 */ 771 varreorder_nav = control.container.find( '.widget-reorder-nav' );818 reorder_nav = control.container.find( '.widget-reorder-nav' ); 772 819 reorder_nav.find( '.move-widget, .move-widget-down, .move-widget-up' ).on( 'click keypress', function ( event ) { 773 820 if ( event.type === 'keypress' && ( event.which !== 13 && event.which !== 32 ) ) { … … 779 826 control.toggleWidgetMoveArea(); 780 827 } else { 781 var is_move_down = $( this ).is( '.move-widget-down' ); 782 var is_move_up = $( this ).is( '.move-widget-up' ); 783 var i = control.getWidgetSidebarPosition(); 828 var is_move_down = $( this ).is( '.move-widget-down' ), 829 is_move_up = $( this ).is( '.move-widget-up' ), 830 i = control.getWidgetSidebarPosition(); 831 784 832 if ( ( is_move_up && i === 0 ) || ( is_move_down && i === control.getSidebarWidgetsControl().setting().length - 1 ) ) { 785 833 return; … … 813 861 control.getSidebarWidgetsControl().toggleReordering( false ); 814 862 815 var old_sidebar_id = control.params.sidebar_id; 816 var new_sidebar_id = control.container.find( '.widget-area-select li.selected' ).data( 'id' ); 817 var old_sidebar_widgets_setting = customize( 'sidebars_widgets[' + old_sidebar_id + ']' ); 818 var new_sidebar_widgets_setting = customize( 'sidebars_widgets[' + new_sidebar_id + ']' ); 819 var old_sidebar_widget_ids = Array.prototype.slice.call( old_sidebar_widgets_setting() ); 820 var new_sidebar_widget_ids = Array.prototype.slice.call( new_sidebar_widgets_setting() ); 821 822 var i = control.getWidgetSidebarPosition(); 863 var old_sidebar_id = control.params.sidebar_id, 864 new_sidebar_id = control.container.find( '.widget-area-select li.selected' ).data( 'id' ), 865 old_sidebar_widgets_setting, 866 new_sidebar_widgets_setting, 867 old_sidebar_widget_ids, 868 new_sidebar_widget_ids, 869 i; 870 871 old_sidebar_widgets_setting = customize( 'sidebars_widgets[' + old_sidebar_id + ']' ); 872 new_sidebar_widgets_setting = customize( 'sidebars_widgets[' + new_sidebar_id + ']' ); 873 old_sidebar_widget_ids = Array.prototype.slice.call( old_sidebar_widgets_setting() ); 874 new_sidebar_widget_ids = Array.prototype.slice.call( new_sidebar_widgets_setting() ); 875 876 i = control.getWidgetSidebarPosition(); 823 877 old_sidebar_widget_ids.splice( i, 1 ); 824 878 new_sidebar_widget_ids.push( control.params.widget_id ); … … 858 912 */ 859 913 _setupUpdateUI: function () { 860 var control = this; 861 862 var widget_content = control.container.find( '.widget-content' ); 914 var control = this, 915 widget_content, 916 save_btn, 917 trigger_save; 918 919 widget_content = control.container.find( '.widget-content' ); 863 920 864 921 // Configure update button 865 varsave_btn = control.container.find( '.widget-control-save' );922 save_btn = control.container.find( '.widget-control-save' ); 866 923 save_btn.val( self.i18n.save_btn_label ); 867 924 save_btn.attr( 'title', self.i18n.save_btn_tooltip ); … … 872 929 } ); 873 930 874 vartrigger_save = _.debounce( function () {931 trigger_save = _.debounce( function () { 875 932 // @todo For compatibility with other plugins, should we trigger a click event? What about form submit event? 876 933 control.updateWidget(); … … 913 970 */ 914 971 _setupRemoveUI: function () { 915 var control = this; 972 var control = this, 973 remove_btn, 974 replace_delete_with_remove; 916 975 917 976 // Configure remove button 918 varremove_btn = control.container.find( 'a.widget-control-remove' );977 remove_btn = control.container.find( 'a.widget-control-remove' ); 919 978 // @todo Hitting Enter on this link does nothing; will be resolved in core with <http://core.trac.wordpress.org/ticket/26633> 920 979 remove_btn.on( 'click', function ( e ) { … … 932 991 933 992 control.container.slideUp( function() { 934 var sidebars_widgets_control = self.getSidebarWidgetControlContainingWidget( control.params.widget_id ); 993 var sidebars_widgets_control = self.getSidebarWidgetControlContainingWidget( control.params.widget_id ), 994 sidebar_widget_ids, 995 i; 996 935 997 if ( ! sidebars_widgets_control ) { 936 998 throw new Error( 'Unable to find sidebars_widgets_control' ); 937 999 } 938 varsidebar_widget_ids = sidebars_widgets_control.setting().slice();939 vari = sidebar_widget_ids.indexOf( control.params.widget_id );1000 sidebar_widget_ids = sidebars_widgets_control.setting().slice(); 1001 i = sidebar_widget_ids.indexOf( control.params.widget_id ); 940 1002 if ( -1 === i ) { 941 1003 throw new Error( 'Widget is not in sidebar' ); … … 947 1009 } ); 948 1010 949 varreplace_delete_with_remove = function () {1011 replace_delete_with_remove = function () { 950 1012 remove_btn.text( self.i18n.remove_btn_label ); // wp_widget_control() outputs the link as "Delete" 951 1013 remove_btn.attr( 'title', self.i18n.remove_btn_tooltip ); … … 1008 1070 */ 1009 1071 getSidebarWidgetsControl: function () { 1010 var control = this; 1011 var setting_id = 'sidebars_widgets[' + control.params.sidebar_id + ']'; 1012 var sidebar_widgets_control = customize.control( setting_id ); 1072 var control = this, setting_id, sidebar_widgets_control; 1073 1074 setting_id = 'sidebars_widgets[' + control.params.sidebar_id + ']'; 1075 sidebar_widgets_control = customize.control( setting_id ); 1013 1076 if ( ! sidebar_widgets_control ) { 1014 1077 throw new Error( 'Unable to locate sidebar_widgets control for ' + control.params.sidebar_id ); … … 1027 1090 */ 1028 1091 updateWidget: function ( args ) { 1029 var control = this; 1092 var control = this, 1093 instance_override, 1094 complete_callback, 1095 update_number, 1096 widget_content, 1097 element_id_to_refocus = null, 1098 active_input_selection_start = null, 1099 active_input_selection_end = null, 1100 params = {}, 1101 data, 1102 inputs, 1103 jqxhr; 1104 1030 1105 args = $.extend( { 1031 1106 instance: null, … … 1033 1108 ignore_active_element: false 1034 1109 }, args ); 1035 var instance_override = args.instance; 1036 var complete_callback = args.complete; 1110 1111 instance_override = args.instance; 1112 complete_callback = args.complete; 1037 1113 1038 1114 control._update_count += 1; 1039 var update_number = control._update_count; 1040 1041 var widget_content = control.container.find( '.widget-content' ); 1042 1043 var element_id_to_refocus = null; 1044 var active_input_selection_start = null; 1045 var active_input_selection_end = null; 1115 update_number = control._update_count; 1116 1117 widget_content = control.container.find( '.widget-content' ); 1118 1046 1119 // @todo Support more selectors than IDs? 1047 1120 if ( $.contains( control.container[0], document.activeElement ) && $( document.activeElement ).is( '[id]' ) ) { … … 1058 1131 control.container.addClass( 'previewer-loading' ); 1059 1132 1060 varparams = {};1133 params = {}; 1061 1134 params.action = self.update_widget_ajax_action; 1062 1135 params[self.update_widget_nonce_post_key] = self.update_widget_nonce_value; 1063 1136 1064 vardata = $.param( params );1065 varinputs = widget_content.find( ':input, option' );1137 data = $.param( params ); 1138 inputs = widget_content.find( ':input, option' ); 1066 1139 1067 1140 // Store the value we're submitting in data so that when the response comes back, … … 1069 1142 // then we do not need to touch the UI and mess up the user's ongoing editing. 1070 1143 inputs.each( function () { 1071 var input = $( this ) ;1072 varproperty = control._getInputStatePropertyName( this );1144 var input = $( this ), 1145 property = control._getInputStatePropertyName( this ); 1073 1146 input.data( 'state' + update_number, input.prop( property ) ); 1074 1147 } ); … … 1081 1154 data += '&' + widget_content.find( '~ :input' ).serialize(); 1082 1155 1083 console.log( wp.ajax.settings.url, data ); 1084 var jqxhr = $.post( wp.ajax.settings.url, data, function ( r ) { 1156 window.console && window.console.log( wp.ajax.settings.url, data ); 1157 jqxhr = $.post( wp.ajax.settings.url, data, function ( r ) { 1158 var message, 1159 sanitized_form, 1160 sanitized_inputs, 1161 has_same_inputs_in_response, 1162 is_instance_identical; 1163 1085 1164 if ( r.success ) { 1086 var sanitized_form = $( '<div>' + r.data.form + '</div>' ); 1165 sanitized_form = $( '<div>' + r.data.form + '</div>' ); 1166 1087 1167 control.hook( 'formUpdate', sanitized_form ); 1088 1168 1089 varsanitized_inputs = sanitized_form.find( ':input, option' );1090 varhas_same_inputs_in_response = control._getInputsSignature( inputs ) === control._getInputsSignature( sanitized_inputs );1169 sanitized_inputs = sanitized_form.find( ':input, option' ); 1170 has_same_inputs_in_response = control._getInputsSignature( inputs ) === control._getInputsSignature( sanitized_inputs ); 1091 1171 1092 1172 if ( has_same_inputs_in_response ) { 1093 1173 inputs.each( function ( i ) { 1094 var input = $( this ); 1095 var sanitized_input = $( sanitized_inputs[i] ); 1096 var property = control._getInputStatePropertyName( this ); 1097 var state = input.data( 'state' + update_number ); 1098 var sanitized_state = sanitized_input.prop( property ); 1174 var input = $( this ), 1175 sanitized_input = $( sanitized_inputs[i] ), 1176 property = control._getInputStatePropertyName( this ), 1177 state, 1178 sanitized_state; 1179 1180 state = input.data( 'state' + update_number ); 1181 sanitized_state = sanitized_input.prop( property ); 1099 1182 input.data( 'sanitized', sanitized_state ); 1100 1183 … … 1133 1216 * preview finishing loading. 1134 1217 */ 1135 varis_instance_identical = _( control.setting() ).isEqual( r.data.instance );1218 is_instance_identical = _( control.setting() ).isEqual( r.data.instance ); 1136 1219 if ( is_instance_identical ) { 1137 1220 control.container.removeClass( 'previewer-loading' ); … … 1146 1229 } 1147 1230 } else { 1148 console.log( r );1149 varmessage = 'FAIL';1231 window.console && window.console.log( r ); 1232 message = 'FAIL'; 1150 1233 if ( r.data && r.data.message ) { 1151 1234 message = r.data.message; … … 1204 1287 */ 1205 1288 toggleForm: function ( do_expand ) { 1206 var control = this; 1207 var widget = control.container.find( 'div.widget:first' ); 1208 var inside = widget.find( '.widget-inside:first' ); 1289 var control = this, widget, inside, complete; 1290 1291 widget = control.container.find( 'div.widget:first' ); 1292 inside = widget.find( '.widget-inside:first' ); 1209 1293 if ( typeof do_expand === 'undefined' ) { 1210 1294 do_expand = ! inside.is( ':visible' ); … … 1216 1300 } 1217 1301 1218 varcomplete;1302 complete; 1219 1303 if ( do_expand ) { 1220 1304 // Close all other widget controls before expanding this one … … 1274 1358 */ 1275 1359 getWidgetSidebarPosition: function () { 1276 var control = this; 1277 var sidebar_widget_ids = control.getSidebarWidgetsControl().setting(); 1278 var position = sidebar_widget_ids.indexOf( control.params.widget_id ); 1360 var control = this, 1361 sidebar_widget_ids, 1362 position; 1363 1364 sidebar_widget_ids = control.getSidebarWidgetsControl().setting(); 1365 position = sidebar_widget_ids.indexOf( control.params.widget_id ); 1279 1366 if ( position === -1 ) { 1280 1367 throw new Error( 'Widget was unexpectedly not present in the sidebar.' ); … … 1303 1390 */ 1304 1391 _moveWidgetByOne: function ( offset ) { 1305 var control = this; 1306 var i = control.getWidgetSidebarPosition(); 1307 1308 var sidebar_widgets_setting = control.getSidebarWidgetsControl().setting; 1309 var sidebar_widget_ids = Array.prototype.slice.call( sidebar_widgets_setting() ); // clone 1310 var adjacent_widget_id = sidebar_widget_ids[i + offset]; 1392 var control = this, 1393 i, 1394 sidebar_widgets_setting, 1395 sidebar_widget_ids, 1396 adjacent_widget_id; 1397 1398 i = control.getWidgetSidebarPosition(); 1399 1400 sidebar_widgets_setting = control.getSidebarWidgetsControl().setting; 1401 sidebar_widget_ids = Array.prototype.slice.call( sidebar_widgets_setting() ); // clone 1402 adjacent_widget_id = sidebar_widget_ids[i + offset]; 1311 1403 sidebar_widget_ids[i + offset] = control.params.widget_id; 1312 1404 sidebar_widget_ids[i] = adjacent_widget_id; … … 1321 1413 */ 1322 1414 toggleWidgetMoveArea: function ( toggle ) { 1323 var control = this ;1324 varmove_widget_area = control.container.find( '.move-widget-area' );1415 var control = this, move_widget_area; 1416 move_widget_area = control.container.find( '.move-widget-area' ); 1325 1417 if ( typeof toggle === 'undefined' ) { 1326 1418 toggle = ! move_widget_area.hasClass( 'active' ); … … 1342 1434 */ 1343 1435 getPreviewWidgetElement: function () { 1344 var control = this ;1345 varwidget_customizer_preview = self.getPreviewWindow().WidgetCustomizerPreview;1436 var control = this, 1437 widget_customizer_preview = self.getPreviewWindow().WidgetCustomizerPreview; 1346 1438 return widget_customizer_preview.getSidebarWidgetElement( control.params.sidebar_id, control.params.widget_id ); 1347 1439 }, … … 1358 1450 */ 1359 1451 highlightSectionAndControl: function() { 1360 var control = this ;1361 var target_element; 1452 var control = this, target_element; 1453 1362 1454 if ( control.container.is( ':hidden' ) ) { 1363 1455 target_element = control.container.closest( '.control-section' ); … … 1377 1469 */ 1378 1470 highlightPreviewWidget: function () { 1379 var control = this; 1380 var widget_el = control.getPreviewWidgetElement(); 1381 var root_el = widget_el.closest( 'html' ); 1471 var control = this, widget_el, root_el; 1472 1473 widget_el = control.getPreviewWidgetElement(); 1474 root_el = widget_el.closest( 'html' ); 1382 1475 root_el.find( '.widget-customizer-highlighted-widget' ).removeClass( 'widget-customizer-highlighted-widget' ); 1383 1476 widget_el.addClass( 'widget-customizer-highlighted-widget' ); … … 1392 1485 * Capture the instance of the Previewer since it is private 1393 1486 */ 1394 varOldPreviewer = wp.customize.Previewer;1487 OldPreviewer = wp.customize.Previewer; 1395 1488 wp.customize.Previewer = OldPreviewer.extend( { 1396 1489 initialize: function( params, options ) { … … 1453 1546 */ 1454 1547 setup: function () { 1455 var panel = this; 1548 var panel = this, update_available_widgets_list; 1549 1456 1550 panel.container = $( '#available-widgets' ); 1457 1551 panel.filter_input = $( '#available-widgets-filter' ).find( 'input' ); 1458 1552 1459 varupdate_available_widgets_list = function () {1553 update_available_widgets_list = function () { 1460 1554 self.available_widgets.each( function ( widget ) { 1461 1555 var widget_tpl = $( '#widget-tpl-' + widget.id ); … … 1502 1596 filterChildSelector: '.widget-title h4', 1503 1597 after: function () { 1504 var filter_val = panel.filter_input.val(); 1598 var filter_val = panel.filter_input.val(), 1599 first_visible_widget; 1505 1600 1506 1601 // Remove a widget from being selected if it is no longer visible … … 1518 1613 // If a filter has been entered and a widget hasn't been selected, select the first one shown 1519 1614 if ( ! panel.selected_widget_tpl && filter_val ) { 1520 varfirst_visible_widget = panel.container.find( '> .widget-tpl:visible:first' );1615 first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' ); 1521 1616 if ( first_visible_widget.length ) { 1522 1617 panel.select( first_visible_widget ); … … 1534 1629 1535 1630 panel.container.on( 'keydown', function ( event ) { 1536 var is_enter = ( event.which === 13 ) ;1537 var is_esc = ( event.which === 27 );1538 var is_down = ( event.which === 40 );1539 var is_up = ( event.which === 38 );1540 var selected_widget_tpl = null;1541 var first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' );1542 var last_visible_widget = panel.container.find( '> .widget-tpl:visible:last' );1543 varis_input_focused = $( event.target ).is( panel.filter_input );1631 var is_enter = ( event.which === 13 ), 1632 is_esc = ( event.which === 27 ), 1633 is_down = ( event.which === 40 ), 1634 is_up = ( event.which === 38 ), 1635 selected_widget_tpl = null, 1636 first_visible_widget = panel.container.find( '> .widget-tpl:visible:first' ), 1637 last_visible_widget = panel.container.find( '> .widget-tpl:visible:last' ), 1638 is_input_focused = $( event.target ).is( panel.filter_input ); 1544 1639 1545 1640 if ( is_down || is_up ) { … … 1590 1685 1591 1686 submit: function ( widget_tpl ) { 1592 var panel = this ;1687 var panel = this, widget_id, widget; 1593 1688 if ( ! widget_tpl ) { 1594 1689 widget_tpl = panel.selected_widget_tpl; … … 1599 1694 panel.select( widget_tpl ); 1600 1695 1601 varwidget_id = $( panel.selected_widget_tpl ).data( 'widget-id' );1602 varwidget = self.available_widgets.findWhere( {id: widget_id} );1696 widget_id = $( panel.selected_widget_tpl ).data( 'widget-id' ); 1697 widget = self.available_widgets.findWhere( {id: widget_id} ); 1603 1698 if ( ! widget ) { 1604 1699 throw new Error( 'Widget unexpectedly not found.' ); … … 1648 1743 */ 1649 1744 function parse_widget_id( widget_id ) { 1650 var parsed = {1745 var matches, parsed = { 1651 1746 number: null, 1652 1747 id_base: null 1653 1748 }; 1654 varmatches = widget_id.match( /^(.+)-(\d+)$/ );1749 matches = widget_id.match( /^(.+)-(\d+)$/ ); 1655 1750 if ( matches ) { 1656 1751 parsed.id_base = matches[1]; … … 1668 1763 */ 1669 1764 function widget_id_to_setting_id( widget_id ) { 1670 var parsed = parse_widget_id( widget_id ); 1671 var setting_id = 'widget_' + parsed.id_base; 1765 var parsed = parse_widget_id( widget_id ), setting_id; 1766 1767 setting_id = 'widget_' + parsed.id_base; 1672 1768 if ( parsed.number ) { 1673 1769 setting_id += '[' + parsed.number + ']'; … … 1691 1787 (function($){ 1692 1788 $.fn.liveFilter = function(inputEl, filterEl, options){ 1693 var defaults = {1789 var el, filter, defaults = { 1694 1790 filterChildSelector: null, 1695 1791 filter: function(el, val){ … … 1701 1797 options = $.extend(defaults, options); 1702 1798 1703 varel = $(this).find(filterEl);1799 el = $(this).find(filterEl); 1704 1800 if (options.filterChildSelector) { 1705 1801 el = el.find(options.filterChildSelector); 1706 1802 } 1707 1803 1708 varfilter = options.filter;1804 filter = options.filter; 1709 1805 $(inputEl).keyup(function(){ 1710 var val = $(this).val(); 1711 var contains = el.filter(function(){ 1806 var val = $(this).val(), contains, containsNot; 1807 1808 contains = el.filter(function(){ 1712 1809 return filter(this, val); 1713 1810 }); 1714 varcontainsNot = el.not(contains);1811 containsNot = el.not(contains); 1715 1812 if (options.filterChildSelector){ 1716 1813 contains = contains.parents(filterEl); -
trunk/src/wp-includes/js/customize-preview-widgets.js
r27419 r27436 4 4 'use strict'; 5 5 6 var self = {6 var OldPreview, self = { 7 7 rendered_sidebars: {}, // @todo Make rendered a property of the Backbone model 8 8 rendered_widgets: {}, // @todo Make rendered a property of the Backbone model … … 32 32 $.each( self.registered_sidebars, function ( i, sidebar ) { 33 33 var widget_tpl = [ 34 sidebar.before_widget.replace('%1$s', '').replace('%2$s', ''), 35 sidebar.before_title, 36 sidebar.after_title, 37 sidebar.after_widget 38 ].join(''); 39 var empty_widget = $(widget_tpl); 40 var widget_selector = empty_widget.prop('tagName'); 41 var widget_classes = empty_widget.prop('className').replace(/^\s+|\s+$/g, ''); 34 sidebar.before_widget.replace('%1$s', '').replace('%2$s', ''), 35 sidebar.before_title, 36 sidebar.after_title, 37 sidebar.after_widget 38 ].join(''), 39 empty_widget, 40 widget_selector, 41 widget_classes; 42 43 empty_widget = $(widget_tpl); 44 widget_selector = empty_widget.prop('tagName'); 45 widget_classes = empty_widget.prop('className').replace(/^\s+|\s+$/g, ''); 46 42 47 if ( widget_classes ) { 43 48 widget_selector += '.' + widget_classes.split(/\s+/).join('.'); … … 99 104 * Capture the instance of the Preview since it is private 100 105 */ 101 varOldPreview = wp.customize.Preview;106 OldPreview = wp.customize.Preview; 102 107 wp.customize.Preview = OldPreview.extend( { 103 108 initialize: function( params, options ) {
Note: See TracChangeset
for help on using the changeset viewer.