4,114
edits
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
Line 11: | Line 11: | ||
console.log('Found all cards:', cards); | console.log('Found all cards:', cards); | ||
// | // Separate function to show the modal | ||
function showModal(card) { | |||
// Show the fixed column | // Show the fixed column | ||
showArticleWrapper.css('display', 'block'); | showArticleWrapper.css('display', 'block'); | ||
// Update the fixed column content with card information | // Update the fixed column content with card information | ||
var entryNumber = | var entryNumber = card.find('.entry-number').text(); | ||
var title = | var title = card.find('.title').text(); | ||
var people = | var people = card.find('.people').text(); | ||
var type = | var type = card.find('.type').text(); | ||
var entity = | var entity = card.find('.entity').text(); | ||
var discipline = | var discipline = card.find('.discipline').text(); | ||
var subject = | var subject = card.find('.subject').text(); | ||
var description = | var description = card.find('.description').html(); | ||
var reflection = | var reflection = card.find('.reflection').html(); | ||
var quote = | var quote = card.find('.quote').text(); | ||
var modificationDate = | var modificationDate = card.find('.modification-date').text(); | ||
var imageCount = 5; // Change this value based on the maximum number of images | var imageCount = 5; // Change this value based on the maximum number of images | ||
// Store image information in an array | // Store image information in an array | ||
var images = []; | var images = []; | ||
// Loop through possible image containers | // Loop through possible image containers | ||
for (var i = 1; i <= imageCount; i++) { | for (var i = 1; i <= imageCount; i++) { | ||
var imageContainer = | var imageContainer = card.find('.image' + i); | ||
// Check if the image container exists | // Check if the image container exists | ||
Line 70: | Line 66: | ||
updateArticleContent(); | updateArticleContent(); | ||
function updateArticleContent() { | |||
$('#article-title').html('<p class="article-entry-number">' + entryNumber + '</p><p class="article-people">' + people + '</p>'); | $('#article-title').html('<p class="article-entry-number">' + entryNumber + '</p><p class="article-people">' + people + '</p>'); | ||
$('#article-content').html( | $('#article-content').html( | ||
Line 106: | Line 102: | ||
} | } | ||
function getImageHtml(image) { | |||
return '<img src="' + image.src + '" alt="' + image.alt + '">'; | |||
} | |||
function formatParagraphs(text) { | function formatParagraphs(text) { | ||
Line 134: | Line 130: | ||
// Apply the fade-out effect to the #list element | // Apply the fade-out effect to the #list element | ||
$('#list').addClass('fade-out'); | $('#list').addClass('fade-out'); | ||
} | |||
// Attach a click event listener to each card | |||
cards.on('click', function (event) { | |||
// Call the showModal function | |||
showModal($(this)); | |||
// Prevent further propagation to the document | // Prevent further propagation to the document |