Merge pull request #483 from omise/release-v6.0.0

Release of v6.0.0
omise · Nov 5, 2024 · 67ebc85 · 67ebc85
2 parents 345fd79 + 1233a79
commit 67ebc85
Show file tree

Hide file tree

Showing 147 changed files with 22,965 additions and 1,639 deletions.
diff --git a/.gitignore b/.gitignore
@@ -7,3 +7,5 @@ node_modules/
 vendor
 .phpunit.result.cache
 composer.lock
+.nvmrc
+wp-content
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,12 @@
 # CHANGELOG
 
+## [v6.0.0 _(Nov 5, 2024)_](https://github.com/omise/omise-woocommerce/releases/tag/v6.0.0)
+- Support WooCommerce block. (PR: [#470](https://github.com/omise/omise-woocommerce/pull/470))
+- Fix the loading issue in WooCommerce block cart. (PR: [#477](https://github.com/omise/omise-woocommerce/pull/477))
+- Update banner message. (PR: [#479](https://github.com/omise/omise-woocommerce/pull/479))
+- Make secure form mandatory. (PR: [#480](https://github.com/omise/omise-woocommerce/pull/480))
+- Fix the issue of installment form not loading after an error. (PR: [#482](https://github.com/omise/omise-woocommerce/pull/482))
+
 ## [v5.9.0 _(Jul 24, 2024)_](https://github.com/omise/omise-woocommerce/releases/tag/v5.9.0)
 - Resolve dynamic property deprecation error for PHP 8.2 and above. (PR: [#465](https://github.com/omise/omise-woocommerce/pull/465))
 

diff --git a/assets/css/omise-css.css b/assets/css/omise-css.css
@@ -192,6 +192,7 @@ fieldset.card-exists,
  * 2.3). Form, bank list components
  */
 ul.omise-banks-list {
+	list-style-type: none;
 	margin: 0;
 }
 
@@ -207,6 +208,7 @@ ul.omise-banks-list {
 
 .omise-banks-list .item.mobile-banking {
 	padding-bottom: 0;
+	list-style-type: none;
 }
 
 .omise-banks-list .item.fpx:first-child {
@@ -283,6 +285,7 @@ ul.omise-banks-list {
 /** Media Quries **/
 @media all and (min-width: 375px) {
 	ul.omise-banks-list {
+		list-style-type: none;
 		margin: 0 0 0 1.75em;
 	}
 
@@ -302,6 +305,7 @@ ul.omise-banks-list {
 
 @media all and (min-width: 768px) {
 	ul.omise-banks-list {
+		list-style-type: none;
 		margin: 0;
 	}
 
@@ -318,6 +322,7 @@ ul.omise-banks-list {
 
 @media all and (min-width: 1024px) {
 	ul.omise-banks-list {
+		list-style-type: none;
 		margin: 0 0 0 1.75em;
 	}
 

diff --git a/assets/javascripts/omise-embedded-card.js b/assets/javascripts/omise-embedded-card.js
@@ -33,37 +33,42 @@ function showOmiseEmbeddedCardForm({
     fontName = font.custom_name.trim()
   }
 
-  OmiseCard.configure({
-    publicKey: publicKey,
-    element,
-    customCardForm: true,
-    locale: locale,
-    customCardFormTheme: theme,
-    customCardFormHideRememberCard: hideRememberCard ?? false,
-    customCardFormBrandIcons: brandIcons ?? null,
-    style: {
-      fontFamily: fontName,
-      fontSize: font.size,
-      input: {
-        height: input.height,
-        borderRadius: input.border_radius,
-        border: `1.2px solid ${input.border_color}`,
-        focusBorder: `1.2px solid ${input.active_border_color}`,
-        background: input.background_color,
-        color: input.text_color,
-        labelColor: input.label_color,
-        placeholderColor: input.placeholder_color,
+  // when card payment is selected and a page is refreshed then it takes around 1s
+  // for OmiseCard to be available. So, we add a timeout of 1 sec. refer to
+  // showOmiseEmbeddedCardForm() in assets/javascrips/omise-embedded-card.js
+  setTimeout(() => {
+    OmiseCard.configure({
+      publicKey: publicKey,
+      element,
+      customCardForm: true,
+      locale: locale,
+      customCardFormTheme: theme,
+      customCardFormHideRememberCard: hideRememberCard ?? false,
+      customCardFormBrandIcons: brandIcons ?? null,
+      style: {
+        fontFamily: fontName,
+        fontSize: font.size,
+        input: {
+          height: input.height,
+          borderRadius: input.border_radius,
+          border: `1.2px solid ${input.border_color}`,
+          focusBorder: `1.2px solid ${input.active_border_color}`,
+          background: input.background_color,
+          color: input.text_color,
+          labelColor: input.label_color,
+          placeholderColor: input.placeholder_color,
+        },
+        checkBox: {
+          textColor: checkbox.text_color,
+          themeColor: checkbox.theme_color,
+          border: `1.2px solid ${input.border_color}`,
+        }
       },
-      checkBox: {
-        textColor: checkbox.text_color,
-        themeColor: checkbox.theme_color,
-        border: `1.2px solid ${input.border_color}`,
-      }
-    },
-  });
+    });
 
-  OmiseCard.open({
-    onCreateTokenSuccess: onSuccess ?? noop,
-    onError: onError ?? noop
-  });
+    OmiseCard.open({
+      onCreateTokenSuccess: onSuccess ?? noop,
+      onError: onError ?? noop
+    });
+  }, 1000)
 }
diff --git a/assets/javascripts/omise-installment-form.js b/assets/javascripts/omise-installment-form.js
@@ -0,0 +1,28 @@
+function showOmiseInstallmentForm({
+  element,
+  publicKey,
+  onSuccess,
+  onError,
+  locale,
+  amount,
+}) {
+  const noop = () => { }
+
+  element.style.height = 500 + 'px'
+
+  OmiseCard.configure({
+    publicKey: publicKey,
+    amount,
+    element,
+    iframeAppId: 'omise-checkout-installment-form',
+    customCardForm: false,
+    customInstallmentForm: true,
+    locale: locale,
+    defaultPaymentMethod: 'installment'
+  });
+
+  OmiseCard.open({
+    onCreateSuccess: onSuccess ?? noop,
+    onError: onError ?? noop
+  });
+}
diff --git a/assets/javascripts/omise-myaccount-card-handler.js b/assets/javascripts/omise-myaccount-card-handler.js
@@ -60,12 +60,8 @@
 			}
 		});
 
-		if(Boolean(parseInt(omise_params.secure_form_enabled))) {
-			hideError();
-			OmiseCard.requestCardToken()
-		} else {
-			saveCardTraditional()
-		}
+		hideError();
+		OmiseCard.requestCardToken()
 	}
 
 	$(".delete_card").click(function(event){
@@ -87,71 +83,6 @@
 		create_card();
 	});
 
-	function saveCardTraditional() {
-		let errors                  = [],
-			omise_card              = {},
-			omise_card_number_field = 'number',
-			omise_card_fields       = {
-				'name'             : $( '#omise_card_name' ),
-				'number'           : $( '#omise_card_number' ),
-				'expiration_month' : $( '#omise_card_expiration_month' ),
-				'expiration_year'  : $( '#omise_card_expiration_year' ),
-				'security_code'    : $( '#omise_card_security_code' )
-			};
-
-		$.each( omise_card_fields, function( index, field ) {
-			omise_card[ index ] = (index === omise_card_number_field) ? field.val().replace(/\s/g, '') : field.val();
-			if ( "" === omise_card[ index ] ) {
-				errors.push( omise_params[ 'required_card_' + index ] );
-			}
-		} );
-
-		if ( errors.length > 0 ) {
-			showError(errors, $form);
-			return false;
-		}else{
-			hideError();
-			if(Omise){
-				Omise.setPublicKey(omise_params.key);
-				Omise.createToken("card", omise_card, function (statusCode, response) {
-					if (statusCode == 200) {
-						$.each( omise_card_fields, function( index, field ) {
-							field.val( '' );
-						} );
-
-						const data = {
-							action: "omise_create_card",
-							omise_token: response.id,
-							omise_nonce: $("#omise_add_card_nonce").val()
-						};
-
-						$.post(omise_params.ajax_url, data, 
-							function(wp_response){
-								if(wp_response.id){
-									window.location.reload();
-								}else{
-									showError(wp_response.message, $form);
-								}
-							}, "json"
-						);
-					} else {
-						if(response.message){
-							showError( omise_params.cannot_create_card + "<br/>" + response.message, $form );
-						}else if(response.responseJSON && response.responseJSON.message){
-							showError( omise_params.cannot_create_card + "<br/>" + response.responseJSON.message, $form );
-						}else if(response.status==0){
-							showError( omise_params.cannot_create_card + "<br/>" + omise_params.cannot_connect_api, $form );
-						}else {
-							showError( omise_params.retry_or_contact_support, $form );
-						}
-					}
-				});
-			}else{
-				showError( omise_params.cannot_load_omisejs + '<br/>' + omise_params.check_internet_connection, $form );
-			}
-		}
-	}
-
 	function saveCardEmbedded(payload) {
 		const data = {
 			action: "omise_create_card",
@@ -169,21 +100,19 @@
 		);
 	}
 
-	if(Boolean(parseInt(omise_params.secure_form_enabled))) {
-		showOmiseEmbeddedCardForm({
-			element: document.getElementById('omise-card'),
-			publicKey: omise_params.key,
-			locale: LOCALE,
-			theme: CARD_FORM_THEME ?? 'light',
-			design: FORM_DESIGN,
-			brandIcons: CARD_BRAND_ICONS,
-			hideRememberCard: true,
-			onSuccess: saveCardEmbedded,
-			onError: (error) => {
-				showError(error)
-				$form.unblock()
-			}
-		})
-	}
+	showOmiseEmbeddedCardForm({
+		element: document.getElementById('omise-card'),
+		publicKey: omise_params.key,
+		locale: LOCALE,
+		theme: CARD_FORM_THEME ?? 'light',
+		design: FORM_DESIGN,
+		brandIcons: CARD_BRAND_ICONS,
+		hideRememberCard: true,
+		onSuccess: saveCardEmbedded,
+		onError: (error) => {
+			showError(error)
+			$form.unblock()
+		}
+	})
 }
 )(jQuery);
diff --git a/assets/javascripts/omise-payment-credit-card.js b/assets/javascripts/omise-payment-credit-card.js