1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
( function( $ ) {
var timeout = null;
// Make the list of items sortable.
function initWidget( widget ) {
widget.find( '.jetpack-social-icons-widget-list' ).sortable( {
items: '> .jetpack-social-icons-widget-item',
handle: '.handle',
cursor: 'move',
placeholder: 'jetpack-social-icons-widget-item ui-state-placeholder',
containment: widget,
forcePlaceholderSize: true,
update: function() {
livePreviewUpdate( $( this ).parents( '.form' ).find( '.widget-control-save' ) );
}
} );
}
// Live preview update.
function livePreviewUpdate( button ) {
if ( ! $( document.body ).hasClass( 'wp-customizer' ) || ! button.length ) {
return;
}
button.trigger( 'click' ).hide();
}
$( document ).ready( function() {
// Add an item.
$( document ).on( 'click', '.jetpack-social-icons-widget.add-button button', function( event ) {
event.preventDefault();
var template, widgetContent, widgetList, widgetLastItem, urlId, urlName;
template = $( $.trim( $( '#tmpl-jetpack-widget-social-icons-template' ).html() ) );
widgetContent = $( this ).parents( '.widget-content' );
widgetList = widgetContent.find( '.jetpack-social-icons-widget-list' );
urlId = widgetList.data( 'url-icon-id');
urlName = widgetList.data( 'url-icon-name' );
template.find( '.jetpack-widget-social-icons-url input' ).attr( 'id', urlId ).attr( 'name', urlName + '[]' );
widgetList.append( template );
widgetLastItem = widgetContent.find( '.jetpack-social-icons-widget-item:last' );
widgetLastItem.find( 'input:first' ).trigger( 'focus' );
} );
// Remove an item.
$( document ).on( 'click', '.jetpack-widget-social-icons-remove-item-button', function( event ) {
event.preventDefault();
var button = $( this ).parents( '.form' ).find( '.widget-control-save' );
$( this ).parents( '.jetpack-social-icons-widget-item' ).remove();
livePreviewUpdate( button );
} );
// Event handler for widget open button.
$( document ).on( 'click', 'div.widget[id*="jetpack_widget_social_icons"] .widget-title, div.widget[id*="jetpack_widget_social_icons"] .widget-action', function() {
if ( $( this ).parents( '#available-widgets' ).length ) {
return;
}
initWidget( $( this ).parents( '.widget[id*="jetpack_widget_social_icons"]' ) );
} );
// Event handler for widget added.
$( document ).on( 'widget-added', function( event, widget ) {
if ( widget.is( '[id*="jetpack_widget_social_icons"]' ) ) {
event.preventDefault();
initWidget( widget );
}
} );
// Event handler for widget updated.
$( document ).on( 'widget-updated', function( event, widget ) {
if ( widget.is( '[id*="jetpack_widget_social_icons"]' ) ) {
event.preventDefault();
initWidget( widget );
}
} );
// Live preview update on input focus out.
$( document ).on( 'focusout', 'input[name*="jetpack_widget_social_icons"]', function() {
livePreviewUpdate( $( this ).parents( '.form' ).find( '.widget-control-save' ) );
} );
// Live preview update on input enter key.
$( document ).on( 'keydown', 'input[name*="jetpack_widget_social_icons"]', function( event ) {
if ( event.keyCode === 13 ) {
livePreviewUpdate( $( this ).parents( '.form' ).find( '.widget-control-save' ) );
}
} );
// Live preview update on input key up 1s.
$( document ).on( 'keyup', 'input[name*="jetpack_widget_social_icons"]', function() {
clearTimeout( timeout );
timeout = setTimeout( function() {
livePreviewUpdate( $( this ).parents( '.form' ).find( '.widget-control-save' ) );
}, 1000 );
} );
// Live preview update on select change.
$( document ).on( 'change', 'select[name*="jetpack_widget_social_icons"]', function() {
livePreviewUpdate( $( this ).parents( '.form' ).find( '.widget-control-save' ) );
} );
} );
} )( jQuery );
|