4,476
edits
No edit summary Tags: Manual revert Reverted |
No edit summary Tag: Manual revert |
||
Line 43: | Line 43: | ||
// Check if the specific element exists on the page | // Check if the specific element exists on the page | ||
if ($('#show-article-wrapper-entry').length > 0 || $('#show-article-wrapper').length > 0) { | if ($('#show-article-wrapper-entry').length > 0 || $('#show-article-wrapper').length > 0) { | ||
var images = []; // Initialize an empty array to store the images | var images = []; // Initialize an empty array to store the images | ||
Line 61: | Line 60: | ||
if (images.length > 0) { | if (images.length > 0) { | ||
setupImageToggle(images); // Call the setupImageToggle function with the images array | setupImageToggle(images); // Call the setupImageToggle function with the images array | ||
updateImageLabel(1, images.length); // Set the label for the first image immediately | |||
} | } | ||
} | } | ||
Line 488: | Line 488: | ||
function setupImageToggle(images) { | 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) { | 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 | |||
} | |||
$(document).on('mousedown', function (event) { | $(document).on('mousedown', function (event) { |