Skip to content

Commit

Permalink
Merge pull request #583 from equalizedigital/william/558/email-optin-…
Browse files Browse the repository at this point in the history 
…modal

Show email opt-in as modal for users first visit to welcome page
  • Loading branch information
@pattonwebz
pattonwebz authored Apr 18, 2024
2 parents 0a439dd + 3d9eeda commit c98df52
Show file tree
Hide file tree
Showing 11 changed files with 543 additions and 254 deletions.
77 changes: 33 additions & 44 deletions admin/class-ajax.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@

namespace EDAC\Admin;

use EDAC\Admin\OptIn\Email_Opt_In;
use EDAC\Inc\Summary_Generator;

/**
Expand All @@ -33,7 +34,7 @@ public function init_hooks() {
add_action( 'wp_ajax_edac_update_simplified_summary', array( $this, 'simplified_summary' ) );
add_action( 'wp_ajax_edac_dismiss_welcome_cta_ajax', array( $this, 'dismiss_welcome_cta' ) );
add_action( 'wp_ajax_edac_dismiss_dashboard_cta_ajax', array( $this, 'dismiss_dashboard_cta' ) );
add_action( 'wp_ajax_edac_email_opt_in_ajax', array( $this, 'email_opt_in' ) );
( new Email_Opt_In() )->register_ajax_handlers();
}

/**
Expand Down Expand Up @@ -313,25 +314,25 @@ function ( $a, $b ) {

$html .= '<div class="edac-details-rule">';

$html .= '<div class="edac-details-rule-title">';
$html .= '<div class="edac-details-rule-title">';

$html .= '<h3>';
$html .= '<span class="edac-details-rule-count' . $count_classes . '">' . $rule['count'] . '</span> ';
$html .= esc_html( $rule['title'] );
$html .= '<h3>';
$html .= '<span class="edac-details-rule-count' . $count_classes . '">' . $rule['count'] . '</span> ';
$html .= esc_html( $rule['title'] );
if ( $count_ignored > 0 ) {
$html .= '<span class="edac-details-rule-count-ignore">' . $count_ignored . ' Ignored Items</span>';
}
$html .= '</h3>';
$html .= '<a href="' . $tool_tip_link . '" class="edac-details-rule-information" target="_blank" aria-label="Read documentation for ' . esc_html( $rule['title'] ) . '"><span class="dashicons dashicons-info"></span></a>';
$html .= ( $expand_rule ) ? '<button class="edac-details-rule-title-arrow" aria-expanded="false" aria-controls="edac-details-rule-records-' . $rule['slug'] . '" aria-label="Expand issues for ' . esc_html( $rule['title'] ) . '"><i class="dashicons dashicons-arrow-down-alt2"></i></button>' : '';
$html .= '</h3>';
$html .= '<a href="' . $tool_tip_link . '" class="edac-details-rule-information" target="_blank" aria-label="Read documentation for ' . esc_html( $rule['title'] ) . '"><span class="dashicons dashicons-info"></span></a>';
$html .= ( $expand_rule ) ? '<button class="edac-details-rule-title-arrow" aria-expanded="false" aria-controls="edac-details-rule-records-' . $rule['slug'] . '" aria-label="Expand issues for ' . esc_html( $rule['title'] ) . '"><i class="dashicons dashicons-arrow-down-alt2"></i></button>' : '';

$html .= '</div>';
$html .= '</div>';

if ( $results ) {

$html .= '<div id="edac-details-rule-records-' . $rule['slug'] . '" class="edac-details-rule-records">';

$html .=
$html .=
'<div class="edac-details-rule-records-labels">
<div class="edac-details-rule-records-labels-label" aria-hidden="true">
Affected Code
Expand Down Expand Up @@ -387,25 +388,25 @@ function ( $a, $b ) {

$html .= '<div id="edac-details-rule-records-record-' . $id . '" class="edac-details-rule-records-record">';

$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-object">';
$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-object">';

$html .= '<code>' . esc_html( $row['object'] ) . '</code>';
$html .= '<code>' . esc_html( $row['object'] ) . '</code>';

$html .= '</div>';
$html .= '</div>';

$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-image">';
$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-image">';

if ( $object_img ) {
$html .= '<img src="' . $object_img . '" alt="image for issue ' . $id . '" />';
} elseif ( $object_svg ) {
$html .= $object_svg;
}

$html .= '</div>';
$html .= '</div>';

$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-actions">';
$html .= '<div class="edac-details-rule-records-record-cell edac-details-rule-records-record-actions">';

$html .= '<button class="edac-details-rule-records-record-actions-ignore' . $ignore_class . '" aria-expanded="false" aria-controls="edac-details-rule-records-record-ignore-' . $row['id'] . '">' . EDAC_SVG_IGNORE_ICON . '<span class="edac-details-rule-records-record-actions-ignore-label">' . $ignore_label . '</span></button>';
$html .= '<button class="edac-details-rule-records-record-actions-ignore' . $ignore_class . '" aria-expanded="false" aria-controls="edac-details-rule-records-record-ignore-' . $row['id'] . '">' . EDAC_SVG_IGNORE_ICON . '<span class="edac-details-rule-records-record-actions-ignore-label">' . $ignore_label . '</span></button>';

if ( 'missing_headings' !== $rule['slug'] ) {

Expand All @@ -420,28 +421,28 @@ function ( $a, $b ) {
$html .= '<a href="' . $url . '" class="edac-details-rule-records-record-actions-highlight-front" target="_blank" aria-label="' . __( 'View, opens a new window', 'accessibility-checker' ) . '" ><span class="dashicons dashicons-welcome-view-site"></span>View on page</a>';
}

$html .= '</div>';
$html .= '</div>';

$html .= '<div id="edac-details-rule-records-record-ignore-' . $row['id'] . '" class="edac-details-rule-records-record-ignore">';
$html .= '<div id="edac-details-rule-records-record-ignore-' . $row['id'] . '" class="edac-details-rule-records-record-ignore">';

$html .= '<div class="edac-details-rule-records-record-ignore-info">';
$html .= '<span class="edac-details-rule-records-record-ignore-info-user">' . $ignore_username . '</span>';
$html .= '<div class="edac-details-rule-records-record-ignore-info">';
$html .= '<span class="edac-details-rule-records-record-ignore-info-user">' . $ignore_username . '</span>';

$html .= ' <span class="edac-details-rule-records-record-ignore-info-date">' . $ignore_date . '</span>';
$html .= '</div>';
$html .= ' <span class="edac-details-rule-records-record-ignore-info-date">' . $ignore_date . '</span>';
$html .= '</div>';

$html .= ( true === $ignore_permission || ! empty( $ignore_comment ) ) ? '<label for="edac-details-rule-records-record-ignore-comment-' . $id . '">Comment</label><br>' : '';
$html .= ( true === $ignore_permission || ! empty( $ignore_comment ) ) ? '<textarea rows="4" class="edac-details-rule-records-record-ignore-comment" id="edac-details-rule-records-record-ignore-comment-' . $id . '" ' . $ignore_comment_disabled . '>' . $ignore_comment . '</textarea>' : '';
$html .= ( true === $ignore_permission || ! empty( $ignore_comment ) ) ? '<label for="edac-details-rule-records-record-ignore-comment-' . $id . '">Comment</label><br>' : '';
$html .= ( true === $ignore_permission || ! empty( $ignore_comment ) ) ? '<textarea rows="4" class="edac-details-rule-records-record-ignore-comment" id="edac-details-rule-records-record-ignore-comment-' . $id . '" ' . $ignore_comment_disabled . '>' . $ignore_comment . '</textarea>' : '';

if ( $ignore_global ) {
$html .= ( true === $ignore_permission ) ? '<a href="' . admin_url( 'admin.php?page=accessibility_checker_ignored&tab=global' ) . '" class="edac-details-rule-records-record-ignore-global">Manage Globally Ignored</a>' : '';
} else {
$html .= ( true === $ignore_permission ) ? '<button class="edac-details-rule-records-record-ignore-submit" data-id=' . $id . ' data-action=' . $ignore_action . ' data-type=' . $ignore_type . '>' . EDAC_SVG_IGNORE_ICON . ' <span class="edac-details-rule-records-record-ignore-submit-label">' . $ignore_submit_label . '<span></button>' : '';
}

$html .= ( false === $ignore_permission && false === $ignore ) ? __( 'Your user account doesn\'t have permission to ignore this issue.', 'accessibility-checker' ) : '';
$html .= ( false === $ignore_permission && false === $ignore ) ? __( 'Your user account doesn\'t have permission to ignore this issue.', 'accessibility-checker' ) : '';

$html .= '</div>';
$html .= '</div>';

$html .= '</div>';

Expand Down Expand Up @@ -539,7 +540,7 @@ public function readability() {
} else {
$html .= '<p class="edac-readability-list-item-description">A simplified summary is not necessary when content reading level is 9th grade or below. Choose when to prompt for a simplified summary on the settings page.</p>';
}
$html .= '</li>';
$html .= '</li>';

if ( $post_grade_failed ) {

Expand All @@ -554,7 +555,7 @@ public function readability() {
if ( 'none' === $simplified_summary_prompt ) {

$html .=
'<li class="edac-readability-list-item edac-readability-summary-position">
'<li class="edac-readability-list-item edac-readability-summary-position">
<span class="edac-readability-list-item-icon"><img src="' . plugin_dir_url( __FILE__ ) . 'assets/images/warning icon yellow.png" alt="" width="22"></span>
<p class="edac-readability-list-item-title">Simplified summary is not being automatically inserted into the content.</p>
<p class="edac-readability-list-item-description">Your Prompt for Simplified Summary is set to "never." If you would like the simplified summary to be displayed automatically, you can change this on the <a href="' . get_bloginfo( 'url' ) . '/wp-admin/admin.php?page=accessibility_checker_settings">settings page</a>.</p>
Expand All @@ -563,7 +564,7 @@ public function readability() {
} elseif ( 'none' !== $simplified_summary_position ) {

$html .=
'<li class="edac-readability-list-item edac-readability-summary-position">
'<li class="edac-readability-list-item edac-readability-summary-position">
<span class="edac-readability-list-item-icon dashicons dashicons-saved"></span>
<p class="edac-readability-list-item-title">Simplified summary is being automatically inserted <strong>' . $simplified_summary_position . ' the content</strong>.</p>
<p class="edac-readability-list-item-description">Set where the Simplified Summary is inserted into the content on the <a href="' . get_bloginfo( 'url' ) . '/wp-admin/admin.php?page=accessibility_checker_settings">settings page</a>.</p>
Expand All @@ -572,7 +573,7 @@ public function readability() {
} else {

$html .=
'<li class="edac-readability-list-item edac-readability-summary-position">
'<li class="edac-readability-list-item edac-readability-summary-position">
<span class="edac-readability-list-item-icon"><img src="' . plugin_dir_url( __FILE__ ) . 'assets/images/warning icon yellow.png" alt="" width="22"></span>
<p class="edac-readability-list-item-title">Simplified summary is not being automatically inserted into the content.</p>
<p class="edac-readability-list-item-description">Your Simplified Summary location is set to "manually" which requires a function be added to your page template. If you would like the simplified summary to be displayed automatically, you can change this on the <a href="' . get_bloginfo( 'url' ) . '/wp-admin/admin.php?page=accessibility_checker_settings">settings page</a>.</p>
Expand All @@ -585,7 +586,7 @@ public function readability() {

if ( ( $post_grade_failed || 'always' === $simplified_summary_prompt ) && ( 'none' !== $simplified_summary_prompt ) ) {
$html .=
'</form>
'</form>
<form action="/" class="edac-readability-simplified-summary">
<label for="edac-readability-text">Simplified Summary</label>
<textarea name="" id="edac-readability-text" cols="30" rows="10">' . $simplified_summary . '</textarea>
Expand Down Expand Up @@ -736,16 +737,4 @@ public function dismiss_dashboard_cta() {

wp_send_json( 'success' );
}

/**
* Handle AJAX request to opt in to email
*
* @return void
*/
public function email_opt_in() {

update_user_meta( get_current_user_id(), 'edac_email_optin', true );

wp_send_json( 'success' );
}
}
26 changes: 11 additions & 15 deletions admin/class-enqueue-admin.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@

