Antoine/Metiers_du_patrimoine_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refining dynamic search
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Antoine M 2024-12-02 16:43:09 +01:00
parent e0ecb88b5e
commit f3b93ca8c8
6 changed files with 300 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
includes/api.php
View File

@ -98,7 +98,7 @@ function build_search_artisan_posts_cards($request)
if ($newsPostsDatas->found_posts === 0) {
$html_template = "<div class='no-results'><h3>" . __("Aucun résultat trouvé", "metiers-patrimoine-theme") . "</h3><p>" . __("Essayez d'ajouter un filtre supplémentaire pour trouver plus de résultats", "metiers-patrimoine-theme") . "</p></div>";
$html_template = "<div class='no-results'><img class='no-results__cover' src='" . get_stylesheet_directory_uri() . "/resources/img/illustrations/Homegrade_resultats-filtres-cactus.svg' alt=''/><h3>" . __("Aucun résultat trouvé", "metiers-patrimoine-theme") . "</h3><p>" . __("Essayez d'ajouter un filtre supplémentaire pour trouver plus de résultats", "metiers-patrimoine-theme") . "</p></div>";
}
$response_data = array(
'html_template' => $html_template,
@ -143,4 +143,4 @@ function debugQueryTest()
$newsPostsDatas = new WP_Query($args);
// write_log($newsPostsDatas->posts);
}
debugQueryTest();
// debugQueryTest();

57
resources/css/pages/repertoire-metiers.css
View File

