Blog Suche

import wixBlogFrontend from 'wix-blog-frontend'; import wixWindow from 'wix-window'; $w.onReady(async function () { // IDs deiner Elemente (im Editor anpassen) const categoryDropdownId = '#categoryDropdown'; const authorDropdownId = '#authorDropdown'; const yearDropdownId = '#yearDropdown'; // NEU const tagsDropdownId = '#tagsDropdown'; // NEU const blogPostsContainerId = '#blogPostsRepeater'; const selectedFiltersDisplayId = '#selectedFiltersDisplay'; // NEU const searchResultsCountId = '#searchResultsCount'; // NEU let allBlogPosts = []; // Funktion zum Anzeigen der ausgewählten Filter function displaySelectedFilters(selectedCategory, selectedAuthorName, selectedYear, selectedTag) { let filtersText = "Aktive Filter: "; const filters = []; if (selectedCategory) filters.push(`Kategorie: ${selectedCategory}`); if (selectedAuthorName) filters.push(`Autor: ${selectedAuthorName}`); if (selectedYear) filters.push(`Jahr: ${selectedYear}`); if (selectedTag) filters.push(`Tag: ${selectedTag}`); if (filters.length > 0) { filtersText += filters.join(', '); } else { filtersText = "Keine Filter aktiv"; } $w(selectedFiltersDisplayId).text = filtersText; } // Funktion zum Anzeigen der Anzahl der Suchtreffer function displaySearchResultsCount(count) { $w(searchResultsCountId).text = `${count} Blogbeiträge gefunden`; } async function displayBlogPosts(filteredPosts = allBlogPosts) { $w(blogPostsContainerId).data = filteredPosts.map(post => { return { _id: post.id, title: post.title, excerpt: post.excerpt, coverImage: post.coverImage.url, postUrl: post.postPageUrl, authorName: post.author.nickname, categoryNames: post.categories.map(cat => cat.name).join(', '), tags: post.tags.join(', ') // Für Anzeige der Tags // Füge hier weitere Felder hinzu, die du im Repeater/Gallery anzeigen möchtest }; }); displaySearchResultsCount(filteredPosts.length); // Anzeige der Anzahl } async function fetchBlogPosts() { try { const result = await wixBlogFrontend.queryPosts().find(); allBlogPosts = result.items; displayBlogPosts(); populateFilters(); } catch (error) { console.error("Fehler beim Abrufen der Blogbeiträge:", error); wixWindow.alert("Es gab einen Fehler beim Laden der Blogbeiträge."); } } async function populateFilters() { // Kategorien try { const categoryResults = await wixBlogFrontend.queryCategories().find(); const categories = categoryResults.items.map(cat => ({ label: cat.name, value: cat.name })); $w(categoryDropdownId).options = [{ label: 'Alle Kategorien', value: '' }, ...categories]; } catch (error) { console.error("Fehler beim Abrufen der Kategorien:", error); } // Autoren try { const authorResults = await wixBlogFrontend.queryAuthors().find(); const authors = authorResults.items.map(author => ({ label: author.nickname, value: author.id })); $w(authorDropdownId).options = [{ label: 'Alle Autoren', value: '' }, ...authors]; } catch (error) { console.error("Fehler beim Abrufen der Autoren:", error); } // Jahre (aus den Blogbeiträgen extrahieren) const years = [...new Set(allBlogPosts.map(post => new Date(post.publishedAt).getFullYear()))].sort((a, b) => b - a); // Absteigend sortieren const yearOptions = years.map(year => ({ label: year.toString(), value: year.toString() })); $w(yearDropdownId).options = [{ label: 'Alle Jahre', value: '' }, ...yearOptions]; // Tags (aus den Blogbeiträgen extrahieren) const allTags = allBlogPosts.reduce((tags, post) => tags.concat(post.tags), []); const uniqueTags = [...new Set(allTags)].sort(); const tagOptions = uniqueTags.map(tag => ({ label: tag, value: tag })); $w(tagsDropdownId).options = [{ label: 'Alle Tags', value: '' }, ...tagOptions]; } function filterBlogPosts() { const selectedCategory = $w(categoryDropdownId).value; const selectedAuthorId = $w(authorDropdownId).value; const selectedYear = $w(yearDropdownId).value; const selectedTag = $w(tagsDropdownId).value; const selectedAuthorName = $w(authorDropdownId).options.find(option => option.value === selectedAuthorId)?.label; const filteredPosts = allBlogPosts.filter(post => { const categoryMatch = !selectedCategory || post.categories.some(cat => cat.name === selectedCategory); const authorMatch = !selectedAuthorId || post.author.id === selectedAuthorId; const yearMatch = !selectedYear || new Date(post.publishedAt).getFullYear().toString() === selectedYear; const tagMatch = !selectedTag || post.tags.includes(selectedTag); return categoryMatch && authorMatch && yearMatch && tagMatch; }); displayBlogPosts(filteredPosts); displaySelectedFilters(selectedCategory, selectedAuthorName, selectedYear, selectedTag); // Anzeige der Filter } $w(categoryDropdownId).onChange(() => filterBlogPosts()); $w(authorDropdownId).onChange(() => filterBlogPosts()); $w(yearDropdownId).onChange(() => filterBlogPosts()); $w(tagsDropdownId).onChange(() => filterBlogPosts()); fetchBlogPosts(); });