namespace EDAC\Admin;

use EDAC\Admin\OptIn\Email_Opt_In;

/**
* Class that initializes and handles enqueueing styles and scripts for the admin.
*/
Expand Down Expand Up @@ -135,22 +137,16 @@ public static function maybe_enqueue_admin_and_editor_app_scripts() {
public static function maybe_enqueue_email_opt_in_script() {

$page = isset( $_GET['page'] ) ? sanitize_text_field( $_GET['page'] ) : null; // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- display only.
if ( 'accessibility_checker' === $page
&& true !== (bool) get_user_meta( get_current_user_id(), 'edac_email_optin', true )
) {

wp_enqueue_style( 'email-opt-in-form', plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/css/emailOptIn.css', false, EDAC_VERSION, 'all' );
wp_enqueue_script( 'email-opt-in-form', plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/emailOptIn.bundle.js', false, EDAC_VERSION, true );

wp_localize_script(
'email-opt-in-form',
'edac_email_opt_in_form',
array(
'nonce' => wp_create_nonce( 'ajax-nonce' ),
'ajaxurl' => admin_url( 'admin-ajax.php' ),
)
);
if ( 'accessibility_checker' !== $page ) {
return;
}

$user_already_opted_in = (bool) get_user_meta( get_current_user_id(), Email_Opt_In::EDAC_USER_OPTIN_META_KEY, true );
if ( $user_already_opted_in ) {
return;
}

$email_opt_in = new Email_Opt_In();
$email_opt_in->enqueue_scripts();
}
}
80 changes: 8 additions & 72 deletions admin/class-welcome-page.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@

namespace EDAC\Admin;

use EDAC\Admin\OptIn\Email_Opt_In;

/**
* Class that handles welcome page
*/
Expand Down Expand Up @@ -315,87 +317,21 @@ public static function render_summary() {
<?php
}


/**
* Render the ActiveCamapaign email opt form in panel
* Render the ActiveCampaign email opt form in panel
*
* @return void
*/
public static function maybe_render_email_opt_in() {

if ( true === (bool) get_user_meta( get_current_user_id(), 'edac_email_optin', true ) ) {
return;
}

$current_user = wp_get_current_user();
$email = $current_user->user_email;
$first_name = $current_user->first_name;

if ( empty( $email ) ) {
$email = '';
if ( Email_Opt_In::user_already_subscribed() ) {
return;
}

if ( empty( $first_name ) ) {
$first_name = '';
if ( Email_Opt_In::should_show_modal() ) {
return;
}

?>

<div class="edac-panel edac-mt-1 edac-pb-3">
<form method="POST" action="https://equalizedigital.activehosted.com/proc.php" id="_form_1_" class="_form _form_1 _inline-form _dark" novalidate data-styles-version="4">
<input type="hidden" name="u" value="1" />
<input type="hidden" name="f" value="1" />
<input type="hidden" name="s" />
<input type="hidden" name="c" value="0" />
<input type="hidden" name="m" value="0" />
<input type="hidden" name="act" value="sub" />
<input type="hidden" name="v" value="2" />
<input type="hidden" name="or" value="b39789e838d79bbdbe094b6ec4b523cf" />
<div class="_form-content">
<div class="_form_element _x66524317 _full_width _clear" >
<h2 class="_form-title">
<?php esc_html_e( 'Accessibility Events &amp; News in Your Inbox', 'accessibility-checker' ); ?>
</h2>
</div>
<div class="_form_element _x20909711 _full_width _clear" >
<div class="_html-code">
<p>
<?php esc_html_e( 'Subscribe to Equalize Digital\'s email list to get access to free accessibility webinars and training resources.', 'accessibility-checker' ); ?>
</p>
</div>
</div>
<div class="_form_element _x35928214 _full_width " >
<label for="email" class="_form-label">
<?php esc_html_e( 'Email*', 'accessibility-checker' ); ?>
</label>
<div class="_field-wrapper">
<input type="text" id="email" name="email"
placeholder="<?php esc_attr_e( 'Type your email', 'accessibility-checker' ); ?>"
value="<?php echo esc_attr( $email ); ?>" required />
</div>
</div>
<div class="_form_element _x31419797 _full_width edac-mt-1" >
<label for="firstname" class="_form-label">
<?php esc_html_e( 'First Name', 'accessibility-checker' ); ?>
</label>
<div class="_field-wrapper">
<input type="text" id="firstname" name="firstname"
placeholder="<?php esc_attr_e( 'Type your first name', 'accessibility-checker' ); ?>"
value="<?php echo esc_attr( $first_name ); ?>" />
</div>
</div>
<div class="_button-wrapper _full_width edac-mt-3 edac-mb-3">
<button id="_form_1_submit" class="_submit button button-primary" type="submit">
Subscribe
</button>
</div>
<div class="_clear-element">
</div>
</div>
<div class="_form-thank-you" style="display:none;" aria-live="polite" id="polite-announcement">
</div>
</form>
</div>
<?php
Email_Opt_In::render_form();
}
}
Loading

0 comments on commit c98df52

Please sign in to comment.