https://www.avignon-grand-hotel.com/res/js/template/blog/articles/search/ui.js?q=1788504730893

1var initBlogArticlesSearch = async function() {
2	const articles = document.querySelectorAll('#articles-list .article-item')
3	const loadMoreBtn = document.getElementById('load-more')
4
5	let visible = 12
6	let query = ''
7
8	const updateArticles = () => {
9		const isSearching = query !== ''
10
11		let matchingArticlesCount = 0
12
13		articles.forEach(article => {
14			const title = article.dataset.title || ''
15			const categories = article.dataset.categories || ''
16			const content = article.dataset.content || ''
17
18			const matchesSearch =
19				title.includes(query) ||
20				categories.includes(query) ||
21				content.includes(query)
22
23			if (isSearching) {
24				article.classList.toggle('hidden', !matchesSearch)
25
26				return
27			}
28
29			article.classList.toggle(
30				'hidden',
31				matchingArticlesCount >= visible
32			)
33
34			matchingArticlesCount++
35		})
36
37		if (loadMoreBtn) {
38			loadMoreBtn.classList.toggle(
39				'hidden',
40				isSearching || visible >= articles.length
41			)
42		}
43	}
44
45	const searchInput = () => {
46		const input = document.getElementById('search-articles')
47
48		if (input) {
49			input.addEventListener('input', () => {
50				query = input.value.toLowerCase().trim()
51
52				updateArticles()
53			})
54		}
55	}
56
57	const dropDown = () => {
58		const dropDown = document.querySelector('.dropdown')
59		const dropDownSvg = document.querySelector('.dropdown svg')
60		const dropdownMenu = document.querySelector('.dropdown-menu')
61
62		if (dropDown && dropdownMenu) {
63			dropDown.addEventListener('click', () => {
64				dropdownMenu.classList.toggle('open')
65				dropDownSvg?.classList.toggle('rotate-180')
66			})
67		}
68	}
69
70	const loadMore = () => {
71		if (loadMoreBtn) {
72			loadMoreBtn.addEventListener('click', () => {
73				visible += 12
74
75				updateArticles()
76			})
77		}
78	}
79
80	searchInput()
81	dropDown()
82	loadMore()
83	updateArticles()
84}