Commit d2b7d1df authored by KR Moorhouse's avatar KR Moorhouse

Updated styling for the opt-in modal to match the new standards set by the Services tab.

parent 053c51c5
This diff is collapsed.
This diff is collapsed.
...@@ -173,7 +173,7 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect ...@@ -173,7 +173,7 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect
cancel.classList.add( 'nf-button', 'secondary' ); cancel.classList.add( 'nf-button', 'secondary' );
cancel.innerHTML = nfi18n.optinSecondary; cancel.innerHTML = nfi18n.optinSecondary;
actions.appendChild( cancel ); actions.appendChild( cancel );
var confirm = document.createElement( 'button' ); var confirm = document.createElement( 'div' );
confirm.id = 'optin'; confirm.id = 'optin';
confirm.classList.add( 'nf-button', 'primary', 'pull-right' ); confirm.classList.add( 'nf-button', 'primary', 'pull-right' );
confirm.innerHTML = nfi18n.optinPrimary; confirm.innerHTML = nfi18n.optinPrimary;
...@@ -211,22 +211,23 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect ...@@ -211,22 +211,23 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect
sendEmail = 0; sendEmail = 0;
userEmail = ''; userEmail = '';
} }
// Disable our buttons.
// Show spinner jQuery( '#optin' ).unbind( 'click' );
jQuery( '#optin-spinner' ).css( 'visibility', 'visible' ); jQuery( '#optout' ).unbind( 'click' );
jQuery( '#optin-spinner' ).css( 'display', 'inline-block' ); // Get a reference to the current width (to avoid resizing the button).
jQuery( '#optin-buttons' ).css( 'visibility', 'hidden' ); var width = jQuery( '#optin' ).width();
// Show spinner.
jQuery( '#optin' ).html( '<span class="dashicons dashicons-update dashicons-update-spin"></span>' );
jQuery( '#optin' ).width( width );
// Hit AJAX endpoint and opt-in. // Hit AJAX endpoint and opt-in.
jQuery.post( ajaxurl, { action: 'nf_optin', ninja_forms_opt_in: 1, send_email: sendEmail, user_email: userEmail }, jQuery.post( ajaxurl, { action: 'nf_optin', ninja_forms_opt_in: 1, send_email: sendEmail, user_email: userEmail },
function( response ) { function( response ) {
jQuery( '#optin-spinner' ).css( 'visibility', 'hidden' );
jQuery( '#optin-spinner' ).css( 'display', 'none' );
optinModal.setTitle( document.createElement( 'div' ).appendChild( successTitle ).innerHTML );
optinModal.setContent( document.createElement( 'div' ).appendChild( successContent ).innerHTML );
/** /**
* When we get a response from our endpoint, show a thank you and set a timeout * When we get a response from our endpoint, show a thank you and set a timeout
* to close the modal. * to close the modal.
*/ */
optinModal.setTitle( document.createElement( 'div' ).appendChild( successTitle ).innerHTML );
optinModal.setContent( document.createElement( 'div' ).appendChild( successContent ).innerHTML );
setTimeout ( setTimeout (
function(){ function(){
optinModal.close(); optinModal.close();
...@@ -237,12 +238,16 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect ...@@ -237,12 +238,16 @@ define( [ 'views/sections/widgets.js', 'views/sections/services.js', 'views/sect
} ); } );
// Setup the optout click event. // Setup the optout click event.
jQuery( '#optout' ).click( function( e ) { jQuery( '#optout' ).click( function( e ) {
// Show spinner // Disable our buttons.
jQuery( '#optin-spinner' ).css( 'visibility', 'visible' ); jQuery( '#optin' ).unbind( 'click' );
jQuery( '#optin-buttons' ).css( 'visibility', 'hidden' ); jQuery( '#optout' ).unbind( 'click' );
// Get a reference to the current width (to avoid resizing the button).
var width = jQuery( '#optout' ).width();
// Show spinner.
jQuery( '#optout' ).html( '<span class="dashicons dashicons-update dashicons-update-spin"></span>' );
jQuery( '#optout' ).width( width );
// Hit AJAX endpoint and opt-in. // Hit AJAX endpoint and opt-in.
jQuery.post( ajaxurl, { action: 'nf_optin', ninja_forms_opt_in: 0 }, function( response ) { jQuery.post( ajaxurl, { action: 'nf_optin', ninja_forms_opt_in: 0 }, function( response ) {
jQuery( '#optin-spinner' ).css( 'visibility', 'hidden' );
// When we get a response from our endpoint, close the modal. // When we get a response from our endpoint, close the modal.
optinModal.close(); optinModal.close();
} ); } );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment