FluidbookSlideshow.prototype = {
initSlideshow: function (id) {
- var $slideshow = $('#' + id),
- thumbnailsID = id + '_thumbnails',
- $thumbnails;
+ var $slideshow = $('#' + id);
+ var thumbnailsID = id + '_thumbnails';
+ var $thumbnails;
+ var showThumbnails = $slideshow.data('thumbnails') == '1';
if ($slideshow.length == 0) return false;
+
// Dynamically add thumbnails from full sized images
// Images have to load anyway so we can reuse full images for thumbnails
- $('<div class="fb-slideshow-thumbnails" id="' + thumbnailsID + '"></div>').appendTo($slideshow.parent());
- $thumbnails = $('#' + thumbnailsID);
+ if (showThumbnails) {
+ $('<div class="fb-slideshow-thumbnails" id="' + thumbnailsID + '"></div>').appendTo($slideshow.parent());
+ $thumbnails = $('#' + thumbnailsID);
- $slideshow.find('img').each(function () {
- var img = $(this).clone();
- $thumbnails.append(img);
- });
+ $slideshow.find('img').each(function () {
+ var img = $(this).clone();
+ $thumbnails.append(img);
+ });
+ }
- // Main image slider
- $slideshow.slick({
+ var slideshowParams = {
variableWidth: false,
- asNavFor: '#' + thumbnailsID, // Synced with thumbnails slider
- infinite: false,
+ infinite: true,
draggable: true
- });
+ };
+ if (showThumbnails) {
+ slideshowParams.asNasFor = '#' + thumbnailsID; // Synced with thumbnails slider
+ }
+ // Main image slider
+ $slideshow.slick(slideshowParams);
- // Thumbnails slider
- $thumbnails.slick({
- slidesToShow: 6,
- asNavFor: '#' + id, // Synced with main slider
- focusOnSelect: true,
- variableWidth: true,
- arrows: false,
- draggable: true,
- swipeToSlide: true,
- infinite: false,
- centerMode: false
- });
+ if (showThumbnails) {
+ // Thumbnails slider
+ $thumbnails.slick({
+ slidesToShow: 6,
+ asNavFor: '#' + id, // Synced with main slider
+ focusOnSelect: true,
+ variableWidth: true,
+ arrows: false,
+ draggable: true,
+ swipeToSlide: true,
+ infinite: true,
+ centerMode: false
+ });
+ }
}
}