Ei kuvausta

country-select.js 6.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. /*global wc_country_select_params */
  2. jQuery( function( $ ) {
  3. // wc_country_select_params is required to continue, ensure the object exists
  4. if ( typeof wc_country_select_params === 'undefined' ) {
  5. return false;
  6. }
  7. // Select2 Enhancement if it exists
  8. if ( $().selectWoo ) {
  9. var getEnhancedSelectFormatString = function() {
  10. return {
  11. 'language': {
  12. errorLoading: function() {
  13. // Workaround for https://github.com/select2/select2/issues/4355 instead of i18n_ajax_error.
  14. return wc_country_select_params.i18n_searching;
  15. },
  16. inputTooLong: function( args ) {
  17. var overChars = args.input.length - args.maximum;
  18. if ( 1 === overChars ) {
  19. return wc_country_select_params.i18n_input_too_long_1;
  20. }
  21. return wc_country_select_params.i18n_input_too_long_n.replace( '%qty%', overChars );
  22. },
  23. inputTooShort: function( args ) {
  24. var remainingChars = args.minimum - args.input.length;
  25. if ( 1 === remainingChars ) {
  26. return wc_country_select_params.i18n_input_too_short_1;
  27. }
  28. return wc_country_select_params.i18n_input_too_short_n.replace( '%qty%', remainingChars );
  29. },
  30. loadingMore: function() {
  31. return wc_country_select_params.i18n_load_more;
  32. },
  33. maximumSelected: function( args ) {
  34. if ( args.maximum === 1 ) {
  35. return wc_country_select_params.i18n_selection_too_long_1;
  36. }
  37. return wc_country_select_params.i18n_selection_too_long_n.replace( '%qty%', args.maximum );
  38. },
  39. noResults: function() {
  40. return wc_country_select_params.i18n_no_matches;
  41. },
  42. searching: function() {
  43. return wc_country_select_params.i18n_searching;
  44. }
  45. }
  46. };
  47. };
  48. var wc_country_select_select2 = function() {
  49. $( 'select.country_select:visible, select.state_select:visible' ).each( function() {
  50. var $this = $( this );
  51. var select2_args = $.extend({
  52. placeholder: $this.attr( 'data-placeholder' ) || $this.attr( 'placeholder' ) || '',
  53. label: $this.attr( 'data-label' ) || null,
  54. width: '100%'
  55. }, getEnhancedSelectFormatString() );
  56. $( this )
  57. .on( 'select2:select', function() {
  58. $( this ).trigger( 'focus' ); // Maintain focus after select https://github.com/select2/select2/issues/4384
  59. } )
  60. .selectWoo( select2_args );
  61. });
  62. };
  63. wc_country_select_select2();
  64. $( document.body ).on( 'country_to_state_changed', function() {
  65. wc_country_select_select2();
  66. });
  67. }
  68. /* State/Country select boxes */
  69. var states_json = wc_country_select_params.countries.replace( /"/g, '"' ),
  70. states = JSON.parse( states_json ),
  71. wrapper_selectors = '.woocommerce-billing-fields,' +
  72. '.woocommerce-shipping-fields,' +
  73. '.woocommerce-address-fields,' +
  74. '.woocommerce-shipping-calculator';
  75. $( document.body ).on( 'change refresh', 'select.country_to_state, input.country_to_state', function() {
  76. // Grab wrapping element to target only stateboxes in same 'group'
  77. var $wrapper = $( this ).closest( wrapper_selectors );
  78. if ( ! $wrapper.length ) {
  79. $wrapper = $( this ).closest('.form-row').parent();
  80. }
  81. var country = $( this ).val(),
  82. $statebox = $wrapper.find( '#billing_state, #shipping_state, #calc_shipping_state' ),
  83. $parent = $statebox.closest( '.form-row' ),
  84. input_name = $statebox.attr( 'name' ),
  85. input_id = $statebox.attr('id'),
  86. input_classes = $statebox.attr('data-input-classes'),
  87. value = $statebox.val(),
  88. placeholder = $statebox.attr( 'placeholder' ) || $statebox.attr( 'data-placeholder' ) || '',
  89. $newstate;
  90. if ( states[ country ] ) {
  91. if ( $.isEmptyObject( states[ country ] ) ) {
  92. $newstate = $( '<input type="hidden" />' )
  93. .prop( 'id', input_id )
  94. .prop( 'name', input_name )
  95. .prop( 'placeholder', placeholder )
  96. .attr( 'data-input-classes', input_classes )
  97. .addClass( 'hidden ' + input_classes );
  98. $parent.hide().find( '.select2-container' ).remove();
  99. $statebox.replaceWith( $newstate );
  100. $( document.body ).trigger( 'country_to_state_changed', [ country, $wrapper ] );
  101. } else {
  102. var state = states[ country ],
  103. $defaultOption = $( '<option value=""></option>' ).text( wc_country_select_params.i18n_select_state_text );
  104. if ( ! placeholder ) {
  105. placeholder = wc_country_select_params.i18n_select_state_text;
  106. }
  107. $parent.show();
  108. if ( $statebox.is( 'input' ) ) {
  109. $newstate = $( '<select></select>' )
  110. .prop( 'id', input_id )
  111. .prop( 'name', input_name )
  112. .data( 'placeholder', placeholder )
  113. .attr( 'data-input-classes', input_classes )
  114. .addClass( 'state_select ' + input_classes );
  115. $statebox.replaceWith( $newstate );
  116. $statebox = $wrapper.find( '#billing_state, #shipping_state, #calc_shipping_state' );
  117. }
  118. $statebox.empty().append( $defaultOption );
  119. $.each( state, function( index ) {
  120. var $option = $( '<option></option>' )
  121. .prop( 'value', index )
  122. .text( state[ index ] );
  123. $statebox.append( $option );
  124. } );
  125. $statebox.val( value ).trigger( 'change' );
  126. $( document.body ).trigger( 'country_to_state_changed', [country, $wrapper ] );
  127. }
  128. } else {
  129. if ( $statebox.is( 'select, input[type="hidden"]' ) ) {
  130. $newstate = $( '<input type="text" />' )
  131. .prop( 'id', input_id )
  132. .prop( 'name', input_name )
  133. .prop('placeholder', placeholder)
  134. .attr('data-input-classes', input_classes )
  135. .addClass( 'input-text ' + input_classes );
  136. $parent.show().find( '.select2-container' ).remove();
  137. $statebox.replaceWith( $newstate );
  138. $( document.body ).trigger( 'country_to_state_changed', [country, $wrapper ] );
  139. }
  140. }
  141. $( document.body ).trigger( 'country_to_state_changing', [country, $wrapper ] );
  142. });
  143. $( document.body ).on( 'wc_address_i18n_ready', function() {
  144. // Init country selects with their default value once the page loads.
  145. $( wrapper_selectors ).each( function() {
  146. var $country_input = $( this ).find( '#billing_country, #shipping_country, #calc_shipping_country' );
  147. if ( 0 === $country_input.length || 0 === $country_input.val().length ) {
  148. return;
  149. }
  150. $country_input.trigger( 'refresh' );
  151. });
  152. });
  153. });