From cc540d883d73d9508901592925ee680443316060 Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Tue, 20 May 2025 15:40:42 +0530 Subject: [PATCH 1/7] Move datepicker code to mailchimp.js --- assets/js/mailchimp.js | 41 +++++++++++++++++++++++++++++++++++++++++ mailchimp.php | 16 +--------------- views/datepicker.php | 41 ----------------------------------------- 3 files changed, 42 insertions(+), 56 deletions(-) delete mode 100644 views/datepicker.php diff --git a/assets/js/mailchimp.js b/assets/js/mailchimp.js index 78e61513..fe180174 100644 --- a/assets/js/mailchimp.js +++ b/assets/js/mailchimp.js @@ -51,3 +51,44 @@ }); }); })(window.jQuery); + +/* Datepicker functions for the Mailchimp Widget */ +(function ($) { + if ($('.date-pick').length > 0) { + // Datepicker for the date-pick class + $('.date-pick').each(function () { + let format = $(this).data('format') || 'mm/dd/yyyy'; + format = format.replace(/yyyy/i, 'yy'); + $(this).datepicker({ + autoFocusNextInput: true, + constrainInput: false, + changeMonth: true, + changeYear: true, + beforeShow(input, inst) { + $('#ui-datepicker-div').addClass('show'); + }, + dateFormat: format.toLowerCase(), + }); + }); + } + + if ($('.birthdate-pick').length > 0) { + const d = new Date(); + $('.birthdate-pick').each(function () { + let format = $(this).data('format') || 'mm/dd'; + format = format.replace(/yyyy/i, 'yy'); + $(this).datepicker({ + autoFocusNextInput: true, + constrainInput: false, + changeMonth: true, + changeYear: false, + minDate: new Date(d.getFullYear(), 1 - 1, 1), + maxDate: new Date(d.getFullYear(), 12 - 1, 31), + beforeShow(input, inst) { + $('#ui-datepicker-div').removeClass('show'); + }, + dateFormat: format.toLowerCase(), + }); + }); + } +})(window.jQuery); diff --git a/mailchimp.php b/mailchimp.php index 73f8b6c9..0df08279 100644 --- a/mailchimp.php +++ b/mailchimp.php @@ -154,7 +154,7 @@ function mailchimp_sf_plugin_action_links( $links ) { function mailchimp_sf_load_resources() { // JS if ( ! is_admin() ) { - wp_enqueue_script( 'mailchimp_sf_main_js', MCSF_URL . 'assets/js/mailchimp.js', array( 'jquery', 'jquery-form' ), MCSF_VER, true ); + wp_enqueue_script( 'mailchimp_sf_main_js', MCSF_URL . 'assets/js/mailchimp.js', array( 'jquery', 'jquery-form', 'jquery-ui-datepicker' ), MCSF_VER, true ); // some javascript to get ajax version submitting to the proper location global $wp_scripts; $wp_scripts->localize( @@ -167,9 +167,6 @@ function mailchimp_sf_load_resources() { // Datepicker theme wp_enqueue_style( 'flick', MCSF_URL . 'assets/css/flick/flick.css', array(), MCSF_VER ); - - // Datepicker JS - wp_enqueue_script( 'jquery-ui-datepicker' ); } if ( get_option( 'mc_nuke_all_styles' ) !== '1' ) { @@ -179,17 +176,6 @@ function mailchimp_sf_load_resources() { } } -/** - * Loads jQuery Datepicker for the date-pick class - **/ -function mc_datepicker_load() { - require_once MCSF_DIR . '/views/datepicker.php'; -} - -if ( ! is_admin() ) { - add_action( 'wp_head', 'mc_datepicker_load' ); -} - /** * Handles requests that as light-weight a load as possible. * typically, JS or CSS diff --git a/views/datepicker.php b/views/datepicker.php deleted file mode 100644 index 8985e319..00000000 --- a/views/datepicker.php +++ /dev/null @@ -1,41 +0,0 @@ - - From 499cb08b28db052583d8b1528140b52eab29e045 Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Tue, 20 May 2025 16:44:30 +0530 Subject: [PATCH 2/7] improved CSS enqueue. --- assets/css/frontend.css | 116 +++++++++++++++++++++++++++ includes/blocks/mailchimp/markup.php | 88 -------------------- mailchimp.php | 81 ++++++++----------- mailchimp_widget.php | 85 -------------------- views/css/frontend.php | 74 ----------------- 5 files changed, 150 insertions(+), 294 deletions(-) create mode 100644 assets/css/frontend.css delete mode 100644 views/css/frontend.php diff --git a/assets/css/frontend.css b/assets/css/frontend.css new file mode 100644 index 00000000..5c6f7809 --- /dev/null +++ b/assets/css/frontend.css @@ -0,0 +1,116 @@ +.mc_error_msg, .mc_error_msg a { + color: red; + margin-bottom: 1.0em; +} +.mc_success_msg { + color: green; + margin-bottom: 1.0em; +} +div.mc_interest{ + width:100%; +} +#mc_signup_form label.mc_interest_label { + display:inline; +} +.mc_signup_submit { + text-align:center; +} +ul.mc_list { + list-style-type: none; + margin-left: 0; + padding-left: 0; +} +ul.mc_list li { + font-size: 14px; +} +#ui-datepicker-div .ui-datepicker-year { + display: none; +} +#ui-datepicker-div.show .ui-datepicker-year { + display: inline; + padding-left: 3px +} +.widget_mailchimpsf_widget .widget-title { + line-height: 1.4em; + margin-bottom: 0.75em; +} +.mc_custom_border_hdr, +#mc_subheader { + line-height: 1.25em; + margin-bottom: 18px; +} +.mc_merge_var { + padding:0; + margin:0; + margin-bottom: 1.0em; +} +.mc_var_label, +.mc_interest_label { + display: block; + margin-bottom: 0.5em; +} +.mc_input { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding: 10px 8px; + width: 100%; +} +.mc_input.mc_phone { + width: auto; +} +select.mc_select { + margin-top: 0.5em; + padding: 10px 8px; + width: 100%; +} +.mc_address_label { + margin-top: 1.0em; + margin-bottom: 0.5em; + display: block; +} +.mc_address_label ~ select { + padding: 10px 8px; + width: 100%; +} +.mc_list li { + list-style: none; + background: none !important; +} +.mc_interests_header { + font-weight:bold; + margin-top: 1.0em; + margin-bottom: 0.5em; +} +.mc_interest label, +.mc_interest input { + margin-bottom: 0.4em; +} +#mc_signup_submit { + margin-top: 1.5em; + padding: 10px 8px; + width: 80%; +} +#mc_unsub_link a { + font-size: 0.75em; +} +#mc_unsub_link { + margin-top: 1.0em; +} +.mc_header_address, +.mc_email_format { + display: block; + font-weight: bold; + margin-top: 1.0em; + margin-bottom: 0.5em; +} +.mc_email_options { + margin-top: 0.5em; +} +.mc_email_type { + padding-left: 4px; +} +#mc-indicates-required { + width:100%; + margin-top: 1em; +} diff --git a/includes/blocks/mailchimp/markup.php b/includes/blocks/mailchimp/markup.php index a7085dbd..843e5da1 100644 --- a/includes/blocks/mailchimp/markup.php +++ b/includes/blocks/mailchimp/markup.php @@ -80,94 +80,6 @@ function ( $single_list ) { - -
localize( - 'mailchimp_sf_main_js', - 'mailchimpSF', - array( - 'ajax_url' => trailingslashit( home_url() ), - ) - ); - - // Datepicker theme - wp_enqueue_style( 'flick', MCSF_URL . 'assets/css/flick/flick.css', array(), MCSF_VER ); - } + wp_enqueue_script( 'mailchimp_sf_main_js', MCSF_URL . 'assets/js/mailchimp.js', array( 'jquery', 'jquery-form', 'jquery-ui-datepicker' ), MCSF_VER, true ); + // some javascript to get ajax version submitting to the proper location + global $wp_scripts; + $wp_scripts->localize( + 'mailchimp_sf_main_js', + 'mailchimpSF', + array( + 'ajax_url' => trailingslashit( home_url() ), + ) + ); + + // Datepicker theme + wp_enqueue_style( 'flick', MCSF_URL . 'assets/css/flick/flick.css', array(), MCSF_VER ); + // CSS if ( get_option( 'mc_nuke_all_styles' ) !== '1' ) { - wp_enqueue_style( 'mailchimp_sf_main_css', home_url( '?mcsf_action=main_css&ver=' . MCSF_VER, 'relative' ), array(), MCSF_VER ); - global $wp_styles; - $wp_styles->add_data( 'mailchimp_sf_ie_css', 'conditional', 'IE' ); - } -} + wp_enqueue_style( 'mailchimp_sf_main_css', MCSF_URL . 'assets/css/frontend.css', array(), MCSF_VER ); -/** - * Handles requests that as light-weight a load as possible. - * typically, JS or CSS - * - * @return void - */ -function mailchimp_sf_early_request_handler() { - if ( isset( $_GET['mcsf_action'] ) ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- ignoring because this is only adding CSS - switch ( $_GET['mcsf_action'] ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- ignoring because this is only adding CSS - case 'main_css': - header( 'Content-type: text/css' ); - mailchimp_sf_main_css(); - exit; + // Backwards compatibility. TODO: Remove this in a future version. + if ( get_option( 'mc_custom_style' ) === 'on' ) { + ob_start(); + ?> + #mc_signup_form { + padding:5px; + border-width: px; + border-style: ; + border-color: #; + color: #; + background-color: #; + } + - -
diff --git a/views/css/frontend.php b/views/css/frontend.php deleted file mode 100644 index 4ab5d4ad..00000000 --- a/views/css/frontend.php +++ /dev/null @@ -1,74 +0,0 @@ - -.mc_error_msg, .mc_error_msg a { - color: red; - margin-bottom: 1.0em; -} -.mc_success_msg { - color: green; - margin-bottom: 1.0em; -} -.mc_merge_var{ - padding:0; - margin:0; -} - - #mc_signup_form { - padding:5px; - border-width: px; - border-style: ; - border-color: #; - color: #; - background-color: #; - } - - #mc_signup_container {} - #mc_signup_form {} - #mc_signup_form .mc_var_label {} - #mc_signup_form .mc_input {} - #mc-indicates-required { - width:100%; - } - .mc_interests_header { - font-weight:bold; - } - div.mc_interest{ - width:100%; - } - #mc_signup_form input.mc_interest {} - #mc_signup_form select {} - #mc_signup_form label.mc_interest_label { - display:inline; - } - .mc_signup_submit { - text-align:center; - } - ul.mc_list { - list-style-type: none; - margin-left: 0; - padding-left: 0; - } - ul.mc_list li { - font-size: 14px; - } - #ui-datepicker-div .ui-datepicker-year { - display: none; - } - #ui-datepicker-div.show .ui-datepicker-year { - display: inline; - padding-left: 3px - } From 78d783529041b0c4f4478bb7e59df779b076b1d6 Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Tue, 20 May 2025 16:45:42 +0530 Subject: [PATCH 3/7] E2E: Update list name. --- tests/cypress/e2e/block.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/cypress/e2e/block.test.js b/tests/cypress/e2e/block.test.js index a492046b..f65ecb84 100644 --- a/tests/cypress/e2e/block.test.js +++ b/tests/cypress/e2e/block.test.js @@ -203,7 +203,7 @@ describe('Block Tests', () => { cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`); cy.getBlockEditor().find('h2[aria-label="Enter a header (optional)"]').click(); cy.openDocumentSettingsPanel('Settings', 'Block'); - cy.get('.mailchimp-list-select select').select('Alternate 10up Audience'); + cy.get('.mailchimp-list-select select').select('Project Lotus'); cy.wait(2000); cy.getBlockEditor().find('label[for="EMAIL"] label').contains('Email Address'); cy.getBlockEditor().find('label[for="MMERGE9"]').should('not.exist'); From 028720faca29cbd88cf62f4396496130949bdfba Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Tue, 20 May 2025 16:58:35 +0530 Subject: [PATCH 4/7] Ignore eslint error. --- assets/js/mailchimp.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/assets/js/mailchimp.js b/assets/js/mailchimp.js index fe180174..a27900ea 100644 --- a/assets/js/mailchimp.js +++ b/assets/js/mailchimp.js @@ -64,6 +64,7 @@ constrainInput: false, changeMonth: true, changeYear: true, + // eslint-disable-next-line no-unused-vars beforeShow(input, inst) { $('#ui-datepicker-div').addClass('show'); }, @@ -84,6 +85,7 @@ changeYear: false, minDate: new Date(d.getFullYear(), 1 - 1, 1), maxDate: new Date(d.getFullYear(), 12 - 1, 31), + // eslint-disable-next-line no-unused-vars beforeShow(input, inst) { $('#ui-datepicker-div').removeClass('show'); }, From 4741a46b4ccf8898f59379471a9ef6c0e02577eb Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Tue, 20 May 2025 17:43:44 +0530 Subject: [PATCH 5/7] Fix custom style in block editor. --- ...s-mailchimp-list-subscribe-form-blocks.php | 9 +++--- includes/blocks/mailchimp/editor.css | 22 +++++++++++++-- mailchimp.php | 28 +++++++++++-------- 3 files changed, 40 insertions(+), 19 deletions(-) diff --git a/includes/blocks/class-mailchimp-list-subscribe-form-blocks.php b/includes/blocks/class-mailchimp-list-subscribe-form-blocks.php index fbc13408..45496dca 100644 --- a/includes/blocks/class-mailchimp-list-subscribe-form-blocks.php +++ b/includes/blocks/class-mailchimp-list-subscribe-form-blocks.php @@ -82,10 +82,11 @@ public function register_blocks() { $data = 'window.mailchimp_sf_block_data = ' . wp_json_encode( $data ); wp_add_inline_script( 'mailchimp-mailchimp-editor-script', $data, 'before' ); - ob_start(); - require_once MCSF_DIR . '/views/css/frontend.php'; - $data = ob_get_clean(); - wp_add_inline_style( 'mailchimp-mailchimp-editor-style', $data ); + // Backwards compatibility. TODO: Remove this in a future version. + if ( get_option( 'mc_custom_style' ) === 'on' ) { + $custom_css = mailchimp_sf_custom_style_css(); + wp_add_inline_style( 'mailchimp-mailchimp-editor-style', $custom_css ); + } } /** diff --git a/includes/blocks/mailchimp/editor.css b/includes/blocks/mailchimp/editor.css index 5862848a..31229236 100644 --- a/includes/blocks/mailchimp/editor.css +++ b/includes/blocks/mailchimp/editor.css @@ -1,4 +1,22 @@ /* Leave this file - wp_add_inline_style relies on this file existing */ +div.mc_interest{ + width:100%; +} +#mc_signup_form label.mc_interest_label { + display:inline; +} +.mc_signup_submit { + text-align:center; +} +ul.mc_list { + list-style-type: none; + margin-left: 0; + padding-left: 0; +} +ul.mc_list li { + font-size: 14px; +} + #mc_message { display: none; } @@ -65,8 +83,7 @@ div#mc_subheader:has(h3 span:empty) { margin-bottom: 1em; } -.mc_var_label, -.mc_interest_label { +.mc_var_label { display: block; margin-bottom: 0.5em; } @@ -103,7 +120,6 @@ select.mc_select { margin-top: 1.0em; margin-bottom: 0.5em; } -.mc_interest label, .mc_interest input { margin-bottom: 0.4em; } diff --git a/mailchimp.php b/mailchimp.php index 4fcadc2c..858e27d8 100644 --- a/mailchimp.php +++ b/mailchimp.php @@ -175,23 +175,27 @@ function mailchimp_sf_load_resources() { // Backwards compatibility. TODO: Remove this in a future version. if ( get_option( 'mc_custom_style' ) === 'on' ) { - ob_start(); - ?> - #mc_signup_form { - padding:5px; - border-width: px; - border-style: ; - border-color: #; - color: #; - background-color: #; - } - + #mc_signup_form { + padding:5px; + border-width: px; + border-style: ; + border-color: #; + color: #; + background-color: #; + } + Date: Tue, 20 May 2025 17:44:22 +0530 Subject: [PATCH 6/7] Add doc comment. --- mailchimp.php | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/mailchimp.php b/mailchimp.php index 858e27d8..9f8c3d76 100644 --- a/mailchimp.php +++ b/mailchimp.php @@ -181,6 +181,11 @@ function mailchimp_sf_load_resources() { } } +/** + * Custom styles CSS + * + * @return string + */ function mailchimp_sf_custom_style_css() { ob_start(); ?> From 986faa00e73a5f22b11ee19b9be28f123dce9900 Mon Sep 17 00:00:00 2001 From: Dharmesh Patel Date: Thu, 22 May 2025 11:20:48 +0530 Subject: [PATCH 7/7] E2E: Update list name. --- tests/cypress/e2e/block.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/cypress/e2e/block.test.js b/tests/cypress/e2e/block.test.js index f65ecb84..a492046b 100644 --- a/tests/cypress/e2e/block.test.js +++ b/tests/cypress/e2e/block.test.js @@ -203,7 +203,7 @@ describe('Block Tests', () => { cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`); cy.getBlockEditor().find('h2[aria-label="Enter a header (optional)"]').click(); cy.openDocumentSettingsPanel('Settings', 'Block'); - cy.get('.mailchimp-list-select select').select('Project Lotus'); + cy.get('.mailchimp-list-select select').select('Alternate 10up Audience'); cy.wait(2000); cy.getBlockEditor().find('label[for="EMAIL"] label').contains('Email Address'); cy.getBlockEditor().find('label[for="MMERGE9"]').should('not.exist');