Remove shortcode, add button & dialog by hooking into actions

This commit is contained in:
Kelly Dwan 2019-11-20 16:58:18 -05:00
parent a67ef04505
commit 04d1a12296
No known key found for this signature in database
GPG key ID: 8BA5575F3D11575D
6 changed files with 88 additions and 94 deletions

View file

@ -0,0 +1,13 @@
<?php
namespace WordPressDotOrg\FiveForTheFuture\View;
defined( 'WPINC' ) || die();
?>
<div class="edit-pledge-wrapper">
<button id="toggle-management-link-form" class="button button-link">
<span class="dashicons dashicons-edit" aria-hidden="true"></span>
<?php esc_html_e( 'Edit Pledge', 'wporg-5ftf' ); ?>
</button>
</div>

View file

@ -1,75 +0,0 @@
<?php
namespace WordPressDotOrg\FiveForTheFuture\View;
defined( 'WPINC' ) || die();
/**
* @var array $errors
*/
// Hide it if it hasn't submitted, but show success/error messages if it was submitted.
// phpcs:ignore
$hidden = empty( $errors ) && empty( $_POST['get_manage_pledge_link'] ) ? 'hidden' : '';
?>
<button id="toggle-management-link-form">
<span class="dashicons dashicons-edit"></span>
<?php esc_html_e( 'Edit Pledge', 'wporg-5ftf' ); ?>
</button>
<div id="request-management-link" <?php echo esc_attr( $hidden ); ?> >
<p>
<?php esc_html_e( 'Only pledge admins can edit pledges.', 'wporg-5ftf' ); ?>
</p>
<p>
<?php esc_html_e( "If you're the admin, enter your email address and a confirmation link will be sent to you.", 'wporg-5ftf' ); ?>
</p>
<form action="#form-messages" method="post">
<input type="hidden" name="pledge_id" value="<?php echo esc_attr( get_post()->ID ); ?>" />
<label for="pledge_admin_address">
<?php esc_html_e( 'Email Address', 'wporg-5ftf' ); ?>
</label>
<input
id="pledge_admin_address"
name="pledge_admin_address"
type="email"
required
value=""
/>
<input
type="submit"
name="get_manage_pledge_link"
value="Submit"
/>
<?php require __DIR__ . '/partial-result-messages.php'; ?>
</form>
</div>
<script>
( function() {
var toggleLinkFormButton = document.getElementById( 'toggle-management-link-form' ),
linkForm = document.getElementById( 'request-management-link' );
// Toggle the form when the button is clicked.
toggleLinkFormButton.addEventListener( 'click', function() {
switch( linkForm.hidden ) {
case true:
linkForm.hidden = false;
linkForm.scrollIntoView( { behavior: 'smooth' } );
break;
default:
linkForm.hidden = true;
break;
}
} );
}() );
</script>

View file

@ -0,0 +1,41 @@
<?php
namespace WordPressDotOrg\FiveForTheFuture\View;
defined( 'WPINC' ) || die();
?>
<script type="text/template" id="tmpl-5ftf-send-link-dialog">
<div id="send-link-dialog" role="dialog" class="pledge-dialog" hidden tabindex="-1" aria-label="<?php esc_attr_e( 'Request to edit this pledge', 'wporg-5ftf' ); ?>">
<p>
<?php esc_html_e( 'Only pledge admins can edit pledges.', 'wporg-5ftf' ); ?>
</p>
<p>
<?php esc_html_e( "If you're the admin, enter your email address and a confirmation link will be sent to you.", 'wporg-5ftf' ); ?>
</p>
<form method="post">
<input type="hidden" name="pledge_id" value="<?php echo esc_attr( get_post()->ID ); ?>" />
<label for="pledge_admin_address">
<?php esc_html_e( 'Email Address', 'wporg-5ftf' ); ?>
</label>
<input
id="pledge_admin_address"
name="pledge_admin_address"
type="email"
required
value=""
/>
<input
type="submit"
name="get_manage_pledge_link"
value="<?php esc_attr_e( 'Submit', 'wporg-5ftf' ); ?>"
/>
</form>
<button type="button" class="button button-link pledge-dialog__close" aria-label="Close"><span class="dashicons dashicons-no-alt" aria-hidden="true"></span></button></div>
</div>
</script>