packaged version 4.5.0 (#240)

CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## [4.5.0]
+
+### Added
+- Added shipping estimation calculator to the cart page as well as
+  option to enable/disable this feature in the WordPress Customizer. 
+
+### Changed
+- Changed how Quick View triggers detect their corresponding modal container.
+  This change allows more flexibility in terms of where a Quick View button can be 
+  placed in a product card.
+
+
 ## [4.4.0]
 
 ### Added
@@ -1314,6 +1326,7 @@
   in fact, reset postdata, so far as Gutenberg 3.2.0 is concerned.
 
 
+[4.5.0]: https://github.com/bigcommerce/bigcommerce-for-wordpress/compare/4.4.0...4.5.0
 [4.4.0]: https://github.com/bigcommerce/bigcommerce-for-wordpress/compare/4.3.1...4.4.0
 [4.3.1]: https://github.com/bigcommerce/bigcommerce-for-wordpress/compare/4.3.0...4.3.1
 [4.3.0]: https://github.com/bigcommerce/bigcommerce-for-wordpress/compare/4.2.0...4.3.0

assets/js/src/constants/events.js

@@ -0,0 +1,3 @@
+// custom events
+export const AJAX_CART_UPDATE = 'bigcommerce/ajax_cart_update';
+export const HANDLE_CART_STATE = 'bigcommerce/handle_cart_state';

assets/js/src/public/buttons/pagination.js

@@ -209,8 +209,9 @@ const bindEvents = () => {
 	el.itemContainer.forEach((itemContainer) => {
 		createSpinLoader(itemContainer);
 		initializeItems(itemContainer);
-		delegate(document, '[data-js="load-items-trigger-btn"]', 'click', getNextPageItems);
 	});
+
+	delegate(document, '[data-js="load-items-trigger-btn"]', 'click', getNextPageItems);
 };
 
 const init = () => {

assets/js/src/public/buttons/quick-view-dialog.js

@@ -36,9 +36,9 @@ const getOptions = dialogID => ({
 });
 
 const initSingleDialog = (e) => {
-	const dialog = e.delegateTarget;
+	const dialogTrigger = e.delegateTarget;
+	const dialog = tools.closest(e.delegateTarget, '[data-js="bc-product-loop-card"]');
 	const dialogID = _.uniqueId('bc-product-quick-view-dialog-');
-	const dialogTrigger = tools.getNodes('bc-product-quick-view-dialog-trigger', false, dialog)[0];
 	const target = tools.getNodes('[data-quick-view-script]', false, dialog, true)[0];
 
 	if (!dialogTrigger || !target) {
@@ -66,7 +66,7 @@ const initSingleDialog = (e) => {
 };
 
 const bindEvents = () => {
-	delegate(document.body, '[data-js="bc-product-loop-card"]:not(.initialized)', 'click', initSingleDialog);
+	delegate(document.body, '[data-js="bc-product-loop-card"]:not(.initialized) [data-js="bc-product-quick-view-dialog-trigger"]', 'click', initSingleDialog);
 };
 
 const init = () => {

assets/js/src/public/cart/add-to-cart.js

@@ -10,6 +10,8 @@ import * as tools from 'utils/tools';
 import { trigger } from 'utils/events';
 import { wpAPIAddToCartAjax } from 'utils/ajax';
 import { CART_API_BASE, AJAX_CART_ENABLED, AJAX_CART_NONCE } from 'publicConfig/wp-settings';
+import { CART_ID_COOKIE_NAME } from 'bcConstants/cookies';
+import { AJAX_CART_UPDATE } from 'bcConstants/events';
 import { NLS } from 'publicConfig/i18n';
 import { cartMenuSet, updateFlatsomeCartMenuQty, updateFlatsomeCartMenuPrice } from './cart-menu-item';
 
@@ -222,7 +224,7 @@ const handleAjaxAddToCartRequest = (e) => {
 		return;
 	}
 
-	const cartID = Cookie.get('bigcommerce_cart_id');
+	const cartID = Cookie.get(CART_ID_COOKIE_NAME);
 	const url = cartID ? `${CART_API_BASE}/${cartID}` : CART_API_BASE;
 	const query = getAjaxQueryString(cartButton);
 
@@ -244,7 +246,7 @@ const handleAjaxAddToCartRequest = (e) => {
 			updateCartItemCount(res.body);
 			updateFlatsomeCartMenuQty();
 			updateFlatsomeCartMenuPrice(res.body);
-			trigger({ event: 'bigcommerce/update_mini_cart', native: false });
+			trigger({ event: AJAX_CART_UPDATE, native: false });
 			trigger({ event: 'bigcommerce/analytics_trigger', data: { cartButton, cartID: res.body.cart_id }, native: false });
 		});
 };

assets/js/src/public/cart/ajax-items.js

@@ -12,6 +12,7 @@ import { on, trigger } from 'utils/events';
 import cartState from 'publicConfig/cart-state';
 import { CART_API_BASE } from 'publicConfig/wp-settings';
 import { CART_ID_COOKIE_NAME, CART_ITEM_COUNT_COOKIE } from 'bcConstants/cookies';
+import { AJAX_CART_UPDATE, HANDLE_CART_STATE } from 'bcConstants/events';
 import { NLS } from 'publicConfig/i18n';
 import { cartEmpty } from './cart-templates';
 import { updateMenuQtyTotal, updateCartMenuItem, updateFlatsomeCartMenuQty, updateFlatsomeCartMenuPrice } from './cart-menu-item';
@@ -66,6 +67,7 @@ const handleCartState = (e) => {
 		const itemRemoveButtons = tools.getNodes('.bc-cart-item__remove-button', true, cart, true);
 		const checkoutButton = tools.getNodes('proceed-to-checkout', false, cart)[0];
 		const isMiniCart = tools.closest(cart, '[data-js="bc-mini-cart"]');
+		const shippingMethods = tools.getNodes('[data-shipping-field]', true, cart, true);
 
 		if (isMiniCart && isMiniCart.dataset.miniCartId === eventMiniCart) {
 			return;
@@ -81,6 +83,9 @@ const handleCartState = (e) => {
 			if (checkoutButton) {
 				checkoutButton.setAttribute('disabled', 'disabled');
 			}
+			if (shippingMethods) {
+				shippingMethods.forEach(field => field.setAttribute('disabled', 'disabled'));
+			}
 			cart.classList.add('bc-updating-cart');
 
 			return;
@@ -93,7 +98,10 @@ const handleCartState = (e) => {
 			item.removeAttribute('disabled');
 		});
 		if (checkoutButton) {
-			checkoutButton.removeAttribute('disabled', 'disabled');
+			checkoutButton.removeAttribute('disabled');
+		}
+		if (shippingMethods) {
+			shippingMethods.forEach(field => field.removeAttribute('disabled'));
 		}
 
 		cart.classList.remove('bc-updating-cart');
@@ -231,7 +239,7 @@ const handleQtyUpdate = (inputEvent) => {
 
 				inputEvent.delegateTarget.setAttribute('data-currentvalue', inputEvent.delegateTarget.value);
 				cartItemQtyUpdated(res.body);
-				trigger({ event: 'bigcommerce/update_mini_cart', data: { miniCartID }, native: false });
+				trigger({ event: AJAX_CART_UPDATE, data: { miniCartID, cartData: res.body }, native: false });
 			});
 	}, timeoutOptions.delay);
 };
@@ -300,14 +308,14 @@ const handleCartItemRemoval = (e) => {
 			}
 
 			removeCartItem(itemRow, res);
-			trigger({ event: 'bigcommerce/update_mini_cart', data: { miniCartID }, native: false });
+			trigger({ event: AJAX_CART_UPDATE, data: { miniCartID, cartData: res.body }, native: false });
 		});
 };
 
 const bindEvents = () => {
 	delegate(document, '[data-js="bc-cart-item__quantity"]', 'input', handleQtyUpdate);
 	delegate(document, '[data-js="remove-cart-item"]', 'click', handleCartItemRemoval);
-	on(document, 'bigcommerce/handle_cart_state', handleCartState);
+	on(document, HANDLE_CART_STATE, handleCartState);
 };
 
 const init = () => {

assets/js/src/public/cart/index.js

@@ -9,6 +9,7 @@ import cartPage from './cart-page';
 import addToCart from './add-to-cart';
 import miniCartWidget from './mini-cart-widget';
 import miniCartNav from './mini-cart-nav';
+import shippingCalc from './shipping-calculator';
 
 const init = () => {
 	cartItemsAjax();
@@ -17,6 +18,7 @@ const init = () => {
 	addToCart();
 	miniCartWidget();
 	miniCartNav();
+	shippingCalc();
 };
 
 export default init;

assets/js/src/public/cart/mini-cart-nav.js

@@ -12,6 +12,7 @@ import { wpAPIMiniCartGet } from 'utils/ajax';
 import cartState from 'publicConfig/cart-state';
 import { on, trigger } from 'utils/events';
 import { CART_ID_COOKIE_NAME } from 'bcConstants/cookies';
+import { AJAX_CART_UPDATE } from 'bcConstants/events';
 import { NLS } from 'publicConfig/i18n';
 import globalState from 'publicConfig/state';
 import ajaxItems from './ajax-items';
@@ -136,7 +137,7 @@ const initCartMenuItems = () => {
 		menuItem.appendChild(fragment);
 	});
 
-	trigger({ event: 'bigcommerce/update_mini_cart', native: false });
+	trigger({ event: AJAX_CART_UPDATE, native: false });
 };
 
 /**

assets/js/src/public/cart/mini-cart-widget.js

@@ -12,6 +12,7 @@ import { wpAPIMiniCartGet } from 'utils/ajax';
 import { NLS } from 'publicConfig/i18n';
 import cartState from 'publicConfig/cart-state';
 import { AJAX_CART_NONCE, CART_API_BASE } from 'publicConfig/wp-settings';
+import { AJAX_CART_UPDATE, HANDLE_CART_STATE } from 'bcConstants/events';
 import { cartEmpty } from './cart-templates';
 import { updateCartMenuItem } from './cart-menu-item';
 import ajaxItems from './ajax-items';
@@ -27,7 +28,7 @@ const setEmptyCart = (miniCartID = '') => {
 	});
 
 	cartState.isFetching = false;
-	trigger({ event: 'bigcommerce/handle_cart_state', data: { miniCartID }, native: false });
+	trigger({ event: HANDLE_CART_STATE, data: { miniCartID }, native: false });
 };
 
 /**
@@ -63,7 +64,7 @@ const loadMiniCarts = (e) => {
 
 	// Start the handle_cart_state event.
 	cartState.isFetching = true;
-	trigger({ event: 'bigcommerce/handle_cart_state', data: { miniCartID: eventMiniCartID }, native: false });
+	trigger({ event: HANDLE_CART_STATE, data: { miniCartID: eventMiniCartID }, native: false });
 
 	// If we don't have a cartID and URL, stop here.
 	if (_.isEmpty(cartURL)) {
@@ -98,7 +99,7 @@ const loadMiniCarts = (e) => {
 
 			// End the handle_cart_state event.
 			cartState.isFetching = false;
-			trigger({ event: 'bigcommerce/handle_cart_state', data: { miniCartID: eventMiniCartID }, native: false });
+			trigger({ event: HANDLE_CART_STATE, data: { miniCartID: eventMiniCartID }, native: false });
 		});
 };
 
@@ -112,7 +113,7 @@ const cacheElements = () => {
 };
 
 const bindEvents = () => {
-	on(document, 'bigcommerce/update_mini_cart', loadMiniCarts);
+	on(document, AJAX_CART_UPDATE, loadMiniCarts);
 };
 
 const init = () => {