

		<div id="comparator-container">
			<div class="row">
				<div id="add-pala-message" class="alert alert-info col-md-12">
					<p>You can add up to 3 padel rackets to the comparator.</p>
					<p>All rackets are analyzed and rated so you can choose your ideal option based on your play style, level, and budget.</p>
				</div>
			</div>

			<div class="row table-responsive" id="comparator-table">
				Translation not available			</div>

			<div id="comparator-suggestions-visual" class="row justify-content-center">
				<h2 class="mb-4 text-center col-12">
					Most Popular Comparisons				</h2>
										<div class="col-12 col-lg-6 mb-4">
							<div class="suggestion-pair-container border rounded h-100">
								<h4 class="suggestion-pair-title text-center h6 mb-3">
									Power								</h4>
								<div class="suggestion-pair-row align-items-stretch justify-content-center">
									<div class="col-6 order-1 order-md-1">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Babolat-Viper-Juan-Lebrn-2025-52584-52593-52594-52604-52595-52613-52614-52615.webp"
													alt="Babolat Viper Juan Lebrón 2025"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Babolat Viper Juan Lebrón 2025											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.85											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												380,00€											</p>
										</div>
									</div>

									<div
										class="col-12 col-md-auto order-3 order-md-2 suggestion-middle-element text-center py-2 py-md-0">
										<span
											class="suggestion-vs h4 text-muted d-none d-md-block mb-3">VS</span>
										<button class="btn btn-primary btn-sm suggestion-load"
											data-pala-ids="52593,48557">
											Compare										</button>
									</div>

									<div class="col-6 order-2 order-md-3">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Adidas-Metalbone-3.4-Ale-Galn-2025-48556-48557-48566-48568-48567-48577-48578-48579-600x600.webp"
													alt="Adidas Metalbone 3.4 Ale Galán 2025"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Adidas Metalbone 3.4 Ale Galán 2025											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.80											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												390,00€											</p>
										</div>
									</div>
								</div>
							</div>
						</div>
												<div class="col-12 col-lg-6 mb-4">
							<div class="suggestion-pair-container border rounded h-100">
								<h4 class="suggestion-pair-title text-center h6 mb-3">
									Control								</h4>
								<div class="suggestion-pair-row align-items-stretch justify-content-center">
									<div class="col-6 order-1 order-md-1">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/nox-ml10-quantum-3k-by-miguel-lamperti-2025-600x600.jpg"
													alt="Nox ML10 Quantum 3K Miguel Lamperti 2025"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Nox ML10 Quantum 3K Miguel Lamperti 2025											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.75											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												339,99€											</p>
										</div>
									</div>

									<div
										class="col-12 col-md-auto order-3 order-md-2 suggestion-middle-element text-center py-2 py-md-0">
										<span
											class="suggestion-vs h4 text-muted d-none d-md-block mb-3">VS</span>
										<button class="btn btn-primary btn-sm suggestion-load"
											data-pala-ids="47660,47636">
											Compare										</button>
									</div>

									<div class="col-6 order-2 order-md-3">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/at10-luxury-genius-18k-alum-2025-by-agustin-tapia-pat10genius1825-8436603199919-640598-600x600.jpg"
													alt="Nox AT10 Luxury Genius 18K Alum Agustin Tapia 2025"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Nox AT10 Luxury Genius 18K Alum Agustin Tapia 2025											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.80											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												359,99€											</p>
										</div>
									</div>
								</div>
							</div>
						</div>
												<div class="col-12 col-lg-6 mb-4">
							<div class="suggestion-pair-container border rounded h-100">
								<h4 class="suggestion-pair-title text-center h6 mb-3">
									Best Value								</h4>
								<div class="suggestion-pair-row align-items-stretch justify-content-center">
									<div class="col-6 order-1 order-md-1">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Adidas-Adipower-Multiweight-3.3-2024-8705-8706-8707-8709-8708-8710-8711-8712-600x600.webp"
													alt="Adidas Adipower Multiweight 3.3 2024"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Adidas Adipower Multiweight 3.3 2024											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.75											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												400,00€											</p>
										</div>
									</div>

									<div
										class="col-12 col-md-auto order-3 order-md-2 suggestion-middle-element text-center py-2 py-md-0">
										<span
											class="suggestion-vs h4 text-muted d-none d-md-block mb-3">VS</span>
										<button class="btn btn-primary btn-sm suggestion-load"
											data-pala-ids="8706,19641">
											Compare										</button>
									</div>

									<div class="col-6 order-2 order-md-3">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Nox-AT10-Luxury-Genius-12K-2024-19624-19641-19642-19644-19643-19645-19646-19647-600x600.webp"
													alt="Nox AT10 Luxury Genius 12K 2024"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Nox AT10 Luxury Genius 12K 2024											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.80											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												299,95€											</p>
										</div>
									</div>
								</div>
							</div>
						</div>
												<div class="col-12 col-lg-6 mb-4">
							<div class="suggestion-pair-container border rounded h-100">
								<h4 class="suggestion-pair-title text-center h6 mb-3">
									All-Round								</h4>
								<div class="suggestion-pair-row align-items-stretch justify-content-center">
									<div class="col-6 order-1 order-md-1">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Siux-Electra-Stupa-Pro-ST3-2024-23000-23009-23010-23020-23019-23021-23022-23031-600x600.webp"
													alt="Siux Electra Stupa Pro ST3 2024"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Siux Electra Stupa Pro ST3 2024											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.80											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												295,00€											</p>
										</div>
									</div>

									<div
										class="col-12 col-md-auto order-3 order-md-2 suggestion-middle-element text-center py-2 py-md-0">
										<span
											class="suggestion-vs h4 text-muted d-none d-md-block mb-3">VS</span>
										<button class="btn btn-primary btn-sm suggestion-load"
											data-pala-ids="23009,45468">
											Compare										</button>
									</div>

									<div class="col-6 order-2 order-md-3">
										<div class="suggestion-pala-card h-100">
											<div class="img-loop-custom-comparator text-center">
												<img src="https://pala-hack.com/wp-content/uploads/Starvie-Drax-Pro-Touch-2025-45467-45468-45469-45471-45470-45472-45473-45474-600x600.webp"
													alt="Starvie Drax Pro Touch 2025"
													class="suggestion-pala-img img-fluid" loading="lazy">
											</div>
											<h3 class="suggestion-pala-title h6 mt-2 mb-1 text-center">
												Starvie Drax Pro Touch 2025											</h3>
											<p class="suggestion-pala-score text-center small mb-1">
												Total Score:
												8.70											</p>
											<p class="suggestion-pala-price text-center font-weight-bold mb-0">
												309,99€											</p>
										</div>
									</div>
								</div>
							</div>
						</div>
									</div>
		</div>

		<!-- Modal para Añadir Pala -->
		<div class="modal fade" id="addPalaModal" tabindex="-1" role="dialog" aria-labelledby="addPalaModalLabel"
			aria-hidden="true">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title" id="addPalaModalLabel">
							Add Racket						</h5>
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">
							<span aria-hidden="true">×</span>
						</button>
					</div>
					<div class="modal-body">
						<label
							for="pala-search">Search for a racket to add to the comparator:</label>
						<input type="text" id="pala-search" name="pala-search" autocomplete="off" class="form-control"
							placeholder="Type the name...">
						<div id="suggestions"
							style="border: 1px solid #ccc; display: none; margin-top: 5px; max-height: 200px; overflow-y: auto; position: absolute; background: white; width: calc(100% - 30px); z-index: 1051; box-shadow: 0 4px 8px rgba(0,0,0,0.1);">
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- JavaScript Dinámico -->
		<script>
			document.addEventListener('DOMContentLoaded', function () {
				// --- Helper para leer localStorage ---
				function getCompareArray() {
					let compareData = localStorage.getItem('compare');
					let compareArray = [];
					if (compareData) {
						try {
							compareArray = JSON.parse(compareData);
							if (!Array.isArray(compareArray)) {
								compareArray = [];
								localStorage.setItem('compare', JSON.stringify(compareArray));
							}
						} catch (e) {
							console.error('Error parseando localStorage "compare":', e);
							compareArray = [];
							localStorage.setItem('compare', JSON.stringify(compareArray));
						}
					}
					compareArray = compareArray.map(String).slice(0, 3);
					return compareArray;
				}
				// --- Variables DOM ---
				const comparatorContainer = document.getElementById('comparator-container');
				const comparatorTableDiv = document.getElementById('comparator-table');
				const addPalaMessageDiv = document.getElementById('add-pala-message');
				const palaSearchInput = document.getElementById('pala-search');
				const suggestionsDiv = document.getElementById('suggestions');
				const suggestionsSectionVisual = document.getElementById('comparator-suggestions-visual');
				const addPalaModal = $('#addPalaModal');

				// --- Mensajes traducidos ---
				const messages = {
					loading: "Loading comparator...",
					empty: "No rackets added for comparison.",
					full: "Comparator full (max. 3)",
					add_button: "Add Racket",
					search_placeholder: "Type the name...",
					not_found: "No rackets found.",
					error: "Search error."
				};

				// --- Funciones UI ---
				function updateComparatorTable() {
					let currentCompare = getCompareArray();
					comparatorTableDiv.innerHTML = '<div class="text-center p-4">' + messages.loading + '</div>';
					if (currentCompare.length > 0) {
						const ajaxUrl = 'https://pala-hack.com/wp-admin/admin-ajax.php';
						const fetchUrl = `${ajaxUrl}?action=show_comparator&compare_ids=${currentCompare.join(',')}`;
						fetch(fetchUrl)
							.then(response => {
								if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
								return response.text();
							})
							.then(html => {
								comparatorTableDiv.innerHTML = html;
								addTableListeners();
								updateAddPalaUI();
							})
							.catch(error => {
								console.error('Error fetching comparator:', error);
								comparatorTableDiv.innerHTML = '<div class="alert alert-danger">' + messages.error + '</div>';
								updateAddPalaUI();
							});
					} else {
						comparatorTableDiv.innerHTML = `<div class="text-center p-4 border rounded"><p>${messages.empty}</p><button class="btn btn-sm btn-primary add-pala-trigger" data-toggle="modal" data-target="#addPalaModal">${messages.add_button}</button></div>`;
						updateAddPalaUI();
					}
				}
				function updateAddPalaUI() {
					let currentCompare = getCompareArray();
					if (currentCompare.length < 3) {
						addPalaMessageDiv.style.display = 'block';
						palaSearchInput.disabled = false;
						palaSearchInput.placeholder = messages.search_placeholder;
						document.querySelectorAll('#comparator-table .add-pala-trigger').forEach(btn => {
							btn.disabled = false;
							btn.style.display = 'inline-block';
						});
					} else {
						addPalaMessageDiv.style.display = 'none';
						palaSearchInput.disabled = true;
						palaSearchInput.placeholder = messages.full;
						suggestionsDiv.style.display = 'none';
						suggestionsDiv.innerHTML = '';
						document.querySelectorAll('#comparator-table .add-pala-trigger').forEach(btn => {
							btn.disabled = true;
							btn.style.display = 'none';
						});
					}
					addPalaModal.off('hidden.bs.modal').on('hidden.bs.modal', function () {
						palaSearchInput.value = '';
						suggestionsDiv.innerHTML = '';
						suggestionsDiv.style.display = 'none';
					});
				}
				// --- Funciones Acción ---
				function addPalaToCompare(palaId) {
					let currentCompare = getCompareArray();
					if (!palaId) {
						alert('ID de pala inválido.');
						return;
					}
					if (currentCompare.length >= 3) {
						alert('No puedes añadir más de 3 palas.');
						return;
					}
					const palaIdStr = String(palaId);
					if (currentCompare.includes(palaIdStr)) {
						alert('Esta pala ya está en el comparador.');
						return;
					}
					currentCompare.push(palaIdStr);
					localStorage.setItem('compare', JSON.stringify(currentCompare));
					updateComparatorTable();
					addPalaModal.modal('hide');
				}
				function removePalaFromCompare(palaId) {
					let currentCompare = getCompareArray();
					const palaIdStr = String(palaId);
					currentCompare = currentCompare.filter(id => id !== palaIdStr);
					localStorage.setItem('compare', JSON.stringify(currentCompare));
					updateComparatorTable();
				}
				function loadSuggestedComparison(idsString) {
					if (!idsString) return;
					const suggestedIds = idsString.split(',').map(String).filter(id => id.trim() !== '');
					if (suggestedIds.length === 0 || suggestedIds.length > 3) {
						alert('Error al cargar la sugerencia.');
						return;
					}
					localStorage.setItem('compare', JSON.stringify(suggestedIds));
					updateComparatorTable();
					document.getElementById('comparator-table')?.scrollIntoView({ behavior: 'smooth', block: 'start' });
				}
				// --- Listeners ---
				function addTableListeners() {
					comparatorTableDiv.addEventListener('click', function (event) {
						const target = event.target;
						const removeButton = target.closest('.remove-pala');
						if (removeButton?.dataset.palaId) {
							removePalaFromCompare(removeButton.dataset.palaId);
							return;
						}
						const addButton = target.closest('.add-pala-trigger');
						if (addButton && addButton.closest('table')) { /* Bootstrap lo maneja */ }
					});
				}
				palaSearchInput.addEventListener('input', function () {
					const query = this.value.trim();
					let currentCompare = getCompareArray();
					if (query.length >= 2 && currentCompare.length < 3) {
						const ajaxUrl = 'https://pala-hack.com/wp-admin/admin-ajax.php';
						const searchUrl = `${ajaxUrl}?action=search_palas&query=${encodeURIComponent(query)}&exclude_ids=${currentCompare.join(',')}`;
						fetch(searchUrl)
							.then(response => response.ok ? response.json() : Promise.reject('Network error'))
							.then(data => {
								suggestionsDiv.innerHTML = '';
								if (data.length > 0) {
									suggestionsDiv.style.display = 'block';
									data.forEach(pala => {
										const option = document.createElement('div');
										option.classList.add('suggestion-item');
										option.textContent = pala.title;
										option.dataset.palaId = pala.id;
										option.style.padding = '8px';
										option.style.cursor = 'pointer';
										option.addEventListener('mouseover', () => option.style.backgroundColor = '#f0f0f0');
										option.addEventListener('mouseout', () => option.style.backgroundColor = '');
										option.addEventListener('click', function () {
											addPalaToCompare(this.dataset.palaId);
										});
										suggestionsDiv.appendChild(option);
									});
								} else {
									suggestionsDiv.innerHTML = '<div style="padding: 8px; color: #6c757d;">' + messages.not_found + '</div>';
									suggestionsDiv.style.display = 'block';
								}
							})
							.catch(error => {
								console.error('Error searching palas:', error);
								suggestionsDiv.innerHTML = '<div style="padding: 8px; color: red;">' + messages.error + '</div>';
								suggestionsDiv.style.display = 'block';
							});
					} else {
						suggestionsDiv.innerHTML = '';
						suggestionsDiv.style.display = 'none';
					}
				});
				comparatorContainer.addEventListener('click', function (event) {
					const addButton = event.target.closest('.add-pala-trigger');
					if (addButton && !addButton.closest('table') && !addButton.closest('#comparator-suggestions-visual')) { /* Bootstrap lo maneja */ }
				});

				// --- Listener para NUEVAS sugerencias visuales ---
				if (suggestionsSectionVisual) {
					suggestionsSectionVisual.addEventListener('click', function (event) {
						const suggestionButton = event.target.closest('.suggestion-load');
						if (suggestionButton?.dataset.palaIds) {
							event.preventDefault();
							loadSuggestedComparison(suggestionButton.dataset.palaIds);
						}
					});
				}
				// --- Carga Inicial ---
				updateComparatorTable();
			});
		</script>

		{"id":8645,"date":"2024-06-01T15:58:22","date_gmt":"2024-06-01T15:58:22","guid":{"rendered":"https:\/\/pala-hack.com\/padelracket-vergelijker\/"},"modified":"2024-06-07T16:09:23","modified_gmt":"2024-06-07T16:09:23","slug":"comparator","status":"publish","type":"page","link":"https:\/\/pala-hack.com\/en\/comparator\/","title":{"rendered":"Padel racket comparator"},"content":{"rendered":"\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-comparador.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-8645","page","type-page","status-publish","hentry"],"acf":[],"Campo_personalizado":null,"_links":{"self":[{"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/pages\/8645","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/comments?post=8645"}],"version-history":[{"count":2,"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/pages\/8645\/revisions"}],"predecessor-version":[{"id":8657,"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/pages\/8645\/revisions\/8657"}],"wp:attachment":[{"href":"https:\/\/pala-hack.com\/en\/wp-json\/wp\/v2\/media?parent=8645"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}