4,554
edits
No edit summary |
No edit summary |
||
Line 178: | Line 178: | ||
if (isRelatedArticle) { | if (isRelatedArticle) { | ||
// Handle card elements (existing logic) | |||
var cardImages = []; | |||
for (var i = 1; i <= 5; i++) { | |||
var imageClass = '.related-article-image' + i; | |||
var captionClass = '.related-article-caption-image' + i; | |||
var imageElem = $(cardElement).find(imageClass + ' img'); | |||
if (imageElem.length) { | |||
var captionText = $(cardElement).find(imageClass + ' ' + captionClass).text(); | |||
cardImages.push({ | |||
link: $(cardElement).find(imageClass + ' a').attr('href'), | |||
src: imageElem.attr('src'), | |||
alt: imageElem.attr('alt'), | |||
caption: captionText, | |||
captionClass: 'related-article-caption-image' + i | |||
}); | |||
} | |||
} | |||
if (cardImages.length > 1) { | |||
setupImageToggle(cardImages); | |||
} | |||
// Handle related-article elements | // Handle related-article elements | ||
var entryNumber = $(cardElement).find('.related-article-entry-number').text(); | var entryNumber = $(cardElement).find('.related-article-entry-number').text(); | ||
Line 219: | Line 241: | ||
'</div>'; | '</div>'; | ||
// Add images if any | |||
if (cardImages.length > 0) { | |||
var initialImage = cardImages[0]; // Use the first image initially | |||
articleContentHtml += | |||
'<div class="article-images">' + | |||
getImageHtml(initialImage, 0, cardImages.length) + | |||
'</div>'; | |||
} | |||
// Add non-image content (description, reflection, etc.) | |||
articleContentHtml += | articleContentHtml += | ||
(description ? '<p class="article-label-description">Description</p>' + | (description ? '<p class="article-label-description">Description</p>' + | ||
Line 230: | Line 262: | ||
$('#article-content').html(articleContentHtml); | $('#article-content').html(articleContentHtml); | ||
$('#related-articles').html(relatedArticlesHtml); | |||
if (relatedArticlesHtml && relatedArticlesHtml.trim().length > 0) { | |||
$('#related-articles').html('<div class="related-articles-label">Related Articles</div><div class="related-articles-container">' + relatedArticlesHtml + '</div>').show(); | |||
} else { | |||
$('#related-articles').html('<div class="related-articles-label">No related articles found.</div>').show(); | |||
} | |||
} else { | } else { |