4,090
edits
No edit summary Tags: Manual revert Reverted |
No edit summary Tags: Manual revert Reverted |
||
Line 1: | Line 1: | ||
$(document).ready(function() { | $(document).ready(function () { | ||
var areFiltersActive = false; | |||
var | var filteredCards = $('.filtered-list-item'); | ||
var showArticleWrapper = $('#show-article-wrapper'); | var showArticleWrapper = $('#show-article-wrapper'); | ||
var | var list = $('#list'); | ||
var | var listList = $('#list-list'); | ||
var | var filteredListItems = $('#list .filtered-list-item, #list-block-1 .filtered-list-item, #list-block-2 .filtered-list-item, #list-block-3 .filtered-list-item'); | ||
var listLists = [$('#list'), $('#list-block-1'), $('#list-block-2'), $('#list-block-3'), $('#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(); | |||
}); | |||
// Check if the specific element exists on the page | |||
if ($('#show-article-wrapper-entry').length > 0 || $('#show-article-wrapper').length > 0) { | |||
var images = []; // Initialize an empty array to store the images | |||
$.each( | // Find all image containers within the article content and extract the necessary information | ||
$('. | $('.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) { | |||
setupImageToggle(images); // Call the setupImageToggle function with the images array | |||
updateImageLabel(1, images.length); // Set the label for the first image immediately | |||
} | } | ||
} | } | ||
// Format paragraphs | // Format paragraphs | ||
function formatParagraphs(text) { | function formatParagraphs(text) { | ||
var paragraphs = text.split('\n').filter(function (p) { return p.trim() !== '' }); | var paragraphs = text.split('\n').filter(function (p) { return p.trim() !== '' }); | ||
return paragraphs.map(function (p) { return '<p>' + p.trim() + '</p>'; }).join(''); | 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()); | |||
}); | }); | ||
} | } | ||
function | 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."); | |||
//$('.view-container-buttons').hide(); | |||
//$('div.filtered-view.filtered-list').css('padding-top', '38px'); | |||
} else { | |||
filtersDiv.attr('style', 'display: none !important'); | |||
toggleButton.text('[Open]'); | |||
} | console.log("Filters hidden."); | ||
//$('.view-container-buttons').show(); | |||
//$('div.filtered-view.filtered-list').css('padding-top', '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'); | var isRelatedArticle = $(cardElement).hasClass('related-article'); | ||
console.log('Is this a related article?:', isRelatedArticle); | |||
showArticleWrapper.css('display', 'block'); | showArticleWrapper.css('display', 'block'); | ||
// Set new width using .each() to iterate over the jQuery objects | |||
$.each(listLists, function(index, list) { | |||
list.css('cssText', 'width: 60% !important;'); | |||
}); | |||
// Adjust width of filtered-list-items in #list | |||
filteredListItems.css('width', 'calc(33.333% - 0px)'); | |||
// Clear existing content in modal | // Clear existing content in modal | ||
$('#article-title').empty(); | $('#article-title').empty(); | ||
Line 480: | Line 286: | ||
} | } | ||
// Apply the fade-out effect to both #list and #list-list elements | // Apply the fade-out effect to both #list and #list-list elements | ||
$(' | $('#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 | |||
} | |||
// closeModal function | |||
function closeModal() { | function closeModal() { | ||
showArticleWrapper.hide(); | showArticleWrapper.hide(); | ||
// Revert width of filtered-list-items in listLists | |||
$.each(listLists, function(index, list) { | |||
list.width(originalWidths[index]); | |||
}); | |||
// Revert width of filtered-list-items in #list | |||
filteredListItems.css('width', 'calc(20% - 0px)'); | |||
} | } | ||
function setShowArticleRotationEffect() { | // Button to open [Nr.s] | ||
$('.button-open-nrs').click(function() { | |||
var queryDiv = $('.entry-nrs-query'); | |||
if (queryDiv.css('display') === 'none') { | |||
queryDiv.css('display', 'flex'); | |||
} else { | |||
queryDiv.css('display', 'none'); | |||
} | |||
}); | |||
function setShowArticleRotationEffect() { | |||
const offset = 20; | const offset = 20; | ||
const showArticle = document.querySelector('#show-article'); | const showArticle = document.querySelector('#show-article'); | ||
Line 513: | Line 327: | ||
} | } | ||
// | // Delegate the mousedown event for both block view and list view pages | ||
$('#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) { | |||
if ($(event.target).closest('.people a, .type a').length) { | |||
return; // Clicked on a link inside '.people' or '.type', do nothing | |||
}); | } | ||
openModal(this, event); // Pass the event object to openModal | |||
setShowArticleRotationEffect(); | |||
}); | |||
$('#show-article-wrapper').on('mousedown', '.related-article', function(event) { | |||
openModal(this, event); // Call openModal when a related-article is clicked | |||
setShowArticleRotationEffect(); | |||
}); | |||
function setupImageToggle(images) { | |||
var currentIndex = 0; | |||
function toggleImage() { | |||
currentIndex = (currentIndex + 1) % images.length; | |||
var image = images[currentIndex]; | |||
updateImageLabel(currentIndex + 1, images.length); // Update the label on toggle | |||
$('#article-content').find('.article-images').html(getImageHtml(image, currentIndex, images.length)); | |||
} | |||
$('#article-content').on('click', '.image-container img', function() { | |||
toggleImage(); | |||
}); | |||
} | |||
function getImageHtml(image, currentIndex, totalImages) { | |||
var imageLabel = (currentIndex + 1) + '/' + totalImages + ' IMAGES'; | |||
return '<p class="article-label-image">' + imageLabel + '</p>' + | |||
'<div class="image-container">' + | |||
'<img src="' + image.src + '" alt="' + image.alt + '">' + | |||
'<div class="' + image.captionClass + '">' + image.caption + '</div>' + | |||
'</div>'; | |||
} | |||
function updateImageLabel(currentIndex, totalImages) { | |||
var imageLabel = currentIndex + '/' + totalImages + ' IMAGES'; | |||
$('#article-content .article-label-image').text(imageLabel); // Update or set the label text | |||
} | |||
// Close modal with Close button | // Close modal with Close button | ||
$('#close-button').on('click', function () { | $('#close-button').on('click', function () { | ||
$(' | $('#list, #list-list, #list-list-1, #list-list-2, #list-list-3, #list-block-1, #list-block-2, #list-block-3').removeClass('fade-out'); | ||
closeModal(); | closeModal(); | ||
}); | }); | ||
Line 532: | Line 383: | ||
if (!areFiltersActive) { | if (!areFiltersActive) { | ||
if (isOutsideWrapper && !isOnCard) { | if (isOutsideWrapper && !isOnCard) { | ||
$(' | console.log('Closing modal from outside wrapper and not on card'); | ||
$('#list, #list-list, #list-list-1, #list-list-2, #list-list-3, #list-block-1, #list-block-2, #list-block-3').removeClass('fade-out'); | |||
showArticleWrapper.css('display', 'none'); | showArticleWrapper.css('display', 'none'); | ||
closeModal(); // Use closeModal() for cleanup | closeModal(); // Use closeModal() for cleanup | ||
Line 540: | Line 392: | ||
// Hover effect for scrolling | // Hover effect for scrolling | ||
showArticleWrapper.hover(function () { | |||
// On hover, enable scrolling on #show-article-wrapper | // On hover, enable scrolling on #show-article-wrapper | ||
$(this).css('overflow-y', 'auto'); | $(this).css('overflow-y', 'auto'); | ||
Line 547: | Line 399: | ||
$(this).css('overflow-y', 'hidden'); | $(this).css('overflow-y', 'hidden'); | ||
}); | }); | ||
// ALL VIEWS IN ONE PAGE | |||
// Handle List View Button | |||
$(".list-view-button").click(function() { | |||
// Show list view and list sorting buttons, hide block view and block sorting buttons | |||
$(".list-view").show(); | |||
$(".block-view").hide(); | |||
$(".list-sorting-buttons").show(); | |||
$(".block-sorting-buttons").hide(); | |||
$(".list-view > div").hide(); | |||
$(".chronicle-list").show(); | |||
}); | |||
// Handle Block View Button | |||
$(".block-view-button").click(function() { | |||
// Show block view and block sorting buttons, hide list view and list sorting buttons | |||
$(".block-view").show(); | |||
$(".list-view").hide(); | |||
$(".block-sorting-buttons").css('display', 'flex'); | |||
$(".list-sorting-buttons").hide(); | |||
$(".block-view > div").hide(); | |||
$(".chronicle-block").show(); | |||
}); | |||
// Handle List Sorting Buttons | |||
$(".chronicle-list-button").click(function() { | |||
// Show only the chronicle list | |||
$(".list-view > div").hide(); | |||
$(".chronicle-list").show(); | |||
}); | |||
$(".random-list-button").click(function() { | |||
// Show only the random list | |||
$(".list-view > div").hide(); | |||
$(".random-list").show(); | |||
}); | |||
$(".alphabetical-list-button").click(function() { | |||
// Show only the alphabetical list | |||
$(".list-view > div").hide(); | |||
$(".alphabetical-list").show(); | |||
}); | |||
// Similar event handlers can be added for block view buttons if needed | |||
// Handle Block Sorting Buttons | |||
$(".chronicle-block-button").click(function() { | |||
// Show only the chronicle block | |||
$(".block-view > div").hide(); | |||
$(".chronicle-block").show(); | |||
}); | |||
$(".random-block-button").click(function() { | |||
// Show only the random block | |||
$(".block-view > div").hide(); | |||
$(".random-block").show(); | |||
}); | |||
$(".alphabetical-block-button").click(function() { | |||
// Show only the alphabetical block | |||
$(".block-view > div").hide(); | |||
$(".alphabetical-block").show(); | |||
}); | |||
// NEW TEST | |||
// Handle Block View Button in home | |||
$(".home-block-view-button").click(function() { | |||
$(".home-block-view").show(); | |||
$(".home-list-view").hide(); | |||
$(".home-block-sorting-buttons").css('display', 'flex'); | |||
$(".home-list-sorting-buttons").hide(); | |||
$(".home-block-view > div").hide(); | |||
$(".home-chronicle-block").show(); | |||
}); | |||
// Handle List View Button in home | |||
$(".home-list-view-button").click(function() { | |||
$(".home-list-view").show(); | |||
$(".home-block-view").hide(); | |||
$(".home-list-sorting-buttons").css('display', 'flex'); | |||
$(".home-block-sorting-buttons").hide(); | |||
$(".home-list-view > div").hide(); | |||
$(".home-chronicle-list").show(); | |||
}); | |||
// Handle List Sorting Buttons in home for the chronicle list | |||
$(".home-chronicle-list-button").click(function() { | |||
// Show only the chronicle list | |||
$(".home-list-view > div").hide(); | |||
$(".home-chronicle-list").show(); | |||
}); | |||
// Similarly, you would update the handlers for the random list button and alphabetical list button: | |||
$(".home-random-list-button").click(function() { | |||
// Show only the random list | |||
$(".home-list-view > div").hide(); | |||
$(".home-random-list").show(); | |||
}); | |||
$(".home-alphabetical-list-button").click(function() { | |||
// Show only the alphabetical list | |||
$(".home-list-view > div").hide(); | |||
$(".home-alphabetical-list").show(); | |||
}); | |||
// Handle Block Sorting Buttons | |||
$(".home-chronicle-block-button").click(function() { | |||
// Show only the chronicle block | |||
$(".home-block-view > div").hide(); | |||
$(".home-chronicle-block").show(); | |||
}); | |||
$(".home-random-block-button").click(function() { | |||
// Show only the random block | |||
$(".home-block-view > div").hide(); | |||
$(".home-random-block").show(); | |||
}); | |||
$(".home-alphabetical-block-button").click(function() { | |||
// Show only the alphabetical block | |||
$(".home-block-view > div").hide(); | |||
$(".home-alphabetical-block").show(); | |||
}); | |||
// Check if div with class "mw-search-results-info" exists | |||
if ($('.mw-search-results-info').length) { | |||
// Select the child <p> element and check its content | |||
var $paragraph = $('.mw-search-results-info > p'); | |||
var currentText = $paragraph.text().trim(); | |||
// Check if the current text is not "There were no results matching the query." | |||
if (currentText !== "There were no results matching the query.") { | |||
// Overwrite the content with "Search results" | |||
$paragraph.text('Pages related to your Search'); | |||
} | |||
} | |||
// Object to store encountered titles | |||
var encounteredTitles = {}; | |||
// Iterate over each search result | |||
$('.mw-search-result-heading').each(function() { | |||
// Get the title of the current search result | |||
var title = $(this).find('a').attr('title'); | |||
// Check if the title has already been encountered | |||
if (encounteredTitles[title]) { | |||
// Hide the duplicate search result | |||
$(this).hide(); | |||
} else { | |||
// Mark the title as encountered | |||
encounteredTitles[title] = true; | |||
} | |||
}); | |||
// Remove unwanted white spaces between lines | |||
$('.mw-search-results-container').contents().filter(function() { | |||
return this.nodeType === 3; // Filter text nodes | |||
}).remove(); | |||
// Edits regarding Search Results | |||
// Define the new form HTML as a string | |||
var newFormHtml = '<form action="/index.php" id="searchform">' + | |||
'<div id="simpleSearchSpecial" class="right-inner-addon">' + | |||
'<span>[ Search ]</span>' + | |||
'<input class="form-control" name="search" placeholder="" title="Search [alt-shift-f]" accesskey="f" id="searchInput" tabindex="1" autocomplete="off" type="search">' + | |||
'<span class="closing-bracket">]</span>' + | |||
'<input value="Special:Search" name="title" type="hidden">' + | |||
'</div>' + | |||
'</form>'; | |||
// Replace the div with id="searchText" with the new form | |||
$('#searchText').replaceWith(newFormHtml); | |||
// Target the button based on its complex class structure | |||
$(".oo-ui-actionFieldLayout-button .oo-ui-buttonInputWidget").remove(); | |||
// Make header-box in Home clickable | |||
$('.head-box').click(function() { | |||
window.location.href = '/Main_Page'; // Redirects to the home page | |||
}); | |||
function filterCardsToShowOnlyTypeAndSubject(typeValue, subjectValue) { | |||
// Initially hide all 'div.filtered-list-item' elements and their child cards | |||
$('div.filtered-list-item').each(function() { | |||
$(this).hide(); // Hides the parent | |||
$(this).find('.card').hide(); // Ensures the child cards are also hidden | |||
}); | |||
// Iterate over each card to apply the filter | |||
$('.card').each(function() { | |||
var typeText = $(this).find('.type a').text().trim(); | |||
var subjectText = $(this).find('.subject').text().trim(); | |||
// Check if the card's type matches 'Book' and if the subject includes 'Activism' | |||
if (typeText === typeValue && subjectText.split(',').map(function(s) { return s.trim(); }).includes(subjectValue)) { | |||
// Show this card's parent 'div.filtered-list-item' and the card itself | |||
$(this).closest('div.filtered-list-item').show(); | |||
$(this).show(); | |||
} | |||
}); | |||
} | |||
// Call the function to filter and display only cards with the type "Book" and subject "Activism" | |||
filterCardsToShowOnlyTypeAndSubject('Book', 'Activism'); | |||
}); | }); |