wc-setup.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. /*global wc_setup_params */
  2. /*global wc_setup_currencies */
  3. /*global wc_base_state */
  4. jQuery( function( $ ) {
  5. function blockWizardUI() {
  6. $('.wc-setup-content').block({
  7. message: null,
  8. overlayCSS: {
  9. background: '#fff',
  10. opacity: 0.6
  11. }
  12. });
  13. }
  14. $( '.button-next' ).on( 'click', function() {
  15. var form = $( this ).parents( 'form' ).get( 0 );
  16. if ( ( 'function' !== typeof form.checkValidity ) || form.checkValidity() ) {
  17. blockWizardUI();
  18. }
  19. return true;
  20. } );
  21. $( '#store_country' ).on( 'change', function() {
  22. // Prevent if we don't have the metabox data
  23. if ( wc_setup_params.states === null ){
  24. return;
  25. }
  26. var $this = $( this ),
  27. country = $this.val(),
  28. $state_select = $( '#store_state' );
  29. if ( ! $.isEmptyObject( wc_setup_params.states[ country ] ) ) {
  30. var states = wc_setup_params.states[ country ];
  31. $state_select.empty();
  32. $.each( states, function( index ) {
  33. $state_select.append( $( '<option value="' + index + '">' + states[ index ] + '</option>' ) );
  34. } );
  35. $( '.store-state-container' ).show();
  36. $state_select.selectWoo().val( wc_base_state ).change().prop( 'required', true );
  37. } else {
  38. $( '.store-state-container' ).hide();
  39. $state_select.empty().val( '' ).change().prop( 'required', false );
  40. }
  41. $( '#currency_code' ).val( wc_setup_currencies[ country ] ).change();
  42. } );
  43. $( '#store_country' ).change();
  44. $( '.wc-wizard-services' ).on( 'change', '.wc-wizard-service-enable input', function() {
  45. if ( $( this ).is( ':checked' ) ) {
  46. $( this ).closest( '.wc-wizard-service-toggle' ).removeClass( 'disabled' );
  47. $( this ).closest( '.wc-wizard-service-item' ).addClass( 'checked' );
  48. $( this ).closest( '.wc-wizard-service-item' )
  49. .find( '.wc-wizard-service-settings' ).removeClass( 'hide' );
  50. } else {
  51. $( this ).closest( '.wc-wizard-service-toggle' ).addClass( 'disabled' );
  52. $( this ).closest( '.wc-wizard-service-item' ).removeClass( 'checked' );
  53. $( this ).closest( '.wc-wizard-service-item' )
  54. .find( '.wc-wizard-service-settings' ).addClass( 'hide' );
  55. }
  56. } );
  57. $( '.wc-wizard-services' ).on( 'click', '.wc-wizard-service-enable', function( e ) {
  58. var eventTarget = $( e.target );
  59. if ( eventTarget.is( 'input' ) ) {
  60. e.stopPropagation();
  61. return;
  62. }
  63. var $checkbox = $( this ).find( 'input[type="checkbox"]' );
  64. $checkbox.prop( 'checked', ! $checkbox.prop( 'checked' ) ).change();
  65. } );
  66. $( '.wc-wizard-services-list-toggle' ).on( 'click', function() {
  67. $( this ).closest( '.wc-wizard-services-list-toggle' ).toggleClass( 'closed' );
  68. $( this ).closest( '.wc-wizard-services' ).find( '.wc-wizard-service-item' )
  69. .slideToggle()
  70. .css( 'display', 'flex' );
  71. } );
  72. $( '.wc-wizard-services' ).on( 'change', '.wc-wizard-shipping-method-select .method', function( e ) {
  73. var zone = $( this ).closest( '.wc-wizard-service-description' );
  74. var selectedMethod = e.target.value;
  75. var description = zone.find( '.shipping-method-descriptions' );
  76. description.find( '.shipping-method-description' ).addClass( 'hide' );
  77. description.find( '.' + selectedMethod ).removeClass( 'hide' );
  78. var settings = zone.find( '.shipping-method-settings' );
  79. settings
  80. .find( '.shipping-method-setting' )
  81. .addClass( 'hide' )
  82. .find( '.shipping-method-required-field' )
  83. .prop( 'required', false );
  84. settings
  85. .find( '.' + selectedMethod )
  86. .removeClass( 'hide' )
  87. .find( '.shipping-method-required-field' )
  88. .prop( 'required', true );
  89. } ).find( '.wc-wizard-shipping-method-select .method' ).change();
  90. $( '.wc-wizard-services' ).on( 'change', '.wc-wizard-shipping-method-enable', function() {
  91. var checked = $( this ).is( ':checked' );
  92. var selectedMethod = $( '.wc-wizard-shipping-method-select .method' ).val();
  93. $( this )
  94. .closest( '.wc-wizard-service-item' )
  95. .find( '.' + selectedMethod )
  96. .find( '.shipping-method-required-field' )
  97. .prop( 'required', checked );
  98. } );
  99. function submitActivateForm() {
  100. $( 'form.activate-jetpack' ).submit();
  101. }
  102. function waitForJetpackInstall() {
  103. wp.ajax.post( 'setup_wizard_check_jetpack' )
  104. .then( function( result ) {
  105. // If we receive success, or an unexpected result
  106. // let the form submit.
  107. if (
  108. ! result ||
  109. ! result.is_active ||
  110. 'yes' === result.is_active
  111. ) {
  112. return submitActivateForm();
  113. }
  114. // Wait until checking the status again
  115. setTimeout( waitForJetpackInstall, 3000 );
  116. } )
  117. .fail( function() {
  118. // Submit the form as normal if the request fails
  119. submitActivateForm();
  120. } );
  121. }
  122. // Wait for a pending Jetpack install to finish before triggering a "save"
  123. // on the activate step, which launches the Jetpack connection flow.
  124. $( '.activate-jetpack' ).on( 'click', '.button-primary', function( e ) {
  125. blockWizardUI();
  126. if ( 'no' === wc_setup_params.pending_jetpack_install ) {
  127. return true;
  128. }
  129. e.preventDefault();
  130. waitForJetpackInstall();
  131. } );
  132. $( '.wc-wizard-services' ).on( 'change', 'input#stripe_create_account, input#ppec_paypal_reroute_requests', function() {
  133. if ( $( this ).is( ':checked' ) ) {
  134. $( this ).closest( '.wc-wizard-service-settings' )
  135. .find( 'input.payment-email-input' )
  136. .prop( 'required', true );
  137. $( this ).closest( '.wc-wizard-service-settings' )
  138. .find( '.wc-wizard-service-setting-stripe_email, .wc-wizard-service-setting-ppec_paypal_email' )
  139. .show();
  140. } else {
  141. $( this ).closest( '.wc-wizard-service-settings' )
  142. .find( 'input.payment-email-input' )
  143. .prop( 'required', false );
  144. $( this ).closest( '.wc-wizard-service-settings' )
  145. .find( '.wc-wizard-service-setting-stripe_email, .wc-wizard-service-setting-ppec_paypal_email' )
  146. .hide();
  147. }
  148. } ).find( 'input#stripe_create_account, input#ppec_paypal_reroute_requests' ).change();
  149. function addPlugins( bySlug, $el, hover ) {
  150. var plugins = $el.data( 'plugins' );
  151. for ( var i in Array.isArray( plugins ) ? plugins : [] ) {
  152. var slug = plugins[ i ].slug;
  153. bySlug[ slug ] = bySlug[ slug ] ||
  154. $( '<span class="plugin-install-info-list-item">' )
  155. .append( '<a href="https://wordpress.org/plugins/' + slug + '/" target="_blank">' + plugins[ i ].name + '</a>' );
  156. bySlug[ slug ].find( 'a' )
  157. .on( 'mouseenter mouseleave', ( function( $hover, event ) {
  158. $hover.toggleClass( 'plugin-install-source', 'mouseenter' === event.type );
  159. } ).bind( null, hover ? $el.closest( hover ) : $el ) );
  160. }
  161. }
  162. function updatePluginInfo() {
  163. var pluginLinkBySlug = {};
  164. $( '.wc-wizard-service-enable input:checked' ).each( function() {
  165. addPlugins( pluginLinkBySlug, $( this ), '.wc-wizard-service-item' );
  166. var $container = $( this ).closest( '.wc-wizard-service-item' );
  167. $container.find( 'input.payment-checkbox-input:checked' ).each( function() {
  168. addPlugins( pluginLinkBySlug, $( this ), '.wc-wizard-service-settings' );
  169. } );
  170. $container.find( '.wc-wizard-shipping-method-select .method' ).each( function() {
  171. var $this = $( this );
  172. if ( 'live_rates' === $this.val() ) {
  173. addPlugins( pluginLinkBySlug, $this, '.wc-wizard-service-item' );
  174. }
  175. } );
  176. } );
  177. $( '.recommended-item input:checked' ).each( function() {
  178. addPlugins( pluginLinkBySlug, $( this ), '.recommended-item' );
  179. } );
  180. var $list = $( 'span.plugin-install-info-list' ).empty();
  181. for ( var slug in pluginLinkBySlug ) {
  182. $list.append( pluginLinkBySlug[ slug ] );
  183. }
  184. $( 'span.plugin-install-info' ).toggle( $list.children().length > 0 );
  185. }
  186. updatePluginInfo();
  187. $( '.wc-setup-content' ).on( 'change', '[data-plugins]', updatePluginInfo );
  188. } );