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