|
|
Line 1: |
Line 1: |
| $(document).ready(function () { | | $(document).ready(function () { |
| var communityFeatured = $('#community-featured'); | | var communityFeatured = $('#community-featured'); |
| var filteredCards = $('.filtered-list-item'); | | var filteredListItems = $('.filtered-list-item'); |
| var showArticleWrapper = $('#show-article-wrapper'); | | var showArticleWrapper = $('#show-article-wrapper'); |
| var list = $('#list');
| | var listLists = [$('#list'), $('#list-list'), $('#list-list-1'), $('#list-list-2'), $('#list-list-3')]; |
| var listList = $('#list-list');
| | var originalWidths = listLists.map(list => list.width()); |
| var filteredListItems = $('#list .filtered-list-item'); // Selecting filtered-list-items in #list
| |
| var listLists = [$('#list'), $('#list-list'), $('#list-list-1'), $('#list-list-2'), $('#list-list-3')]; // Store jQuery objects in an array | |
| var originalWidths = listLists.map(function(list) {
| |
| return list.width();
| |
| });
| |
|
| |
| // Insert the community featured element after the second card
| |
| if (communityFeatured.length && filteredCards.length >= 2) {
| |
| communityFeatured.detach();
| |
| filteredCards.eq(1).after(communityFeatured);
| |
| communityFeatured.show();
| |
| }
| |
| | |
| // Setup images in original Entry pages
| |
| if ($('#show-article-wrapper-entry').length > 0 || $('#show-article-wrapper').length > 0) {
| |
| var images = []; // Initialize an empty array to store the images
| |
| $('.article-images .image-container').each(function() {
| |
| var img = $(this).find('img');
| |
| var captionDiv = $(this).find('div[class^="caption-image"]');
| |
| var image = {
| |
| src: img.attr('src'),
| |
| alt: img.attr('alt'),
| |
| caption: captionDiv.text(),
| |
| captionClass: captionDiv.attr('class')
| |
| };
| |
| images.push(image); // Add the image object to the images array
| |
| });
| |
|
| |
|
| if (images.length > 0) { | | // Detach and reattach the community featured element based on the page layout |
| setupImageToggle(images); // Call the setupImageToggle function with the images array | | function adjustCommunityFeaturedPlacement() { |
| updateImageLabel(1, images.length); // Set the label for the first image immediately
| | if (filteredListItems.length >= 2) { |
| | communityFeatured.detach().insertAfter(filteredListItems.eq(1)).show(); |
| } | | } |
| } | | } |
|
| |
| // FILTERS
| |
| $('#list, #list-list').on('mousedown', '.filtered-value-option', function(event) {
| |
| console.log("Filter clicked within context:", this);
| |
|
| |
| if ($(this).closest('#list').length) {
| |
| console.log("Context: #list");
| |
| console.log("Before hiding, Community Featured display:", communityFeatured.css('display'));
| |
| console.log("After hiding, Community Featured display:", communityFeatured.css('display'));
| |
| } else if ($(this).closest('#list-list').length) {
| |
| console.log("Context: #list-list");
| |
| console.log("Before hiding, Community List Featured display:", communityFeatured.css('display'));
| |
| console.log("After hiding, Community List Featured display:", communityFeatured.css('display'));
| |
| }
| |
|
| |
| // Additional debugging: Check the event target and its parents
| |
| console.log("Event target:", event.target);
| |
| console.log("Parents of event target:", $(event.target).parents());
| |
| });
| |
|
| |
|
| //cleaned uppppppppppppppppppp | | // Setup image toggle for articles with multiple images |
| $('#list, #list-list').on('mousedown', '.filtered-value-option', function(event) { | | function setupArticleImageToggle() { |
| // Determine the context based on whether the clicked element is within #list or #list-list
| | if ($('#show-article-wrapper-entry').length || $('#show-article-wrapper').length) { |
| var context = $(this).closest('#list').length ? '#list' : '#list-list';
| | var images = $('.article-images .image-container img').map(function () { |
|
| | return { |
| // Call a function to update the visibility of communityFeatured based on the active filters within the context
| | src: $(this).attr('src'), |
| updateCommunityFeaturedVisibility(context);
| | alt: $(this).attr('alt'), |
| });
| | caption: $(this).next('div').text(), |
|
| | captionClass: $(this).next('div').attr('class') |
| function updateCommunityFeaturedVisibility(context) {
| | }; |
| // Check if there are any checked filters within the given context
| | }).get(); |
| var checkedFilters = $(context + ' .filtered-value-option input[type="checkbox"]:checked').length;
| |
|
| |
| // Show or hide communityFeatured based on whether there are checked filters
| |
| if (checkedFilters === 0) {
| |
| communityFeatured.show();
| |
| } else {
| |
| communityFeatured.hide(); | |
| }
| |
| }// end of cleaned uppppppppppppppppppp
| |
|
| |
|
| |
|
| // Format paragraphs
| | if (images.length > 0) { |
| function formatParagraphs(text) {
| | setupImageToggle(images); |
| var paragraphs = text.split('\n').filter(function (p) { return p.trim() !== '' });
| | updateImageLabel(1, images.length); |
| return paragraphs.map(function (p) { return '<p>' + p.trim() + '</p>'; }).join('');
| |
| }
| |
|
| |
| // Format community card, when in the Community Entries page
| |
| if ($('.community-card').length) {
| |
| formatCommunityCardDescriptions();
| |
| }
| |
| | |
| function formatCommunityCardDescriptions() {
| |
| console.log("Formatting community card descriptions");
| |
| $('.community-card').each(function() {
| |
| console.log("Processing a community card");
| |
|
| |
| // Format paragraphs in community-description
| |
| var descriptionContainer = $(this).find('.community-description');
| |
| var rawDescription = descriptionContainer.text();
| |
| var formattedDescription = formatParagraphs(rawDescription);
| |
| descriptionContainer.html(formattedDescription);
| |
|
| |
| // Remove empty elements in the entire card
| |
| $(this).find('*').each(function() {
| |
| if ($(this).is(':empty') || $(this).html().trim() === '<br>') {
| |
| $(this).remove();
| |
| }
| |
| });
| |
|
| |
| console.log("Formatted Community Card HTML:", $(this).html());
| |
| });
| |
| }
| |
| | |
| var toggleButton = $('.toggle-filters');
| |
| var filtersDiv = $('.filtered-filters');
| |
| | |
| // Open and Close button for filters
| |
| if (toggleButton.length && filtersDiv.length) {
| |
| toggleButton.on('click', function(event) {
| |
| event.preventDefault();
| |
| console.log("Button clicked. Current display style:", filtersDiv.css('display'));
| |
| | |
| if (filtersDiv.css('display') === 'none' || filtersDiv.css('display') === '') {
| |
| filtersDiv.attr('style', 'display: flex !important'); | |
| toggleButton.text('[Close]'); | |
| console.log("Filters shown.");
| |
| } else {
| |
| filtersDiv.attr('style', 'display: none !important');
| |
| toggleButton.text('[Open]');
| |
| console.log("Filters hidden.");
| |
| } | | } |
| }); | | } |
| } | | } |
|
| |
| /* // Function to check if filters are cleared and update visibility of community elements
| |
| function checkFiltersCleared(selector, communityElement) {
| |
| var checkedFilters = $(selector + ' .filtered-value-option input[type="checkbox"]:checked');
| |
| console.log("Checked filters count in " + selector + ":", checkedFilters.length);
| |
|
| |
| if (checkedFilters.length === 0) {
| |
| console.log("All filters are cleared in " + selector);
| |
| communityElement.show();
| |
| } else {
| |
| console.log("Some filters are still active in " + selector);
| |
| communityElement.hide(); // Hide the element if any filters are active
| |
| }
| |
| } */
| |
| | |
| /* // Event delegation for filter changes in both block and list views
| |
| $('#list, #list-list').on('change', '.filtered-value-option input[type="checkbox"]', function() {
| |
| // Determine the closest list or list-list element to identify the context
| |
| var closestContext = $(this).closest('#list, #list-list');
| |
| var contextId = closestContext.attr('id'); // Get the id ('list' or 'list-list')
| |
|
| |
|
| // Call the checkFiltersCleared function with the appropriate context and communityFeatured element
| | // Handle filter clicks and update community featured visibility |
| checkFiltersCleared('#' + contextId, communityFeatured); | | $('#list, #list-list').on('mousedown', '.filtered-value-option', function() { |
| | updateCommunityFeaturedVisibility($(this).closest('#list, #list-list').attr('id')); |
| }); | | }); |
|
| |
|
| // Initial checks | | function updateCommunityFeaturedVisibility(contextId) { |
| var selectors = ['#list', '#list-list'];
| | var contextSelector = '#' + contextId; |
| | var hasActiveFilters = $(contextSelector + ' .filtered-value-option input[type="checkbox"]:checked').length > 0; |
| | communityFeatured.toggle(!hasActiveFilters); |
| | } |
|
| |
|
| // Iterate over the selectors and perform initial checks | | // Function to open and adjust modal views |
| selectors.forEach(function(selector) { | | function openModal(cardElement, event) { |
| checkFiltersCleared(selector, communityFeatured); | | event.stopPropagation(); |
| }); */
| | showArticleWrapper.show(); |
| | | $.each(listLists, (index, list) => list.css('width', '60%')); |
| // simplify
| | filteredListItems.css('width', 'calc(33.333% - 0px)'); |
| // Event delegation for filter changes in both block and list views
| | communityFeatured.hide(); |
| $('#list, #list-list').on('change', '.filtered-value-option input[type="checkbox"]', function() {
| | $('#article-title, #article-content').empty(); |
| // Call the new function to update the visibility of communityFeatured based on current filters
| | populateModalContent(cardElement); |
| updateCommunityFeaturedVisibility();
| | } |
| });
| |
| | |
| // Perform initial check on page load or when the script is initially run
| |
| updateCommunityFeaturedVisibility();
| |
| | |
| | |
| // Function to check if all filters are cleared and return boolean
| |
| function areFiltersCleared(selector) {
| |
| var checkedFilters = $(selector + ' .filtered-value-option input[type="checkbox"]:checked');
| |
| return checkedFilters.length === 0;
| |
| }
| |
|
| |
| // Function to open the modal and adjust the list
| |
| function openModal(cardElement, event) {
| |
| event.stopPropagation(); // Prevent the event from bubbling up
| |
| console.log('openModal called with:', cardElement);
| |
| var isRelatedArticle = $(cardElement).hasClass('related-article');
| |
| console.log('Is this a related article?:', isRelatedArticle);
| |
| showArticleWrapper.css('display', 'block');
| |
|
| |
|
| // Set new width using .each() to iterate over the jQuery objects
| | // Populate modal content based on the card element |
| $.each(listLists, function(index, list) {
| | function populateModalContent(cardElement) { |
| list.css('cssText', 'width: 60% !important;');
| | if (isRelatedArticle) { |
| });
| |
| // Adjust width of filtered-list-items in #list | |
| filteredListItems.css('width', 'calc(33.333% - 0px)');
| |
|
| |
| // Hide communityFeatured
| |
| communityFeatured.hide();
| |
|
| |
| // Clear existing content in modal
| |
| $('#article-title').empty();
| |
| $('#article-content').empty();
| |
|
| |
| if (isRelatedArticle) {
| |
| // Handle card elements (existing logic) | | // Handle card elements (existing logic) |
| var cardImages = []; | | var cardImages = []; |
Line 381: |
Line 232: |
| $('#list, #list-list, #list-list-1, #list-list-2, #list-list-3, #list-block-1, #list-block-2, #list-block-3').addClass('fade-out'); | | $('#list, #list-list, #list-list-1, #list-list-2, #list-list-3, #list-block-1, #list-block-2, #list-block-3').addClass('fade-out'); |
| // End of openModal | | // End of openModal |
| }
| | } |
| | |
| | // Close modal function |
| | function closeModal() { |
| | showArticleWrapper.hide(); |
| | $.each(listLists, (index, list) => list.width(originalWidths[index])); |
| | filteredListItems.css('width', 'calc(20% - 0px)'); |
| | communityFeatured.toggle(areFiltersCleared('#list') && areFiltersCleared('#list-list')); |
| | } |
|
| |
|
| // Function to check if all filters are cleared in block view
| | // Check if filters are cleared in a given context |
| function checkBlockFiltersCleared() {
| | function areFiltersCleared(selector) { |
| var checkedFilters = $('#list .filtered-value-option input[type="checkbox"]:checked');
| | return $(selector + ' .filtered-value-option input[type="checkbox"]:checked').length === 0; |
| console.log("Checked filters count:", checkedFilters.length);
| | } |
|
| | |
| if (checkedFilters.length === 0) {
| | // Initial setup calls |
| console.log("All filters are cleared in block view");
| | adjustCommunityFeaturedPlacement(); |
| communityFeatured.show();
| | setupArticleImageToggle(); |
| } else {
| | |
| console.log("Some filters are still active in block view");
| | // Event bindings for modal interactions |
| }
| | $('#list, #list-list, #list-list-1, #list-list-2, #list-list-3, #list-block-1, #list-block-2, #list-block-3').on('mousedown', '.card, .list-card', function(event) { |
| }
| | openModal(this, event); |
|
| | }); |
| // Function to check if all filters are cleared in list view
| | |
| function checkListFiltersCleared() {
| | $('#show-article-wrapper').on('mousedown', '.related-article', function(event) { |
| var checkedFilters = $('#list-list .filtered-value-option input[type="checkbox"]:checked');
| | openModal(this, event); |
| console.log("Checked filters count:", checkedFilters.length);
| | }); |
|
| |
| if (checkedFilters.length === 0) {
| |
| console.log("All filters are cleared in list view");
| |
| communityFeatured.show();
| |
| } else {
| |
| console.log("Some filters are still active in list view");
| |
| }
| |
| }
| |
|
| |
| // closeModal function
| |
| function closeModal() {
| |
| showArticleWrapper.hide();
| |
|
| |
|
| // Revert width of filtered-list-items in listLists
| | $('#close-button').on('click', closeModal); |
| $.each(listLists, function(index, list) {
| | $(document).on('mousedown', function (event) { |
| list.width(originalWidths[index]);
| | if (!showArticleWrapper.is(event.target) && showArticleWrapper.has(event.target).length === 0) { |
| });
| | closeModal(); |
| // Revert width of filtered-list-items in #list
| | } |
| filteredListItems.css('width', 'calc(20% - 0px)');
| | }); |
|
| |
| // Check if filters are cleared before showing the featured content
| |
| checkBlockFiltersCleared();
| |
| checkListFiltersCleared();
| |
| }
| |
|
| |
|
| // Button to open [Nr.s] | | // Button to open [Nr.s] |