| 1 |
jQuery(window).on('load', function() { |
| 2 |
ph_init_slideshow(); |
| 3 |
|
| 4 |
// Ensure images are fully loaded before resizing |
| 5 |
jQuery('#carousel.thumbnails .slides img').each(function() { |
| 6 |
jQuery(this).on('load', function() { |
| 7 |
setTimeout(function() { jQuery(window).trigger('resize'); }, 500); |
| 8 |
}); |
| 9 |
// Trigger the load event for cached images |
| 10 |
if (this.complete) jQuery(this).trigger('load'); |
| 11 |
}); |
| 12 |
}); |
| 13 |
|
| 14 |
jQuery(window).on('resize', function() { |
| 15 |
// Set height of all thumbnails to be the same (i.e., height of the first one) |
| 16 |
jQuery('#carousel.thumbnails .slides img').css('height', 'auto'); |
| 17 |
var thumbnail_height = jQuery('#carousel.thumbnails .slides img:eq(0)').height(); |
| 18 |
|
| 19 |
// Apply the height to all thumbnails if it's greater than 0 |
| 20 |
if (thumbnail_height > 0) { |
| 21 |
jQuery('#carousel.thumbnails .slides img').each(function() { |
| 22 |
jQuery(this).height(thumbnail_height); |
| 23 |
}); |
| 24 |
} else { |
| 25 |
// Force redraw if height is 0 |
| 26 |
jQuery('#carousel.thumbnails .slides img').hide().show(); |
| 27 |
} |
| 28 |
}); |
| 29 |
|
| 30 |
jQuery(function ($) { |
| 31 |
document.addEventListener('click', function (e) { |
| 32 |
var link = e.target.closest('#slider .slides li a[data-fancybox]'); |
| 33 |
if (!link) return; |
| 34 |
|
| 35 |
var $link = $(link); |
| 36 |
var $li = $link.closest('li'); |
| 37 |
var $slider = $link.closest('.flexslider'); |
| 38 |
var group = $link.attr('data-fancybox'); |
| 39 |
var href = $link.attr('href') || ''; |
| 40 |
|
| 41 |
// Only handle actual image links |
| 42 |
if (!href.match(/\.(jpg|jpeg|png|gif|webp)(\?.*)?$/i)) { |
| 43 |
return; |
| 44 |
} |
| 45 |
|
| 46 |
// Stop Fancybox's default delegated handler from seeing this click |
| 47 |
e.preventDefault(); |
| 48 |
e.stopPropagation(); |
| 49 |
e.stopImmediatePropagation(); |
| 50 |
|
| 51 |
var $realItems = $slider.find('.slides li:not(.clone) a[data-fancybox="' + group + '"]'); |
| 52 |
|
| 53 |
var startIndex; |
| 54 |
if ($li.hasClass('clone')) { |
| 55 |
startIndex = $realItems.filter(function () { |
| 56 |
return $(this).attr('href') === href; |
| 57 |
}).first().parent().index(); |
| 58 |
} else { |
| 59 |
startIndex = $realItems.index(link); |
| 60 |
} |
| 61 |
|
| 62 |
if (startIndex < 0) { |
| 63 |
startIndex = 0; |
| 64 |
} |
| 65 |
|
| 66 |
$.fancybox.open( |
| 67 |
$realItems.map(function () { |
| 68 |
return { |
| 69 |
src: $(this).attr('href'), |
| 70 |
opts: { |
| 71 |
caption: $(this).attr('title') || '' |
| 72 |
} |
| 73 |
}; |
| 74 |
}).get(), |
| 75 |
{ |
| 76 |
loop: true |
| 77 |
}, |
| 78 |
startIndex |
| 79 |
); |
| 80 |
}, true); // <- capture phase |
| 81 |
}); |
| 82 |
|
| 83 |
function ph_init_slideshow() |
| 84 |
{ |
| 85 |
// Get all carousel elements on the page |
| 86 |
jQuery('[id="slider"]').each(function() |
| 87 |
{ |
| 88 |
var slider = jQuery(this); |
| 89 |
|
| 90 |
// Get the parent container of this carousel |
| 91 |
var parentContainer = slider.parent(); |
| 92 |
|
| 93 |
// Find the related slider within the same parent container |
| 94 |
var carousel = parentContainer.find('#carousel'); |
| 95 |
|
| 96 |
// Initialize the carousel and slider within this parent container |
| 97 |
carousel.flexslider({ |
| 98 |
animation: "slide", |
| 99 |
controlNav: false, |
| 100 |
animationLoop: true, |
| 101 |
slideshow: false, |
| 102 |
itemWidth: 150, |
| 103 |
itemMargin: 5, |
| 104 |
asNavFor: slider |
| 105 |
}); |
| 106 |
|
| 107 |
slider.flexslider({ |
| 108 |
animation: "slide", |
| 109 |
controlNav: false, |
| 110 |
animationLoop: true, |
| 111 |
slideshow: false, |
| 112 |
sync: carousel, |
| 113 |
smoothHeight: true |
| 114 |
}); |
| 115 |
}); |
| 116 |
} |
