mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Defer loading of swiper until used

Browse source
This commit is contained in:
Bill Thornton 2022-09-22 10:23:23 -04:00
parent af616fe2e7
commit f66f435ff9
2 changed files with 95 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

84
src/components/slideshow/slideshow.js
View file

@ -13,10 +13,6 @@ import './style.scss';
import 'material-design-icons-iconfont';
import '../../elements/emby-button/paper-icon-button-light';
import ServerConnections from '../ServerConnections';
//eslint-disable-next-line import/no-unresolved
import { Swiper } from 'swiper/bundle';
//eslint-disable-next-line import/no-unresolved
import 'swiper/css/bundle';
import screenfull from 'screenfull';
/**
@ -345,45 +341,51 @@ export default function (options) {
slides = currentOptions.items;
}
swiperInstance = new Swiper(dialog.querySelector('.slideshowSwiperContainer'), {
direction: 'horizontal',
// Loop is disabled due to the virtual slides option not supporting it.
loop: false,
zoom: {
minRatio: 1,
toggle: true
},
autoplay: !options.interactive || !!options.autoplay,
keyboard: {
enabled: true
},
preloadImages: true,
slidesPerView: 1,
slidesPerColumn: 1,
initialSlide: options.startIndex || 0,
speed: 240,
navigation: {
nextEl: '.btnSlideshowNext',
prevEl: '.btnSlideshowPrevious'
},
// Virtual slides reduce memory consumption for large libraries while allowing preloading of images;
virtual: {
slides: slides,
cache: true,
renderSlide: getSwiperSlideHtml,
addSlidesBefore: 1,
addSlidesAfter: 1
//eslint-disable-next-line import/no-unresolved
import('swiper/css/bundle');
// eslint-disable-next-line import/no-unresolved
import('swiper/bundle').then(({ Swiper }) => {
swiperInstance = new Swiper(dialog.querySelector('.slideshowSwiperContainer'), {
direction: 'horizontal',
// Loop is disabled due to the virtual slides option not supporting it.
loop: false,
zoom: {
minRatio: 1,
toggle: true
},
autoplay: !options.interactive || !!options.autoplay,
keyboard: {
enabled: true
},
preloadImages: true,
slidesPerView: 1,
slidesPerColumn: 1,
initialSlide: options.startIndex || 0,
speed: 240,
navigation: {
nextEl: '.btnSlideshowNext',
prevEl: '.btnSlideshowPrevious'
},
// Virtual slides reduce memory consumption for large libraries while allowing preloading of images;
virtual: {
slides: slides,
cache: true,
renderSlide: getSwiperSlideHtml,
addSlidesBefore: 1,
addSlidesAfter: 1
}
});
swiperInstance.on('autoplayStart', onAutoplayStart);
swiperInstance.on('autoplayStop', onAutoplayStop);
if (useFakeZoomImage) {
swiperInstance.on('zoomChange', onZoomChange);
}
if (swiperInstance.autoplay?.running) onAutoplayStart();
});
swiperInstance.on('autoplayStart', onAutoplayStart);
swiperInstance.on('autoplayStop', onAutoplayStop);
if (useFakeZoomImage) {
swiperInstance.on('zoomChange', onZoomChange);
}
if (swiperInstance.autoplay?.running) onAutoplayStart();
}
/**