Skip to content

Commit

Permalink
Add dynamic display of theme, size, language, mode.
Browse files Browse the repository at this point in the history
  • Loading branch information
kagg-design committed Jul 30, 2023
1 parent 30b2aee commit df11e63
Show file tree
Hide file tree
Showing 4 changed files with 136 additions and 10 deletions.
101 changes: 98 additions & 3 deletions assets/js/general.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,34 @@
/* global jQuery, HCaptchaGeneralObject */

/**
* @param HCaptchaGeneralObject.ajaxUrl
* @param HCaptchaGeneralObject.action
* @param HCaptchaGeneralObject.nonce
* @param HCaptchaGeneralObject.modeLive
* @param HCaptchaGeneralObject.modeTestPublisher
* @param HCaptchaGeneralObject.modeTestEnterpriseSafeEndUser
* @param HCaptchaGeneralObject.modeTestEnterpriseBotDetected
* @param HCaptchaGeneralObject.siteKey
* @param HCaptchaGeneralObject.modeTestPublisherSiteKey
* @param HCaptchaGeneralObject.modeTestEnterpriseSafeEndUserSiteKey
* @param HCaptchaGeneralObject.modeTestEnterpriseBotDetectedSiteKey
*/

/**
* General settings page logic.
*
* @param {Object} $ jQuery instance.
*/
const general = function( $ ) {
const msgSelector = '#hcaptcha-message';
const $message = $( msgSelector );
const $language = $( '[name="hcaptcha_settings[language]"]' );
const modes = {};

modes[ HCaptchaGeneralObject.modeLive ] = HCaptchaGeneralObject.siteKey;
modes[ HCaptchaGeneralObject.modeTestPublisher ] = HCaptchaGeneralObject.modeTestPublisherSiteKey;
modes[ HCaptchaGeneralObject.modeTestEnterpriseSafeEndUser ] = HCaptchaGeneralObject.modeTestEnterpriseSafeEndUserSiteKey;
modes[ HCaptchaGeneralObject.modeTestEnterpriseBotDetected ] = HCaptchaGeneralObject.modeTestEnterpriseBotDetectedSiteKey;

function clearMessage() {
$message.removeClass();
Expand All @@ -24,11 +50,38 @@ const general = function( $ ) {
showMessage( response, 'notice-error' );
}

function hCaptchaReset() {
$( '#hcaptcha-options .h-captcha' ).empty();
function hCaptchaGeneralReset() {
document.querySelector( '#hcaptcha-options .h-captcha' ).innerHTML = '';
window.hCaptchaBindEvents();
}

function apiScriptReset() {
const id = 'hcaptcha-api';
const api = document.getElementById( id );
const url = new URL( api.src );
const urlSearchParams = url.searchParams;
const hl = $language.val();

urlSearchParams.set( 'hl', hl );
api.parentNode.removeChild( api );

const s = document.createElement( 'script' );

s.type = 'text/javascript';
s.id = id;
s.src = url.toString();
s.async = true;
s.onload = window.hCaptchaOnLoad;
s.render = 'explicit';
s.hl = hl;

document.querySelector( '#hcaptcha-options .h-captcha' ).innerHTML = '';

const t = document.getElementsByTagName( 'script' )[ 0 ];

t.parentNode.insertBefore( s, t );
}

$( '#check_config' ).on( 'click', function( event ) {
event.preventDefault();
clearMessage();
Expand Down Expand Up @@ -56,9 +109,51 @@ const general = function( $ ) {
showErrorMessage( response.statusText );
} )
.always( function() {
hCaptchaReset();
hCaptchaGeneralReset();
} );
} );

$( '[name="hcaptcha_settings[theme]"]' ).on( 'change', function( e ) {
$( '.h-captcha' ).attr( 'data-theme', $( e.target ).val() );
hCaptchaGeneralReset();
} );

$( '[name="hcaptcha_settings[size]"]' ).on( 'change', function( e ) {
const $invisibleNotice = $( '#hcaptcha-invisible-notice' );
const size = $( e.target ).val();

if ( 'invisible' === size ) {
$invisibleNotice.show();
} else {
$invisibleNotice.hide();
}

$( '.h-captcha' ).attr( 'data-size', size );
hCaptchaGeneralReset();
} );

$language.on( 'change', function() {
apiScriptReset();
} );

$( '[name="hcaptcha_settings[mode]"]' ).on( 'change', function( e ) {
const mode = $( e.target ).val();

if ( ! modes.hasOwnProperty( mode ) ) {
return;
}

if ( mode === HCaptchaGeneralObject.modeLive ) {
$( '[name="hcaptcha_settings[site_key]"]' ).attr( 'disabled', false );
$( '[name="hcaptcha_settings[secret_key]"]' ).attr( 'disabled', false );
} else {
$( '[name="hcaptcha_settings[site_key]"]' ).attr( 'disabled', true );
$( '[name="hcaptcha_settings[secret_key]"]' ).attr( 'disabled', true );
}

$( '.h-captcha' ).attr( 'data-sitekey', modes[ mode ] );
hCaptchaGeneralReset();
} );
};

window.hCaptchaGeneral = general;
Expand Down
1 change: 1 addition & 0 deletions src/php/DelayedScript/DelayedScript.php
Original file line number Diff line number Diff line change
Expand Up @@ -102,6 +102,7 @@ public static function launch( array $args, int $delay = 3000 ) {
const t = document.getElementsByTagName( 'script' )[0];
const s = document.createElement('script');
s.type = 'text/javascript';
s.id = 'hcaptcha-api';
<?php
// phpcs:disable WordPress.Security.EscapeOutput.OutputNotEscaped
foreach ( $args as $key => $arg ) {
Expand Down
38 changes: 34 additions & 4 deletions src/php/Settings/General.php
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,21 @@ class General extends PluginSettingsBase {
*/
const MODE_TEST_ENTERPRISE_BOT_DETECTED = 'test:enterprise_bot_detected';

/**
* Test publisher mode site key.
*/
const MODE_TEST_PUBLISHER_SITE_KEY = '10000000-ffff-ffff-ffff-000000000001';

/**
* Test enterprise safe end user mode site key.
*/
const MODE_TEST_ENTERPRISE_SAFE_END_USER_SITE_KEY = '20000000-ffff-ffff-ffff-000000000002';

/**
* Test enterprise bot detected mode site key.
*/
const MODE_TEST_ENTERPRISE_BOT_DETECTED_SITE_KEY = '30000000-ffff-ffff-ffff-000000000003';

/**
* Get page title.
*
Expand Down Expand Up @@ -475,9 +490,17 @@ public function admin_enqueue_scripts() {
self::HANDLE,
self::OBJECT,
[
'ajaxUrl' => admin_url( 'admin-ajax.php' ),
'action' => self::CHECK_CONFIG_ACTION,
'nonce' => wp_create_nonce( self::CHECK_CONFIG_ACTION ),
'ajaxUrl' => admin_url( 'admin-ajax.php' ),
'action' => self::CHECK_CONFIG_ACTION,
'nonce' => wp_create_nonce( self::CHECK_CONFIG_ACTION ),
'modeLive' => self::MODE_LIVE,
'modeTestPublisher' => self::MODE_TEST_PUBLISHER,
'modeTestEnterpriseSafeEndUser' => self::MODE_TEST_ENTERPRISE_SAFE_END_USER,
'modeTestEnterpriseBotDetected' => self::MODE_TEST_ENTERPRISE_BOT_DETECTED,
'siteKey' => hcaptcha()->settings()->get_site_key(),
'modeTestPublisherSiteKey' => self::MODE_TEST_PUBLISHER_SITE_KEY,
'modeTestEnterpriseSafeEndUserSiteKey' => self::MODE_TEST_ENTERPRISE_SAFE_END_USER_SITE_KEY,
'modeTestEnterpriseBotDetectedSiteKey' => self::MODE_TEST_ENTERPRISE_BOT_DETECTED_SITE_KEY,
]
);

Expand Down Expand Up @@ -511,9 +534,16 @@ public function settings_fields( $fields ): array {
public function print_hcaptcha_field() {
HCaptcha::form_display();

$display = 'none';

if ( 'invisible' === hcaptcha()->settings()->get( 'size' ) ) {
esc_html_e( 'hCaptcha is in invisible mode.', 'hcaptcha-for-forms-and-more' );
$display = 'block';
}
?>
<div id="hcaptcha-invisible-notice" style="display: <?php echo esc_attr( $display ); ?>">
<?php esc_html_e( 'hCaptcha is in invisible mode.', 'hcaptcha-for-forms-and-more' ); ?>
</div>
<?php
}

/**
Expand Down
6 changes: 3 additions & 3 deletions src/php/Settings/Settings.php
Original file line number Diff line number Diff line change
Expand Up @@ -172,15 +172,15 @@ private function get_keys(): array {
$secret_key = $this->get( 'secret_key' );
break;
case General::MODE_TEST_PUBLISHER:
$site_key = '10000000-ffff-ffff-ffff-000000000001';
$site_key = General::MODE_TEST_PUBLISHER_SITE_KEY;
$secret_key = '0' . 'x' . '0000000000000000000000000000000000000000';
break;
case General::MODE_TEST_ENTERPRISE_SAFE_END_USER:
$site_key = '20000000-ffff-ffff-ffff-000000000002';
$site_key = General::MODE_TEST_ENTERPRISE_SAFE_END_USER_SITE_KEY;
$secret_key = '0' . 'x' . '0000000000000000000000000000000000000000';
break;
case General::MODE_TEST_ENTERPRISE_BOT_DETECTED:
$site_key = '30000000-ffff-ffff-ffff-000000000003';
$site_key = General::MODE_TEST_ENTERPRISE_BOT_DETECTED_SITE_KEY;
$secret_key = '0' . 'x' . '0000000000000000000000000000000000000000';
break;
default:
Expand Down

0 comments on commit df11e63

Please sign in to comment.