https://www.techniques-ingenieur.fr/assets/controllers/search/advanced-panel_controller-B8xW1Tm.js

1import {Controller} from '@hotwired/stimulus';
2
3/**
4 * Panneau latéral de recherche avancée : ouverture / fermeture (desktop + mobile)
5 * et remise à zéro du formulaire.
6 *
7 * Fusionne les deux blocs « Gestion du panneau de recherche avancée » de l'ancien search.js.
8 */
9/* stimulusFetch: 'lazy' */
10export default class extends Controller {
11    static targets = ['sidebar', 'form'];
12
13    connect() {
14        this.container = document.querySelector('body > .container');
15    }
16
17    open() {
18        this.sidebarTarget.classList.add('open');
19
20        if (window.innerWidth < 768) {
21            document.body.style.overflowY = 'hidden';
22            // Referme le tiroir facettes s'il était ouvert.
23            document.getElementById('facets')?.classList.remove('open');
24        }
25
26        this.container?.classList.add('z-index-adjusted');
27    }
28
29    close() {
30        this.sidebarTarget.classList.remove('open');
31
32        if (window.innerWidth < 768) {
33            document.body.style.overflowY = 'visible';
34        }
35
36        setTimeout(() => this.container?.classList.remove('z-index-adjusted'), 500);
37    }
38
39    reset() {
40        const form = this.formTarget;
41        form.reset();
42        form.querySelectorAll('input[type="text"]').forEach((i) => (i.value = ''));
43        form.querySelectorAll('input[type="date"]').forEach((i) => (i.value = ''));
44        form.querySelectorAll('input[type="checkbox"]').forEach((c) => (c.checked = false));
45        form.querySelectorAll('select').forEach((s) => (s.selectedIndex = 0));
46    }
47}