Pledge Management: Add "request link" form to the manage pledge (#126)

When a pledge is selected but the auth token is missing/incorrect, show the email form. Like on the pledge page, submitting the correct email will trigger a new auth token + link to be emailed to the pledge manager. This makes for a clearer path for re-requesting a valid link.

Fixes #114
This commit is contained in:
Kelly Dwan 2019-12-11 16:12:23 -05:00 committed by GitHub
parent a5d4228c6d
commit a91c2733d2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 129 additions and 76 deletions

View file

@ -1,14 +1,12 @@
/* global FFTF_Dialog, jQuery */
jQuery( document ).ready( function( $ ) {
const button = document.getElementById( 'toggle-management-link-form' );
const template = wp.template( '5ftf-send-link-dialog' );
const template = document.getElementById( 'tmpl-5ftf-send-link-dialog' ) && wp.template( '5ftf-send-link-dialog' );
if ( ! template && ! button ) {
// No modal on this page.
return;
if ( !! template ) {
$( document.body ).prepend( template() );
}
$( document.body ).prepend( template() );
const modal = document.getElementById( 'send-link-dialog' );
const modalBg = document.getElementById( 'send-link-dialog-bg' );
const children = document.querySelectorAll( 'body > *:not([role="dialog"])' );
@ -81,14 +79,15 @@ jQuery( document ).ready( function( $ ) {
function sendRequest( event ) {
event.preventDefault();
const email = $( event.target.querySelector( 'input[type="email"]' ) ).val();
const pledgeId = $( event.target.querySelector( 'input[name="pledge_id"]' ) ).val();
$( event.target.querySelector( '.message' ) ).html( '' );
$.ajax( {
type: 'POST',
url: FFTF_Dialog.ajaxurl,
data: {
action: 'send-manage-email',
pledge_id: FFTF_Dialog.pledgeId,
email,
pledge_id: pledgeId,
email: email,
_ajax_nonce: FFTF_Dialog.ajaxNonce,
},
success( response ) {
@ -96,10 +95,11 @@ jQuery( document ).ready( function( $ ) {
// Say the message for screen reader users.
wp.a11y.speak( response.message );
if ( response.success ) {
if ( response.success && !! button ) {
closeModal();
$( button ).after( $( '<p>' ).html( '<em>' + response.message + '<em>' ) );
} else {
$( 'div.notice' ).remove();
const $message = $( '<div>' )
.addClass( 'notice notice-alt' )
.addClass( response.success ? 'notice-success' : 'notice-error' )
@ -124,13 +124,16 @@ jQuery( document ).ready( function( $ ) {
}
} );
$( modalBg ).on( 'click', closeModal );
$( modal ).on( 'click', '.pledge-dialog__close', closeModal );
$( document ).on( 'keydown', function( event ) {
if ( 27 === event.which ) { // Esc
closeModal( event );
}
} );
// Make sure `modal` exists before using it.
if ( !! modal ) {
$( modalBg ).on( 'click', closeModal );
$( modal ).on( 'click', '.pledge-dialog__close', closeModal );
$( document ).on( 'keydown', function( event ) {
if ( 27 === event.which ) { // Esc
closeModal( event );
}
} );
$( modal.querySelector( 'form' ) ).submit( sendRequest );
$( modal.querySelector( 'form' ) ).submit( sendRequest );
}
} );