@ -1,13 +1,17 @@
.artisans-posts {
@apply md:flex gap-4 pt-8;
&__grid {
@apply flex flex-col lg:grid grid-cols-1 lg:grid-cols-2 gap-6 w-full h-fit;
.no-results {
@apply col-span-2 text-center pt-4;
&__cover {
@apply w-40 mx-auto;
}
h3 {
@apply text-patrimoine-sante-securite;
@apply text-patrimoine-sante-securite mt-8;
}
p {
@apply text-neutral-900 tracking-wide;
@ -23,6 +27,57 @@
} */
.metier-patrimoine-searchbar {
@apply w-80 lg:w-80 shrink-0 h-fit sticky top-0;
.posts-results-count {
@apply shrink-0;
}
&__results-indications {
@apply flex gap-1 items-center flex-wrap;
.results-count {
@apply font-bold;
}
.posts-results-count {
@apply !my-0;
}
.active-research-indicator {
@apply !flex items-center gap-x-1 gap-y-0 !my-0 relative;
&[is-active='true'] {
@apply block;
}
&[is-active='false'] {
@apply !hidden;
}
/* max-width: -webkit-calc(100% - 40px);
max-width: 90%; */
@apply w-fit;
max-width: calc(100% - 40px);
button {
@apply flex items-center;
@apply border-2 border-solid border-neutral-800 rounded-full px-3 py-2 my-0;
.current-queried-word {
max-width: 200px;
@apply font-bold text-sm;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: fit-content;
}
&:after {
@apply block w-5 h-5 ml-2 shrink-0;
max-width: 100%;
content: '';
background-image: url('../resources/img/graphic-assets/cross-in-cirle-thick.svg');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
}
}
}
h4 {
@apply my-0;
}

10
resources/img/graphic-assets/cross-in-cirle-thick.svg Normal file
View File

@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17">
<g id="Groupe_7735" data-name="Groupe 7735" transform="translate(-0.117)">
<g id="Ellipse_225" data-name="Ellipse 225" transform="translate(0.117)" fill="none" stroke="#000" stroke-width="2">
<circle cx="8.5" cy="8.5" r="8.5" stroke="none"/>
<circle cx="8.5" cy="8.5" r="7.5" fill="none"/>
</g>
<path id="Tracé_3611" data-name="Tracé 3611" d="M-3940.772,6202.736l4.354-4.342" transform="translate(3947.216 -6191.836)" fill="none" stroke="#000" stroke-linecap="round" stroke-width="2"/>
<path id="Tracé_3612" data-name="Tracé 3612" d="M-3936.419,6202.736l-4.354-4.342" transform="translate(3947.216 -6191.836)" fill="none" stroke="#000" stroke-linecap="round" stroke-width="2"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 810 B

149
resources/img/illustrations/Homegrade_resultats-filtres-cactus.svg Normal file
View File

@ -0,0 +1,149 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_19" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 334.65 374.43">
<defs>
<style>
.cls-1 {
fill: url(#Dégradé_sans_nom_103);
}
.cls-2 {
fill: url(#Dégradé_sans_nom_103-3);
}
.cls-3 {
fill: #fff;
}
.cls-3, .cls-4 {
stroke: #000;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2px;
}
.cls-4 {
fill: none;
}
.cls-5 {
fill: #767575;
opacity: .3;
}
.cls-6 {
fill: url(#Dégradé_sans_nom_103-2);
}
</style>
<linearGradient id="Dégradé_sans_nom_103" data-name="Dégradé sans nom 103" x1="-2618.72" y1="1820.56" x2="-2617.51" y2="1819.27" gradientTransform="translate(9437.65 16387.85) scale(3.51 -8.94)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#8b2ff7"/>
<stop offset="1" stop-color="#eb79ff"/>
</linearGradient>
<linearGradient id="Dégradé_sans_nom_103-2" data-name="Dégradé sans nom 103" x1="-2619.42" y1="1820.85" x2="-2618.21" y2="1819.57" gradientTransform="translate(9434.49 16350.29) scale(3.51 -8.92)" xlink:href="#Dégradé_sans_nom_103"/>
<linearGradient id="Dégradé_sans_nom_103-3" data-name="Dégradé sans nom 103" x1="-2622.9" y1="1863.12" x2="-2621.68" y2="1861.84" gradientTransform="translate(9482.04 11427.83) scale(3.52 -6.07)" xlink:href="#Dégradé_sans_nom_103"/>
</defs>
<g>
<path class="cls-5" d="M216.08,359.19c23.85,13.77,62.64,13.7,86.63-.16s24.12-36.25.27-50.02c-23.85-13.77-62.64-13.7-86.63.16-24,13.86-24.12,36.25-.27,50.02Z"/>
<g id="personnage-droite">
<g id="Groupe_64">
<polygon id="Ligne_11" class="cls-3" points="273.14 333.22 273.1 322.24 280.89 322.8 280.92 333.22 273.14 333.22"/>
<path id="Tracé_164" class="cls-3" d="M243.41,315.84c-1.15-11.12-2.3-34.01-3.45-45.13l-6.39-61.55,31.3,11.9c-2.67,28.11-5.35,67.97-8.03,96.07l-13.44-1.3Z"/>
<path id="Tracé_165" class="cls-3" d="M271.68,322.37c-3.48-13.86-6.97-39.48-10.45-53.34-2.93-16.65-5.85-33.29-8.78-49.95h32.63s-3.72,74.53-3.72,74.53c.34,13.41.69,16.25,1.03,29.66l-10.71-.91Z"/>
<polygon id="Ligne_10" class="cls-3" points="252.45 329.5 253.53 317.14 245.17 316.01 245.09 316.82 244.01 330.43 252.45 329.5"/>
<path id="Tracé_168" class="cls-3" d="M283.36,333.07c-.58-1.2-1.61-2.15-2.89-2.7-2.09-.92-5.24-1.88-7.44-.62-.64.37-1.02.82-3.46,6.27-1.99,4.43-2.12,4.97-2,5.77.49,2.75,2.72,4.96,5.65,5.61,2.15.39,3.97-.45,6.93-1.82,1.35-.5,2.58-1.23,3.65-2.14,2.6-2.69.8-7.74-.42-10.37Z"/>
<path id="Tracé_169" class="cls-3" d="M241.07,326.51c-3.35,1.96-7.28,4.99-9.14,9.23-.64,1.46-2.05,4.67-.22,5.69,1.3.72,3.52-.04,11.51-3.03,10.74-4.01,16.47-6.3,16.3-8.21-.02-1.13-.72-2.16-1.81-2.67h-.01c-1.74-.62-4.68.99-7.25,1.34,0,0-1.33.18-9.37-2.35h0Z"/>
<g id="Groupe_60">
<path id="Tracé_174" class="cls-3" d="M219.05,189.09c-1.15,2.29-8.06,15.64-17.06,15.58-.78,0-3.55-.02-4.45-1.62-1.17-2.08,1.21-6.16,6.12-10.54-.82.12-1.64.13-2.46.04-1.02-.11-3.58-.55-3.79-1.28-.26-.9,2.78-3.08,16.26-8.57l5.38,6.4Z"/>
<path id="Tracé_173" class="cls-3" d="M247.7,126.64c-2.65,3.13-5.47,6.9-8.14,11.37-2.7,4.51-4.74,8.9-6.31,12.95-2.59,6.69-6.36,12.84-11.03,18.29-.03.03-.05.06-.08.1-3.75,4.38-7.19,8.68-10.35,12.85,4.6,4.87,3.47,3.67,8.08,8.55,4.25-2.81,7.36-5.34,9.41-7.13,1.23-1.08,2.35-2.22,4.59-4.51,1.38-1.41,2.28-2.35,2.99-3.82.61-1.27.9-2.41,1.05-3.21,3.26-15.15,6.52-30.29,9.79-45.44Z"/>
</g>
<g id="Groupe_61">
<path id="Tracé_177" class="cls-3" d="M244.62,113.45l-.48,11.77c-1.58,2.17-3.82,5.55-5.85,10-6.38,14.03-5.11,26.57-4.65,37.17.47,10.92.38,26.52-2.34,46.44,6.25,3.33,16.52,7.8,29.93,9.46,10.85,1.35,21.48.9,28.56-1.26-5.18-29.79,11.28-91.29-15.01-101.46-3.55-1.7-6.76-2.38-8.96-2.68-.32-3.96-.65-7.92-.97-11.88"/>
</g>
</g>
<g>
<g id="Groupe_65">
<path id="Tracé_185" class="cls-3" d="M242.21,123.21l24.43,14.11v-28.04l-12.21-22.34-12.21,8.24v28.03Z"/>
<path id="Tracé_186" class="cls-3" d="M266.63,137.31l24.43-14.1v-28.03l-24.43,14.1v28.03Z"/>
<path id="Tracé_187" class="cls-3" d="M291.06,95.18l-12.21-22.34-24.43,14.1,12.21,22.34,24.43-14.1Z"/>
</g>
<path id="Tracé_188" class="cls-1" d="M260.23,119.34l-4.28-2.47v-6.77c0-.92.74-1.67,1.66-1.67.29,0,.58.08.84.22h0c1.1.63,1.78,1.81,1.78,3.08v7.61Z"/>
<path id="Tracé_189" class="cls-6" d="M252.11,114.7l-4.28-2.47v-6.72c0-.94.76-1.7,1.7-1.7.3,0,.59.08.85.23h0c1.07.62,1.73,1.76,1.73,3v7.66Z"/>
<path id="Tracé_191" class="cls-2" d="M255.95,125.63l-4.29-2.48v-4.93l4.29,2.48v4.93Z"/>
</g>
</g>
<path id="Tracé_174-2" data-name="Tracé_174" class="cls-3" d="M308.44,203.24c1.75,1.99,12.12,13.57,21.1,11.18.77-.21,3.55-.94,4.03-2.78.63-2.38-2.81-5.85-8.86-8.96.85-.09,1.68-.29,2.47-.6.99-.38,3.44-1.48,3.46-2.26.03-.96-3.58-2.37-18.49-4.37l-3.73,7.79Z"/>
<path class="cls-3" d="M284.29,133.91c.99,2.09,1.95,4.27,2.87,6.54,3.95,9.78,6.28,19.22,7.59,27.89.74,4.88,3.21,9.33,6.92,12.58,2.48,2.17,5.03,4.65,7.56,7.48,2.18,2.43,4.08,4.83,5.74,7.12-2.34,3.85-4.67,7.7-7.01,11.55-6.75-4.95-13.51-9.91-20.26-14.86-2.87-2.11-5.16-4.91-6.65-8.14-1.75-3.8-3.51-7.6-5.26-11.4"/>
<path class="cls-3" d="M274.82,148.29c.16-1.42.81-5.67,4.34-9.21,2.19-2.2,4.57-3.2,5.95-3.66"/>
</g>
<g>
<path class="cls-5" d="M154.46,202.01c-22.54-13.01-59.2-12.95-81.88.15-.89.51-1.73,1.04-2.55,1.58-18.49-2.21-38.53.84-52.94,9.16-22.68,13.1-22.8,34.26-.26,47.28,22.54,13.01,59.2,12.95,81.88-.15.89-.51,1.73-1.04,2.55-1.58,18.49,2.21,38.53-.84,52.94-9.16,22.68-13.1,22.8-34.26.26-47.28Z"/>
<g>
<path class="cls-3" d="M25.08,139.84c0-8.5-5.93-10.11-8.49-9.2-2.56.91-6.66,2.34-6.66,15.85s2.62,31.93,22.6,33.78c19.98,1.84-1.11-19.45-1.11-19.45-6.76-4.32-6.76-8.18-6.35-20.98Z"/>
<path class="cls-3" d="M50.66,110.05c-12.89,0-31.3.19-18.14,125.17h.02c-.06,2.72,1.7,5.46,5.3,7.54,7.08,4.09,18.56,4.09,25.64,0,5.31-3.34,5.32-7.54,5.32-7.54,13.16-124.99-5.25-125.17-18.14-125.17Z"/>
<path class="cls-3" d="M83.02,143.21c-5.9-1.23-7.27,8.02-7.07,22.35,0,3.28-5.63,4.27-9.31,3.86-3.06-.34-7.16,16.17,0,17.4,7.16,1.23,26.2,5.73,26-16.58-.2-22.31-3.73-25.79-9.62-27.02Z"/>
<path class="cls-3" d="M156.39,59.91c0,16.24.25,37.62-.08,43.49-.33,5.87-15.15,6.35-18.9,10.11-8.84,8.86-1.3,18.8,7.03,17.43,8.33-1.37,22.18-7.07,27.38-13.03,7.02-8.29,2.38-38.11,2.38-56.84s-17.81-17.4-17.81-1.16Z"/>
<path class="cls-3" d="M126.08,1c-10.93.2-21.86,9.76-21.86,32.96,0,30.92-.18,159.78,2.15,181.9,0,0,.01,4.64,5.87,8.32,7.82,4.51,20.5,4.51,28.32,0,3.98-2.3,5.92-5.32,5.85-8.32h.02c2.57-34.33,1.51-148.11,1.51-183.44,0-22.45-10.93-31.62-21.86-31.42Z"/>
<path class="cls-3" d="M107.52,118.39c-5.44.6-16.26,2.85-16.26-1.98.17-11.69.28-26.94.28-45.07s-19.6-20.31-19.6-1.28.16,28.48,0,45.69c-.3,32.95,25,26.3,35.58,24.49,10.58-1.81,4.52-22.35,0-21.85Z"/>
</g>
<path class="cls-4" d="M133.17,180.68h4.29"/>
<path class="cls-4" d="M130.13,162.31c1.07-2.06,1.49-4.45,1.18-6.75"/>
<path class="cls-4" d="M132,142.73c1.52-2.94,2.73-6.04,3.59-9.23"/>
<path class="cls-4" d="M129.54,110.82l-.62-1.83"/>
<path class="cls-4" d="M118.49,89.99c-1.41-1.58-2.49-3.46-3.16-5.47"/>
<path class="cls-4" d="M118.49,61.24c1.62-1.85,3.24-3.7,4.86-5.55"/>
<path class="cls-4" d="M134.39,72.25c.82-.61,1.63-1.23,2.45-1.84"/>
<path class="cls-4" d="M140,103.53c.99-2.26,1.97-4.52,2.96-6.79"/>
<path class="cls-4" d="M139.91,44.68c-.15-2.06.05-4.14.61-6.13"/>
<path class="cls-4" d="M133.8,20.78c-.24-1.63-.48-3.26-.72-4.88"/>
<path class="cls-4" d="M112.95,29.36h-1.23"/>
<path class="cls-4" d="M111.84,12.78l-4.41-11.59"/>
<path class="cls-4" d="M108.05,76.53h-1.23"/>
<path class="cls-4" d="M93.31,128.59c.28-1.04.08-2.2-.53-3.08"/>
<path class="cls-4" d="M81.7,113.29c-.59-1.12-.8-2.43-.59-3.68"/>
<path class="cls-4" d="M80.49,88.79l5.52-6.12"/>
<path class="cls-4" d="M89.59,69.77c.39-1.44.77-2.87,1.16-4.31"/>
<path class="cls-4" d="M76.81,67.34h-2.45"/>
<path class="cls-4" d="M55.35,126.65l-4.29.6"/>
<path class="cls-4" d="M42.5,162.91c0,1.43,0,2.86,0,4.29"/>
<path class="cls-4" d="M54.72,205.85l1.22.61"/>
<path class="cls-4" d="M75.58,182.52l2.45,1.23"/>
<path class="cls-4" d="M84.15,165.36c-.1-1.79.59-3.62,1.85-4.9"/>
<path class="cls-4" d="M87.85,173.3l1.84,1.22"/>
<path class="cls-4" d="M57.9,151.97c1.41-1.45,2.82-2.9,4.23-4.35"/>
<path class="cls-4" d="M41.89,146.37l-2.45-1.84"/>
<path class="cls-4" d="M16.89,157.56c-1.48,1.1-3.22,1.86-5.04,2.18"/>
<path class="cls-4" d="M13.02,147.64l-3.04-4.92"/>
<path class="cls-4" d="M21.12,140.29c1.13-1.45,1.95-3.16,2.37-4.95"/>
<path class="cls-4" d="M24.73,172.71c-.82.82-1.63,1.63-2.45,2.45"/>
<path class="cls-4" d="M30.23,189.84c-.61.41-1.23.81-1.84,1.22"/>
<path class="cls-4" d="M33.86,228.32l-3.04,1.29"/>
<path class="cls-4" d="M58.93,236.46c-.62-1.98-.78-4.1-.46-6.15"/>
<path class="cls-4" d="M39.38,218.68c-.59-1.64-1.19-3.28-1.78-4.92"/>
<path class="cls-4" d="M52.3,216.21c.61-1.02,1.23-2.04,1.84-3.06"/>
<path class="cls-4" d="M49.98,184.94c-.2-1.02-.41-2.04-.61-3.06"/>
<path class="cls-4" d="M43.11,199.67l3.68-3.68"/>
<path class="cls-4" d="M60.27,196.62c1.91.11,3.84-.32,5.51-1.25"/>
<path class="cls-4" d="M57.2,165.98c1.23-1.02,2.45-2.04,3.68-3.06"/>
<path class="cls-4" d="M116.68,210.75c.82-.81,1.64-1.63,2.46-2.44"/>
<path class="cls-4" d="M129.53,206.96c1.08.69,2.54.75,3.67.14"/>
<path class="cls-4" d="M156.41,120.69l3.06,2.45"/>
<path class="cls-4" d="M164.57,117.6l1.02-7.38"/>
<path class="cls-4" d="M168.19,95.45c-1.03-1.42-2.07-2.84-3.1-4.26"/>
<path class="cls-4" d="M160.74,77.15l.61-.61"/>
<path class="cls-4" d="M169.33,61.21l-1.89-4.88"/>
<path class="cls-4" d="M173.62,83.3c.61-.41,1.23-.81,1.84-1.22"/>
<path class="cls-4" d="M158.29,59.38h-1.84"/>
<path class="cls-4" d="M107.41,135.97c.41.61.81,1.23,1.22,1.84"/>
<path class="cls-4" d="M89.67,135.96h-5.51"/>
<path class="cls-4" d="M75.55,98.65l-1.22-.62"/>
<path class="cls-4" d="M112.34,161.69l.61.61"/>
<path class="cls-4" d="M121.66,136.02c.8-1.64,1.61-3.28,2.41-4.92"/>
<path class="cls-4" d="M116.02,179.39c1.63.23,3.26.46,4.89.68"/>
<path class="cls-4" d="M123.37,188.64v6.13"/>
<path class="cls-4" d="M124.55,222.45c2.18.75,4.48,1.13,6.78,1.12"/>
</g>
<g>
<path class="cls-3" d="M157.11,343.87c1.35-4.92,4.93-9.17,9.55-11.33.98-.46,2.08-.83,3.13-.55.94.25,1.67.99,2.32,1.72,6.21,6.9,10.49,15.51,12.25,24.62.51,2.66.49,6.04-1.89,7.33-1.93,1.04-4.29.06-6.22-.97-11.26-6.01-21.54-13.84-30.33-23.09-1.32-1.39-2.65-2.87-3.23-4.7-1.13-3.54.83-7.35,3.37-10.06,6.22-6.63,16.47-9.12,25.04-6.11s14.99,11.38,15.69,20.44c.07.9.07,1.88-.44,2.62-.58.85-1.66,1.17-2.66,1.44-10.82,2.88-21.63,5.77-32.45,8.65-2.27.6-4.59,1.23-6.5,2.6-1.91,1.37-3.34,3.65-3.03,5.97.16,1.23.79,2.36,1.54,3.35,3.16,4.26,8.41,6.58,13.65,7.36,9.25,1.38,20.08-2.68,23.16-11.51,1.44-4.13,1.02-8.68.13-12.96-2.33-11.25-7.83-21.82-15.71-30.19-2.05-2.18-4.72-4.36-7.67-3.89-2.91.46-4.78,3.31-5.92,6.03-1.91,4.61-2.75,9.95-.82,14.55,2.79,6.64,10.38,9.82,17.45,11.14,9.8,1.83,20.03,1.35,29.62-1.4,3.04-.87,6.27-2.18,7.77-4.96,1.52-2.81.75-6.44-1.15-9s-4.74-4.26-7.6-5.69c-3.1,11.99-5.26,24.23-6.45,36.55-.34,3.5-1.03,7.64-4.22,9.1-1.81.82-3.91.5-5.84.04-14.18-3.38-26.67-13.27-33.21-26.3-1.93-3.84-3.38-8.29-2.14-12.41.77-2.56,2.53-4.75,4.61-6.43,5.37-4.35,12.85-5.56,19.63-4.21,6.78,1.35,12.91,5.02,18.18,9.49,4.49,3.81,8.54,8.36,10.67,13.85s2.13,12.03-1.04,16.99c-4.36-16.91-7.69-34.09-9.94-51.41-.58-4.41-1.14-9.01-3.57-12.74-2.43-3.73-7.34-6.26-11.42-4.49-2.42,1.05-4.04,3.33-5.4,5.59-5.87,9.7-9.2,20.91-9.59,32.24-.07,2.17,0,4.47,1.12,6.33,1.75,2.88,5.46,3.81,8.8,4.21,13.29,1.6,27.07-1.12,38.76-7.65,2.64-1.47,5.33-3.33,6.38-6.16-5.46-1.06-10.97,1.44-15.67,4.42-14.09,8.93-25.01,22.72-40.27,29.45-2.16.95-4.57,1.76-6.84,1.11-1.62-.47-2.94-1.63-4.02-2.92-6.04-7.25-4.74-18.85,1.44-25.99,6.18-7.13,16.09-10.19,25.52-9.98,3.69.08,7.95.99,9.62,4.28,1.59,3.12.06,6.95-2.1,9.7-3.53,4.49-8.62,7.5-13.88,9.7-7.01,2.93-14.54,4.61-22.12,4.93-4.41.19-9.49-.42-12.01-4.04-2.49-3.57-1.36-8.48.36-12.48,6.28-14.57,19.64-25.88,35.03-29.7,5.61-1.39,11.6-1.81,17.11-.09,5.51,1.73,10.47,5.86,12.17,11.38,1.62,5.24.2,10.89-1.21,16.19,5.06-1.73,9.26-5.82,11.13-10.83.98-2.64,1.32-5.64.25-8.25-1.82-4.4-7.32-6.38-11.99-5.49s-8.61,4.02-11.93,7.42c-4.19,4.28-7.75,9.17-10.55,14.46-1.01,1.9-1.94,4.07-1.36,6.15.74,2.66,3.62,4.06,6.28,4.82,9.38,2.71,19.83,1.52,28.37-3.22-10.16,2.58-19.37,8.74-25.62,17.15-.63.84-1.25,1.88-.92,2.88.54,1.61,2.86,1.49,4.47.93,11.96-4.13,21.43-14.78,24.16-27.13,1.07-4.87.93-10.56-2.57-14.12-2.87-2.92-7.43-3.66-11.44-2.83s-7.59,3.03-10.98,5.34c-8.82,6.01-16.93,13.05-24.13,20.92-4.41,4.83-8.55,10.1-10.78,16.26,13.23-8.12,23.4-21.12,28.1-35.92,1.25-3.94,1.92-8.79-.98-11.73-2.92-2.96-7.87-2.3-11.7-.68-6.85,2.9-12.62,8.28-15.99,14.91-1.36,2.67-1.97,6.63.66,8.06,1.04.57,2.3.51,3.48.4,7.6-.74,15.01-3.32,21.42-7.47,3.92-2.54,7.84-6.63,6.9-11.2-.58-2.84-3.01-5.04-5.74-6-2.73-.97-5.72-.87-8.59-.48-14.67,2.01-28.52,13-31.01,27.6-.61,3.58-.5,7.48,1.41,10.57,1.3,2.11,3.34,3.67,5.52,4.84,8.59,4.58,20.07,2.9,26.99-3.95,6.92-6.85,8.71-18.32,4.22-26.95-1.1-2.12-2.59-4.11-4.63-5.36-2.81-1.72-6.32-1.83-9.6-1.47-17.48,1.92-31.57,15.36-41.39,29.95-1.81,2.69-3.29,6.86-.61,8.69,1.42.97,3.34.65,4.99.16,11.52-3.42,20.83-13.4,23.44-25.13,1.32-5.95,1.02-12.13,1.78-18.18.18-1.45.55-3.08,1.82-3.8,1.55-.88,3.46.11,4.95,1.1,12.98,8.63,24.91,18.83,35.46,30.31,5.5,5.99,10.93,13.33,9.96,21.4-.31,2.55-1.33,5.1-3.27,6.78-1.96,1.7-4.62,2.34-7.19,2.69-15.57,2.17-31.02-3.81-45.43-10.07-9.81-4.26-19.76-8.86-27.42-16.32-1.9-1.85-3.75-4.14-3.72-6.79.03-2.16,1.31-4.09,2.63-5.79,8.24-10.58,20.4-18.05,33.56-20.61,4.96-.96,10.2-1.24,14.98.41s9.01,5.5,10.06,10.44c1.21,5.72-1.94,11.47-5.72,15.93-3.91,4.63-9.14,8.78-15.2,8.94-1.5.04-3.1-.21-4.24-1.19-1.3-1.11-1.74-2.92-1.96-4.62-1.28-9.88,2.48-19.9,8.31-27.98,5.83-8.08,13.6-14.53,21.36-20.78-2.19,11.43-6.87,22.38-13.63,31.86.61-3.36,2.15-6.55,4.41-9.11.25,1.51-.29,3.12-1.41,4.17"/>
<path class="cls-4" d="M160.09,280.39c-27.61-4.4-57.25,9.97-70.87,34.39"/>
<path class="cls-4" d="M215.63,306.99c4.59,2.29,5.81,8.17,6.5,13.26.89,6.59,1.72,13.63-1.18,19.62"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

91
resources/js/dynamicSearch.js
View File

@ -22,6 +22,40 @@ function formatFormDataArray(formData) {
return formObjectDatas;
}
function observeSearchResetButton() {
const currentSearchWordQueryButton =
document.querySelector('.active-research-indicator');
const searchInput =
document.querySelector('#search-input');
currentSearchWordQueryButton.addEventListener(
'click',
resetTextualSearch
);
searchInput.addEventListener('input', (event) => {
console.log(event);
if (event.target.value === '') {
resetTextualSearch();
}
});
}
function resetTextualSearch() {
const searchInput =
document.querySelector('#search-input');
searchInput.value = '';
hydrateWithAllArtisans({});
const currentSearchWordQueryButton =
document.querySelector('.active-research-indicator');
currentSearchWordQueryButton.setAttribute(
'is-active',
'false'
);
}
function formatSearchDataArray(formData) {
let formObjectDatas = {};
@ -50,7 +84,6 @@ async function hydrateFields(formObjectDatas) {
.getAttribute('current-language');
const taxonomy = formObjectDatas.search_by;
const localisation = formObjectDatas.localisation ?? null;
console.log(`localisation : ${localisation}`);
const taxonomyIds =
taxonomy === 'metiers'
@ -62,16 +95,37 @@ async function hydrateFields(formObjectDatas) {
);
const artisansDatas = await response.json();
// console.log(artisansDatas);
const artisansGrid = document.querySelector(
'.artisans-posts__grid'
);
artisansGrid.innerHTML = artisansDatas.html_template;
const postResultsLiveDiv = document.querySelector(
'.posts-results-count .results-count'
);
postResultsLiveDiv.innerHTML =
artisansDatas.total_posts_found.toString();
}
async function hydrateWithAllArtisans() {
const currentLanguage = document
.querySelector('body')
.getAttribute('current-language');
const response = await fetch(
`/wp-json/metiers-patrimoine-datas/v1/build/artisans?current-page-language=${currentLanguage}`
);
const artisansDatas = await response.json();
const artisansGrid = document.querySelector(
'.artisans-posts__grid'
);
artisansGrid.innerHTML = artisansDatas.html_template;
// brochureRows.setAttribute(
// 'current-post-count',
// brochuresDatas.total_posts_found
// );
const postResultsLiveDiv = document.querySelector(
'.posts-results-count .results-count'
);
postResultsLiveDiv.innerHTML =
artisansDatas.total_posts_found.toString();
}
async function hydrateSearch(searchValue) {
@ -84,17 +138,27 @@ async function hydrateSearch(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
const postResultsAriaLiveDiv = document.querySelector(
'.posts-results-count .results-count'
);
postResultsAriaLiveDiv.innerHTML =
searchArtisansDatas.total_posts_found.toString();
const currentQueriedWordAriaLiveDiv =
document.querySelector('.current-queried-word');
const activeSearchIndicator = document.querySelector(
'.active-research-indicator'
);
currentQueriedWordAriaLiveDiv.innerHTML = searchValue;
activeSearchIndicator.setAttribute('is-active', 'true');
}
function handleHierarchicalTaxonomyCheckboxRelation(e) {
@ -207,14 +271,12 @@ function handleSearchSubmit(e) {
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'
);
@ -245,4 +307,5 @@ export default function dynamicSearch() {
);
searchForm.addEventListener('submit', handleSearchSubmit);
observeSearchResetButton();
}

9
template-repertoire-des-metiers.php
View File

@ -47,11 +47,15 @@ $pageIcon = get_field('page_icon', get_queried_object_id()) ?? null;
<section class="artisans-posts">
<aside class="metier-patrimoine-searchbar">
<div class="metier-patrimoine-searchbar__results-indications">
<p class="metier-patrimoine-searchbar__posts-results-amount" role="status" aria-live="polite">
<span class="results-amount">
<p class="posts-results-count" role="status" aria-live="polite">
<span class="results-count">
4 </span>
<span class="results-text">résultat(s) </span>
</p>
<div class="active-research-indicator" is-active="false">
pour
<button> <span class="current-queried-word"> </span> </button>
</div>
</div>
@ -193,7 +197,6 @@ $pageIcon = get_field('page_icon', get_queried_object_id()) ?? null;
<?php
$suggestArtisanPageId = 309;
$suggestArtisanPageIcon = get_field('page_icon', $suggestArtisanPageId) ?? null;
?>
<a class="card-suggest-artisan card block" href="<?php echo get_the_permalink($suggestArtisanPageId) ?>">