4,114
edits
No edit summary Tag: Manual revert |
No edit summary Tag: Reverted |
||
Line 26: | Line 26: | ||
if (imageElem.length) { | if (imageElem.length) { | ||
cardImages.push({ | cardImages.push({ | ||
src: imageElem.attr('src'), | src: imageElem.attr('src'), | ||
alt: imageElem.attr('alt'), | alt: imageElem.attr('alt'), | ||
caption: $(this).find('.caption' + imageClass).text() | caption: $(this).find('.caption' + imageClass).text(), | ||
captionClass: 'caption-image' + i | |||
}); | }); | ||
} | } | ||
Line 40: | Line 40: | ||
// Update the fixed column content with card information | // Update the fixed column content with card information | ||
var entryNumber = $(this).find('.entry-number').text(); | |||
var title = $(this).find('.title').text(); | |||
var people = $(this).find('.people').text(); | var people = $(this).find('.people').text(); | ||
var type = $(this).find('.type').text(); | var type = $(this).find('.type').text(); | ||
Line 51: | Line 51: | ||
var quote = $(this).find('.quote').text(); | var quote = $(this).find('.quote').text(); | ||
var modificationDate = $(this).find('.modification-date').text(); | var modificationDate = $(this).find('.modification-date').text(); | ||
$('#article-title').html('<p class="article-entry-number">' + entryNumber + '</p><p class="article-people">' + people + '</p>'); | |||
if (cardImages.length > 0) { | |||
var initialImage = cardImages[0]; // Use the first image initially | |||
$('#article-content').html( | |||
'<p class="article-title">' + title + '</p>' + | |||
'<p class="article-type">' + type + '</p>' + | |||
'<div class="article-metadata">' + | |||
'<div class="article-metadata-column">' + | |||
'<p class="article-metadata-label">Entity</p>' + | |||
'<p class="article-metadata-value">' + entity + '</p>' + | |||
'</div>' + | |||
'<div class="article-metadata-column">' + | |||
'<p class="article-metadata-label">Discipline</p>' + | |||
'<p class="article-metadata-value">' + discipline + '</p>' + | |||
'</div>' + | |||
'<div class="article-metadata-column">' + | |||
'<p class="article-metadata-label">Subject(s)</p>' + | |||
'<p class="article-metadata-value">' + subject + '</p>' + | |||
'</div>' + | |||
'</div>' + | |||
'<div class="article-images">' + | |||
'<p class="article-label-image">Image(s)</p>' + | |||
'<div class="article-image">' + getImageHtml(initialImage) + '</div>' + | |||
'</div>' + | |||
(description ? '<p class="article-label-description">Description:</p>' + | |||
'<div class="article-description">' + formatParagraphs(description) + '</div>' : '') + | '<div class="article-description">' + formatParagraphs(description) + '</div>' : '') + | ||
(reflection ? '<p class="article-label-reflection">Reflection:</p>' + | |||
'<div class="article-reflection">' + formatParagraphs(reflection) + '</div>' : '') + | |||
(quote ? '<p class="article-label-quote">Quote:</p>' + | |||
'<div class="article-quote">“' + formatParagraphs(quote) + '”</div>' : '') + | |||
'<p class="article-label-modification-date">Added on</p>' + | |||
'<div class="article-modification-date">' + formatSimpleDate(modificationDate) + '</div>' | |||
); | ); | ||
} | |||
function getImageHtml(image) { | |||
return '<div class="image-container">' + | |||
'<img src="' + image.src + '" alt="' + image.alt + '">' + | |||
'<div class="' + image.captionClass + '">' + image.caption + '</div>' + | |||
'</div>'; | |||
} | |||
function | function setupImageToggle(images) { | ||
var currentIndex = 0; | |||
function toggleImage() { | |||
currentIndex = (currentIndex + 1) % images.length; | |||
var image = images[currentIndex]; | |||
var articleImageContainer = $('#article-content').find('.article-image'); | |||
articleImageContainer.html(getImageHtml(image)); | |||
} | |||
$('#article-content').on('click', '.article-image img', function () { | |||
toggleImage(); | |||
}); | |||
} | |||
function formatParagraphs(text) { | function formatParagraphs(text) { | ||
Line 121: | Line 131: | ||
event.stopPropagation(); | event.stopPropagation(); | ||
}); | }); | ||
// Attach a mousedown event listener to close the fixed column | // Attach a mousedown event listener to close the fixed column |