← All changes | includes/extensions/Woo_Builder/script.js +60 -11 51.1.78 → 51.1.87 View file →

		@@ -142,23 +142,47 @@
142	142
143	143	(function () {
144	144	'use strict';
145	145
146		- const defaultPanels = ['#customer_details', '.woocommerce-checkout-payment', '.woocommerce-checkout-review-order'];
	146	+ const defaultPanels = [
	147	+ '.woocommerce-billing-fields',
	148	+ '.woocommerce-shipping-fields',
	149	+ '#payment',
	150	+ '.woocommerce-checkout-review-order-table',
	151	+ ];
147	152
148	153	const resolvePanels = (container) => {
149		- const customSelectors = Array.from(container.querySelectorAll('.ka-woo-checkout-step')).map((step) => step.dataset.target || '');
150		- const mapped = customSelectors.some(Boolean) ? customSelectors : defaultPanels;
151		- return mapped.map((selector, idx) => ({ selector, idx }));
	154	+ const steps = Array.from(container.querySelectorAll('.ka-woo-checkout-step'));
	155	+ return steps.map((step, idx) => ({
	156	+ selector: (step.dataset.target || '').trim() || defaultPanels[idx] || '',
	157	+ idx,
	158	+ }));
152	159	};
153	160
	161	+ const revealWithAncestors = (el) => {
	162	+ if (!el) {
	163	+ return;
	164	+ }
	165	+ el.classList.remove('ka-woo-hidden');
	166	+ let parent = el.parentElement;
	167	+ while (parent && parent !== document.body) {
	168	+ parent.classList.remove('ka-woo-hidden');
	169	+ parent = parent.parentElement;
	170	+ }
	171	+ };
	172	+
154	173	const togglePanels = (stepsMap, activeIndex, scroll) => {
	174	+ const activeSelector = stepsMap[activeIndex] ? stepsMap[activeIndex].selector : '';
	175	+ const activeEls = activeSelector ? Array.from(document.querySelectorAll(activeSelector)) : [];
	176	+
155	177	stepsMap.forEach((item, idx) => {
156	178	if (!item.selector) {
157	179	return;
158	180	}
159	181	document.querySelectorAll(item.selector).forEach((el) => {
160		- if (idx === activeIndex) {
	182	+ const isActive = idx === activeIndex;
	183	+ const isAncestorOfActive = activeEls.some((active) => el.contains(active));
	184	+ if (isActive || isAncestorOfActive) {
161	185	el.classList.remove('ka-woo-hidden');
162	186	} else {
163	187	el.classList.add('ka-woo-hidden');
164	188	}
		@@ -164,11 +188,12 @@
164	188	}
165	189	});
166	190	});
167	191
	192	+ activeEls.forEach(revealWithAncestors);
	193	+
168	194	if (scroll && scroll === 'yes') {
169		- const targetSelector = stepsMap[activeIndex] ? stepsMap[activeIndex].selector : null;
170		- const target = targetSelector ? document.querySelector(targetSelector) : null;
	195	+ const target = activeEls[0] || null;
171	196	if (target) {
172	197	target.scrollIntoView({ behavior: 'smooth', block: 'start' });
173	198	}
174	199	}
		@@ -175,8 +200,12 @@
175	200	};
176	201
177	202	const initSteps = () => {
178	203	document.querySelectorAll('.ka-woo-checkout-steps--pro').forEach((container) => {
	204	+ if (container.dataset.kaCheckoutStepsInit === '1') {
	205	+ return;
	206	+ }
	207	+ container.dataset.kaCheckoutStepsInit = '1';
179	208	const steps = Array.from(container.querySelectorAll('.ka-woo-checkout-step'));
180	209	if (!steps.length) {
181	210	return;
182	211	}
		@@ -212,12 +241,15 @@
212	241	});
213	242	return valid;
214	243	};
215	244
216		- const setActive = (idx) => {
217		- current = idx;
218		- steps.forEach((step, i) => step.classList.toggle('is-active', i === current));
219		- togglePanels(stepsMap, current, scrollTop);
	245	+ const applyCurrent = (scroll) => {
	246	+ const map = resolvePanels(container);
	247	+ steps.forEach((step, i) => {
	248	+ step.classList.toggle('is-active', i === current);
	249	+ step.classList.toggle('is-complete', i < current);
	250	+ });
	251	+ togglePanels(map, current, scroll);
220	252	if (enableNav && navPrev && navNext) {
221	253	navPrev.disabled = current === 0;
222	254	const isLast = current >= steps.length - 1;
223	255	navNext.dataset.isLast = isLast ? 'true' : 'false';
		@@ -231,8 +263,15 @@
231	263	}
232	264	steps.forEach((step) => step.classList.remove(errorClass));
233	265	};
234	266
	267	+ const setActive = (idx) => {
	268	+ current = idx;
	269	+ applyCurrent(scrollTop);
	270	+ };
	271	+
	272	+ container.kaApplyCheckoutStep = () => applyCurrent('no');
	273	+
235	274	steps.forEach((step, idx) => {
236	275	step.addEventListener('click', () => setActive(idx));
237	276	});
238	277
		@@ -405,8 +444,18 @@
405	444	initSteps();
406	445	initSticky();
407	446	initPayments();
408	447	});
	448	+
	449	+ if (window.jQuery) {
	450	+ window.jQuery(document.body).on('updated_checkout', function () {
	451	+ document.querySelectorAll('.ka-woo-checkout-steps--pro').forEach((container) => {
	452	+ if (typeof container.kaApplyCheckoutStep === 'function') {
	453	+ container.kaApplyCheckoutStep();
	454	+ }
	455	+ });
	456	+ });
	457	+ }
409	458	})();
410	459
411	460
412	461