4,114
edits
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
Line 38: | Line 38: | ||
setupImageToggle(cardImages); | setupImageToggle(cardImages); | ||
} | } | ||
// Check if there are any images and set up the initial content | |||
if (cardImages.length > 0) { | |||
var initialImage = cardImages[0]; // Use the first image initially | |||
// 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 type = $(this).find('.type').text(); | |||
var entity = $(this).find('.entity').text(); | |||
var discipline = $(this).find('.discipline').text(); | |||
var subject = $(this).find('.subject').text(); | |||
var description = $(this).find('.description').html(); | |||
var reflection = $(this).find('.reflection').html(); | |||
var quote = $(this).find('.quote').text(); | |||
var modificationDate = $(this).find('.modification-date').text(); | |||
// Update the fixed column content | |||
$('#article-title').html('<p class="article-entry-number">' + entryNumber + '</p><p class="article-people">' + people + '</p>'); | |||
$('#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>' + | |||
(image.src ? '<div class="article-images">' + | |||
'<p class="article-label-image">Image(s)</p>' + | |||
'<div class="article-image">' + getImageHtml(image) + | |||
'<div class="caption-image">' + image.caption + '</div></div>' + | |||
'</div>' : '') + | |||
(description ? '<p class="article-label-description">Description:</p>' + | |||
'<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) { | function getImageHtml(image) { | ||
return '<div class="image-container">' + | |||
'<img src="' + image.src + '" alt="' + image.alt + '">' + | |||
'<div class="' + image.captionClass + '">' + image.caption + '</div>' + | |||
'</div>'; | |||
} | |||
function formatParagraphs(text) { | function formatParagraphs(text) { |