From df11e632c01727b4cfc5e51886db3eaa8c28d161 Mon Sep 17 00:00:00 2001 From: kagg-design Date: Sun, 30 Jul 2023 19:24:36 +0300 Subject: [PATCH] Add dynamic display of theme, size, language, mode. --- assets/js/general.js | 101 +++++++++++++++++++++++- src/php/DelayedScript/DelayedScript.php | 1 + src/php/Settings/General.php | 38 ++++++++- src/php/Settings/Settings.php | 6 +- 4 files changed, 136 insertions(+), 10 deletions(-) diff --git a/assets/js/general.js b/assets/js/general.js index 6b7408e4..5464b10f 100644 --- a/assets/js/general.js +++ b/assets/js/general.js @@ -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(); @@ -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(); @@ -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; diff --git a/src/php/DelayedScript/DelayedScript.php b/src/php/DelayedScript/DelayedScript.php index fd78855b..a0a2aa24 100644 --- a/src/php/DelayedScript/DelayedScript.php +++ b/src/php/DelayedScript/DelayedScript.php @@ -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'; $arg ) { diff --git a/src/php/Settings/General.php b/src/php/Settings/General.php index cd05708b..3393c6c3 100644 --- a/src/php/Settings/General.php +++ b/src/php/Settings/General.php @@ -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. * @@ -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, ] ); @@ -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'; } + ?> +
+ +
+ 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: