Bez popisu

social-icons-admin.js 3.8KB

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