From 1b3c5dc54ad6a55d10e5d732ed34af7925cad0ad Mon Sep 17 00:00:00 2001 From: Antoine M Date: Mon, 2 Dec 2024 12:31:25 +0100 Subject: [PATCH] handling search --- resources/js/dynamicSearch.js | 92 +++++++++++++++++++++++++++++++++++ 1 file changed, 92 insertions(+) diff --git a/resources/js/dynamicSearch.js b/resources/js/dynamicSearch.js index b1d3960..d6a4b52 100644 --- a/resources/js/dynamicSearch.js +++ b/resources/js/dynamicSearch.js @@ -21,6 +21,29 @@ function formatFormDataArray(formData) { } return formObjectDatas; } + +function formatSearchDataArray(formData) { + let formObjectDatas = {}; + + for (const [name, value] of formData) { + formObjectDatas[cleanName] = value; + } + return formObjectDatas; +} + +function handleRadioCardClick(card) { + card.addEventListener('click', (e) => { + const radioInput = card.querySelector( + 'input[type="radio"]' + ); + radioInput.checked = true; + const artisanPosts = document.querySelector( + '.artisans-posts' + ); + if (!artisanPosts) return; + artisanPosts.scrollIntoView({ behavior: 'smooth' }); + }); +} async function hydrateFields(formObjectDatas) { const currentLanguage = document .querySelector('body') @@ -51,6 +74,29 @@ async function hydrateFields(formObjectDatas) { // ); } +async function hydrateSearch(searchValue) { + const currentLanguage = document + .querySelector('body') + .getAttribute('current-language'); + + const response = await fetch( + `/wp-json/metiers-patrimoine-datas/v1/build/artisans?search=${searchValue}` + ); + const searchArtisansDatas = await response.json(); + + console.log(searchArtisansDatas); + + const artisansGrid = document.querySelector( + '.artisans-posts__grid' + ); + artisansGrid.innerHTML = + searchArtisansDatas.html_template; + brochureRows.setAttribute( + 'current-post-count', + brochuresDatas.total_posts_found + ); +} + function handleHierarchicalTaxonomyCheckboxRelation(e) { // If parent is checked, check all children if ( @@ -144,6 +190,38 @@ function handleFormChange(e) { let formObjectDatas = formatFormDataArray(formData); hydrateFields(formObjectDatas); } + +function handleSearchSubmit(e) { + e.preventDefault(); + + const searchBy = document.querySelector( + '.metier-patrimoine-searchbar__search-by' + ); + const elementsBatimentsCheckbox = document.querySelector( + '#elements_batiments_checkbox' + ); + const metiersCheckbox = document.querySelector( + '#metiers_checkbox' + ); + + metiersCheckbox.checked = false; + elementsBatimentsCheckbox.checked = false; + + console.log(metiersCheckbox); + + const form = e.target.closest('form'); + const searchValue = + form.querySelector('#search-input').value; + + hydrateSearch(searchValue); + + const artisanPosts = document.querySelector( + '.artisans-posts' + ); + if (!artisanPosts) return; + artisanPosts.scrollIntoView({ behavior: 'smooth' }); +} + export default function dynamicSearch() { const form = document.querySelector( '.metier-patrimoine-searchform' @@ -153,4 +231,18 @@ export default function dynamicSearch() { return; } form.addEventListener('change', handleFormChange); + + const searchRadioCards = document.querySelectorAll( + '.search-radio-card' + ); + + searchRadioCards.forEach((card) => { + handleRadioCardClick(card); + }); + + const searchForm = document.querySelector( + '.artisan-search-bar' + ); + + searchForm.addEventListener('submit', handleSearchSubmit); }